欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

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

程序员文章站 2022-04-24 14:17:53
...

所有对象都包含有一个内部属性[[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));

控制台打印
JavaScript类型检查与内部属性[[Class]]

可是我们发现不仅仅是对象,就连基本类型值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()会报错,因为没有对应的封装对象

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

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

以上就是JavaScript类型检查与内部属性[[Class]]的内容,更多相关内容请关注PHP中文网(www.php.cn)!