JavaScript中instanceof對於不同的構造器可能都返回true

我們知道 instanceof 運算子用來檢查對象是否為某構造器的執行個體。下面列舉它返回true的各種情景。

 

1、對象obj是通過new Constructor建立的，那麼 obj instanceof Constructor 為true

function Person(n, a) {this.name = n;this.age = a;}var p = new Person('John Backus', 82);console.log(p instanceof Person); // true

 

2、如果存在繼承關係，那麼 子類執行個體 instanceof 父類 也會返回true

function A(){}function B(){}B.prototype = new A(); // B繼承於Avar b = new B();console.log(b instanceof A); // true

 

3、由於Object是根類，所有其它自訂類都繼承於它，因此 任意構造器的執行個體 instanceof Object 都返回true

function A() {}var a = new A();console.log(a instanceof Object); // truevar str = new String('hello');console.log(str instanceof Object); // truevar num = new Number(1);console.log(num instanceof Object); // true

甚至包括構造器自身

function A() {}console.log(A instanceof Object); // trueconsole.log(String instanceof Object); // trueconsole.log(Number instanceof Object); // true

 

4、所有構造器 instanceof Function 返回true

function A() {}console.log(A instanceof Function); // trueconsole.log(String instanceof Function); // trueconsole.log(Number instanceof Function); // true

 

以上四點總結為一句話：如果某執行個體是通過某類或其子類的建立的，那麼instanceof就返回true。或者說某建構函式的原型 存在與對象obj的內部原型鏈上，那麼返回true。即instanceof的結果與構造器自身並無直接關係。這在許多語言中都是通用的。

Java中定義了一個類Person，執行個體p對於Person和Object都返回true

class Person {public String name;public int age;Person (String n, int a) {this.name = name;this.age = a;}public static void main(String[] args) {Person p = new Person("John Backus", 82);System.out.println(p instanceof Person); // trueSystem.out.println(p instanceof Object); // true}}

 

Java中如果存在繼承關係，那麼 子類執行個體 instanceof 父類 也返回true

// 父類class Person {    public String name;    public int age;    Person (String n, int a) {        name = name;        age = a;    }}// 子類public class Man extends Person{public String university;Man(String n, int a, String s) {super(n, a);university = s;}public static void main(String[] args) {Man mm = new Man("John Resig", 29, "PKU");System.out.println(mm instanceof Man); // trueSystem.out.println(mm instanceof Person); // 也是true}}

　　

　　

知道了這些，JS中以下的表現就不奇怪了

// 定義兩個構造器function A(){}function B(){}A.prototype = B.prototype = {a: 1};// 分別建立兩個不同構造器的執行個體var a = new A();var b = new B();console.log(a instanceof B); // trueconsole.log(b instanceof A); // true

我們看到a, b分別是用A和B建立的，但a instanceof B和 b instanceof A都是true。即a雖然不是用構造器B建立的，但仍然返回true。因為B.prototype存在於a的內部原型鏈上。

 

由於JS的動態語言特性，可以在運行時修改原型，因此下面返回false也不足為奇了。因為A.prototype已經不在a的內部原型鏈中，鏈條被打斷了。

function A(){}var a = new A();A.prototype = {}; // 動態修改原型，注意必須在建立a後console.log(a instanceof A); // false

注意這麼寫也打破了上面總結的第一條：對象obj是通過new Constructor建立的，那麼obj instanceof Constructor 為true

 

實際在ECMAScript標準中（以5.1為準），instanceof 內部實現會調用構造器的內部方法[[HasInstance]]，描述如下

假如F是一個函數對象，當F(V)執行時，以下步驟將發生：

1、如果instanceof左運算元V不是物件類型，直接返回false

var a, b = 1, c = true, d = 'hello';console.log(a instanceof Object); // false 這裡a值為undefinedconsole.log(b instanceof Object); // falseconsole.log(c instanceof Object); // falseconsole.log(d instanceof Object); // false

2/3、取構造器F的prototype屬性，如果不是物件類型，須拋出TypeError異常，

function A(){}A.prototype = 1; // A的prototype設為非物件類型var a = new A();console.log(a instanceof A);

各瀏覽器拋出的異常提示不同，

Firefox18：

 

Chrome24:

 

Safari6:

 

Opera12:

 

IE10：

　　

4、不斷的執行以下邏輯：將V設為內部原型的V，如果V是null則返回false，如果V和O都指向同一個對象，則返回true。

 

相關：

https://developer.mozilla.org/zh-CN/docs/JavaScript/Reference/Operators/instanceof

JavaScript中__proto__與prototype的關係