博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浅谈Object.prototype.toString.call()方法
阅读量:7249 次
发布时间:2019-06-29

本文共 2610 字,大约阅读时间需要 8 分钟。

在JavaScript里使用typeof判断数据类型,只能区分基本类型,即:number、string、undefined、boolean、object。

对于null、array、function、object来说,使用typeof都会统一返回object字符串。
要想区分对象、数组、函数、单纯使用typeof是不行的。在JS中,可以通过Object.prototype.toString方法,判断某个对象之属于哪种内置类型。
分为null、string、boolean、number、undefined、array、function、object、date、math。

  1. 判断基本类型

Object.prototype.toString.call(null); // "[object Null]"

Object.prototype.toString.call(undefined); // "[object Undefined]"
Object.prototype.toString.call(“abc”);// "[object String]"
Object.prototype.toString.call(123);// "[object Number]"
Object.prototype.toString.call(true);// "[object Boolean]"

  1. 判断原生引用类型

函数类型

Function fn(){
console.log(“test”);
}
Object.prototype.toString.call(fn); // "[object Function]"
日期类型
var date = new Date();
Object.prototype.toString.call(date); // "[object Date]"
数组类型
var arr = [1,2,3];
Object.prototype.toString.call(arr); // "[object Array]"
正则表达式
var reg = /[hbc]at/gi;
Object.prototype.toString.call(reg); // "[object RegExp]"
自定义类型
function Person(name, age) {

this.name = name;this.age = age;

}

var person = new Person("Rose", 18);
Object.prototype.toString.call(arr); // "[object Object]"
很明显这种方法不能准确判断person是Person类的实例,而只能用instanceof 操作符来进行判断,如下所示:

console.log(person instanceof Person); // true

  1. 判断原生JSON对象

var isNativeJSON = window.JSON && Object.prototype.toString.call(JSON);

console.log(isNativeJSON);// 输出结果为”[object JSON]”说明JSON是原生的,否则不是;
注意:Object.prototype.toString()本身是允许被修改的,而我们目前所讨论的关于Object.prototype.toString()这个方法的应用都是假设toString()方法未被修改为前提的。

  1. 实例:为Array对象添加一个去除重复项的方法

input

[false, true, undefined, null, NaN, 0, 1, {}, {}, 'a', 'a', NaN].uniq()
output
[false, true, undefined, null, NaN, 0, 1, {}, {}, 'a']
这里要注意,NaN === NaN 为false,{} === {}为false。

Array.prototype.uniq = function () {

if (!this.length || this.length == 0) return this;var res = [], key, hasNaN = false, temp = {};for (var i = 0 ; i < this.length; i++) {    if (typeof this[i] === 'object') {        res.push(this[i]);    } else if (this[i] != this[i]) { // 如果当前遍历元素是NaN        if (!hasNaN) {            res.push(this[i]);            hasNaN = true;        }    } else {        key = typeof(this[i]) + this[i];        if (!temp[key]) {            res.push(this[i]);            temp[key] = true;        }    }}return res;

}

另一种解法:

Array.prototype.uniq = function () {

var res = [];var flag = true;this.forEach(function(x) {    if (res.indexOf(x) == -1) {        if (x != x) {            if (flag) {                res.push(x);                flag = false;            }        } else {            res.push(x);        }    }})return res;

}

小礼物走一走,

作者:公子七

链接:
來源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

你可能感兴趣的文章
《Office 365开发入门指南》上市说明和读者服务
查看>>
Docker生态会重蹈Hadoop的覆辙吗?
查看>>
WPF换肤之八:创建3D浏览效果
查看>>
JEECG环境搭建(Maven版本)-总结Eclipse
查看>>
HTTP第一篇【简单了解HTTP、与HTTP相关的协议】
查看>>
Python生成随机验证码
查看>>
Python学习笔记(3)——数据类型和变量
查看>>
03、微信小程序之 永不过时的HelloWorld
查看>>
NFS配置不当那些事
查看>>
[译] 如何写出更好的 React 代码?
查看>>
一起撸个朋友圈吧(step3) - ListAdapter篇
查看>>
LeetCode 642 号问题:设计搜索自动补全系统
查看>>
探究Android View 绘制流程,Canvas 的由来
查看>>
JS原生交互
查看>>
[译] JavaScript 工作原理:Web Worker 的内部构造以及 5 种你应当使用它的场景
查看>>
Android使用Path仿支付宝支付成功失败动画
查看>>
聊聊rocketmq的DailyRollingFileAppender
查看>>
HTTP/2
查看>>
[单刷APUE系列]第十七章——高级进程间通信
查看>>
分布式之消息队列的特点、选型、及应用场景详解
查看>>