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。