JavaScript ES6 Symbol.hasInstance的理解。

Symbol.hasInstance

本案例是结合阮一峰老师的ECMAScript 6 入门丛书进一步的详细介绍,和对Symbol.hasInstance的理解。本着互联网的精神,分享给大家。

  对象的Symbol.hasInstance属性,指向一个内部方法。当其他对象使用instanceof运算符,判断是否为该对象的实例时,会调用这个方法。比如,foo instanceof Foo在语言内部,实际调用的是Foo[Symbol.hasInstance](foo)。

  代码示例:证明x确实是MyClass的实例。

class MyClass {

}
var x = new MyClass()
console.log(x instanceof MyClass); // true
console.log(MyClass[Symbol.hasInstance](x));//true

  下面的示例是阮一峰老师在ECMAScript 6 入门丛书中的案例,我个人理解为是重写了 Even[Symbol.hasInstance]的静态方法。

  代码示例:

class Even {
  static [Symbol.hasInstance](obj) {
    return Number(obj) % 2 === 0;
  }
}
x = new Even()
console.log(1 instanceof Even);//false
console.log(2 instanceof Even);//true
console.log(x instanceof Even);//true 原本判断x是否为Even的实例的方法,被改成了传入的数字%2===0。所以此刻是false。

   MyClass是一个类,new MyClass()会返回一个实例。该实例的Symbol.hasInstance方法,会在进行instanceof运算时自动调用,判断左侧的运算子是否为Array的实例。

  代码示例:这里相当于是修改了MyClass[Symbol.hasInstance]的动态方法

class MyClass {
  [Symbol.hasInstance](foo) {
    return foo instanceof Array;
  }
}
var x = new MyClass()
console.log([1, 2, 3] instanceof new MyClass()); // true
console.log(x[Symbol.hasInstance]([0, 0, 0,]));//true 

   在举一个完整的例子。

class MyClass {
  [Symbol.hasInstance](foo) {
    return foo instanceof Array;
  }

  static [Symbol.hasInstance](obj) {
    return Number(obj) % 2 === 0;
  }
}
var x = new MyClass()
console.log([1, 2, 3] instanceof new MyClass()); // true //我是调用的动态方法
console.log(x[Symbol.hasInstance]([0, 0, 0,]));//true //我是调用的动态方法
console.log(2 instanceof MyClass); //true 我是调用静态方法
console.log(MyClass[Symbol.hasInstance](2));//true 我是调用了静态方法
console.log(x instanceof MyClass); //false 因为修改了静态方法。x本身就是MyClass的实例,如果注释了静态方法就会返回true。

 

posted @ 2017-06-26 14:57  铅笔画不出的黑白  阅读(5468)  评论(0编辑  收藏  举报