JavaScript类型检查与内部属性[[Class]]

来源:互联网 发布:殷保华一线法源码 编辑:程序博客网 时间:2024/05/16 06:55

所有对象都包含有一个内部属性[[Class]]
我们不能直接访问这个属性,但是我们可以通过一种方法访问
这种方法就是Object.prototype.toString.call(...)
这也是比较靠谱的检查类型的方法(instanceof、constructor等等不靠谱)

比如说我们检测一个数组

Object.prototype.toString.call([1,2,3]);

控制台打印"[object Array]"
这里面的“Array”实际上就是调用了原生函数Array()内部的[[Class]]属性
我们可以封装一个检测类型的函数

function classOf(obj){    return Object.prototype.toString.call(obj).slice(8,-1);}

函数很简单,单纯地调用了Object原型上的toString方法然后截取对我们有用的信息
我们可以来试试这个函数

console.log(classOf({'a':1}));console.log(classOf([1,2,3]));console.log(classOf(function a(){}));console.log(classOf(/a/));console.log(classOf(123));console.log(classOf('abc'));console.log(classOf(true));console.log(classOf(Symbol()));console.log(classOf(undefined));console.log(classOf(null));

控制台打印

可是我们发现不仅仅是对象,就连基本类型值string、number、boolean都可以打印
这是因为JavaScript为基本类型值包装了一个封装对象
使它们变成了对象,而String()、Number()、Boolean()上有属性[[Class]]
这里虽然undefined、null没有对应的原生函数Undefined()和Null(),但仍然有内部属性返回

通过这个函数我们可以进行精准的判断类型
甚至可以判断参数列表

function demo(){    console.log(classOf(arguments));}demo();//"Arguments"

回到Object.prototype.toString.call(…)为什么要通过这么麻烦的一串来判断类型呢
我们可以看看直接调用toString()会发生什么

console.log({'a':1}.toString());console.log([1,2,3].toString());console.log(function a(){}.toString());console.log(/a/.toString());console.log(123..toString());// 只写一个点会被当成小数点,所以再写一个点代表方法调用console.log('abc'.toString());console.log(true.toString());console.log(Symbol().toString());// 基本类型调用方法,会自动封装为对象// 不能使用undefined.toString()或null.toString()会报错,因为没有对应的封装对象

可以看到只有普通的对象返回了我们想要的,
这是因为普通对象直接调用了顶级原型Object上的toString方法
而数组、函数以及这些基本包装对象它们继承了Obejct的同时
重写了一些方法
在查找toString方法的时候,一定是自己原型链上的方法优先被找到
所以我们就需要利用call调用顶级原型Object.prototype上d的toString方法

==主页传送门==

4 0
原创粉丝点击