jquery中关于对象类型的判断原理

Posted 2020-09-15 Edison韩

class2type[ core_toString.call(obj) ]

 

jquery中关于对象类型的判断原理

jquery源码中关于类型判断的工具函数为type，调用方法为$.type()或者jQuery.type()，关于type函数的实现为：

1 type: function( obj ) {
2     if ( obj == null ) {
3         return String( obj );
4     }
5     // Support: Safari <= 5.1 (functionish RegExp)
6     return typeof obj === "object" || typeof obj === "function" ?
7             class2type[ core_toString.call(obj) ] || "object" :
8             typeof obj;
9 }       

关于第一个if判断中的代码为如果你传入的参数为undefined或者null（2 - 4），这个函数会返回"undefined"或者"null"；接下来看这个函数的return返回值（6 - 8），这块就比较绕了，是一个比较大兴的三目运算，这个三目运算的条件是一个或运算（6），就是判断传入的参数是否为基本数据类型，如果是，则走基本类型的所用的typeof方法（8）；如果不是，则走引用类型的判断（7）.

引用类型的判断处有class2type，是jquery初始化的定义的一个空对象，jquery源码引入的时候设置为下边的对象：

 1 {
 2         "[object Boolean]": "boolean",
 3         "[object Number]": "number",
 4         "[object String]": "string"
 5         "[object Function]": "function",
 6         "[object Array]": "array",
 7         "[object Date]": "date",
 8         "[object RegExp]": "regexp",
 9         "[object Object]": "object"
10         "[object Error]": "error"
11 }

这个class2type对象的实现过程如下：

1 // Populate the class2type map
2 jQuery.each("Boolean Number String Function Array Date RegExp Object Error".split(" "), function(i, name) {
3     class2type[ "[object " + name + "]" ] = name.toLowerCase();
4 });

现在再回到引用类型的判断中去，发现下边这个

1 class2type[ core_toString.call(obj) ]

其实说白了就是利用了原生的toString方法，这是Object的方法，我们知道js中所有的对象的方法都是通过继承Object得来的，但是所有除Object对象的其他对象的toString的方法跟Obect的toString方法只是同名，其他对象重写了继承来的toString方法（我猜的，因为Object.call(new Array(1,2)的结果跟new Array(1,2)不一样），说到方法重写，我记得在js原型继承中，子类(应该也可以说是实例吧)可以重写父类原型中的方法。

写在最后，我建议大家以后在判断类型的时候用Object.toString.call()来判断，这样可以避免typeof对引用类型全部返回"object"的尴尬情景