详解ECMAScript7规范中instanceof操作符(附实例)
本文主要讲解ECMAScript7规范中的instanceof操作符。
预备知识
有名的Symbols
“有名”的Symbols指的是内置的符号,它们定义在Symbol对象上。ECMAScript7中使用了@@name的形式引用这些内置的符号,比如下面会提到的@@hasInstance,其实就是Symbol.hasInstance。
InstanceofOperator(O, C)
O instanceof C在内部会调用InstanceofOperator(O, C)抽象操作,该抽象操作的步骤如下:
如果C的数据类型不是对象,抛出一个类型错误的异常;
让instOfHandler等于GetMethod(C, @@hasInstance),大概语义就是获取对象C的@@hasInstance属性的值;
如果instOfHandler的值不是undefined,那么:
返回ToBoolean(? Call(instOfHandler, C, « O »))的结果,大概语义就是执行instOfHandler(O),然后把调用结果强制转化为布尔类型返回。
如果C不能被调用,抛出一个类型错误的异常;
返回OrdinaryHasInstance(C, O)的结果。
OrdinaryHasInstance(C, O)
OrdinaryHasInstance(C, O)抽象操作的步骤如下:
如果C不能被调用,返回false;
如果C有内部插槽[[BoundTargetFunction]],那么:
让BC等于C的内部插槽[[BoundTargetFunction]]的值;
返回InstanceofOperator(O, BC)的结果;
如果O的类型不是对象,返回false;
让P等于Get(C, "prototype"),大概语义是获取C.prototype的值;
如果P的数据类型不是对象,抛出一个类型错误的异常;
重复执行下述步骤:
让O等于O.[[GetPrototypeOf]]()的结果,大概语义就是获取O的原型对象;
如果O等于null,返回false;
如果SameValue(P, O)的结果是true,返回true。
SameValue抽象操作参见JavaScript中的==,===和Object.js()中的Object.is(),Object.is()使用的就是这个抽象操作的结果。
由上述步骤2可知,如果C是一个bind函数,那么会重新在C绑定的目标函数上执行InstanceofOperator(O, BC)操作。
由上述步骤6可知,会重复地获取对象O的原型对象,然后比较该原型对象和C的prototype属性是否相等,直到相等返回true,或者O变为null,也就是遍历完整个原型链,返回false。
Function.prototype[@@hasInstance](V)
由上面的InstanceofOperator(O, C)抽象操作的步骤2和3可以知道,如果C上面定义或继承了@@ hasInstance属性的话,会调用该属性的值,而不会走到步骤4和5。步骤4和5的目的是为了兼容没有实现@@hasInstance方法的浏览器。如果一个函数没有定义或继承@@hasInstance属性,那么就会使用默认的instanceof的语义,也就是OrdinaryHasInstance(C, O)抽象操作描述的步骤。
ECMAScript7规范中,在Function的prototype属性上定义了@@hasInstance属性。Function.prototype[@@hasInstance](V)的步骤如下:
让F等于this值;
返回OrdinaryHasInstance(F, V)的结果。
所以,你可以看到在默认情况下,instanceof的语义是一样的,都是返回OrdinaryHasInstance(F, V)的结果。为什么说默认情况下?因为你可以覆盖Function.prototype[@@hasInstance]方法,去自定义instanceof的行为。
例子
function A () {} function B () {} var a = new A a.__proto__ === A.prototype // true a.__proto__.__proto__ === Object.prototype // true a.__proto__.__proto__.__proto__ === null // true a instanceof A // true a instanceof B // false
由OrdinaryHasInstance(C, O)的第6步可知:
对于a instanceof A,P是A.prototype,在第一次循环的时候,a的原型对象a._proto__是A.prototype,也就是步骤中的O是A.prototype,所以返回了true;
对于a instanceof B,P是B.prototype,在第一次循环的时候,a的原型对象a._proto__是A.prototype,不等于P;执行第二次循环,此时O是a.__proto__.__proto__,也就是Object.prototype,不等于P;执行第三次循环,此时O是a.__proto__.__proto__.__proto__,也就是null,也就是原型链都遍历完了,所以返回了false。
接着上面的例子:
A.prototype.__proto__ = B.prototype a.__proto__ === A.prototype // true a.__proto__.__proto__ === B.prototype // true a.__proto__.__proto__.__proto__ === Object.prototype // true a.__proto__.__proto__.__proto__.__proto__ === null // true a instanceof B // true
在上面的例子中,我们把B.prototype设置成了a的原型链中的一环,这样a instanceof B在OrdinaryHasInstance(C, O)的第6步的第2次循环的时候,返回了true。
由OrdinaryHasInstance(C, O)的第2步,我们知道bind函数的行为和普通函数的行为是不一样的:
function A () {} var B = A.bind() B.prototype === undefined // true var b = new B b instanceof B // true b instanceof A // true
由上面的例子可知,B.prototype是undefined。所以,instanceof作用于bind函数的返回结果其实是作用于绑定的目标函数的返回值,和bind函数基本上没有什么关系。
由InstanceofOperator(O, C)步骤2和步骤3可知,我们可以通过覆盖原型上的@@hasInstance方法来自定义instanceof的行为:
function A () {} var a = new A a instanceof A // true A[Symbol.hasInstance] = function () { return false } a instanceof A // ?
在chrome浏览器测试了一下,发现还是输出true。然后看了一下ECMAScript6的文档,
ECMAScript6文档里面还没有规定可以通过@@hasInstance改变instanceof的行为,所以应该是目前chrome浏览器还没有实现ECMAScript7中的instanceof操作符的行为。
总结
本文主要讲解ECMAScript7规范中的instanceof操作符,希望大家能有所收获。
以上就是详解ECMAScript7规范中instanceof操作符(附实例)的详细内容,更多请关注其它相关文章!
上一篇: win10锁屏壁纸在哪个文件夹