JavaScript 中的 instanceof 介紹
instanceof 運算子可以用來判斷某個建構式的 prototype 屬性是否存在另外一個要檢測物件的原型鏈上。
語法
object instanceof constructor
參數
object
要檢測的物件.
constructor
某個建構式
描述
instanceof 運算子用來檢測 constructor.prototype 是否存在於參數 object 的原型鏈上。
// 定義建構式
function C(){}
function D(){}
var o = new C();
// true,因為 Object.getPrototypeOf(o) === C.prototype
o instanceof C;
// false,因為 D.prototype不在o的原型鏈上
o instanceof D;
o instanceof Object; // true,因為Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上
C.prototype = {};
var o2 = new C();
o2 instanceof C; // true
o instanceof C; // false,C.prototype指向了一個空物件,這個空物件不在o的原型鏈上.
D.prototype = new C(); // 繼承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true
需要注意的是,如果表達式 obj instanceof Foo 返回true,則並不意味著該表達式會永遠返回ture,因為Foo.prototype屬性的值有可能會改變,改變之後的值很有可能不存在於obj的原型鏈上,這時原表達式的值就會成為false。另外一種情況下,原表達式的值也會改變,就是改變物件obj的原型鏈的情況,雖然在目前的ES規範中,我們只能讀取物件的原型而不能改變它,但借助於非標準的__proto__魔法屬性,是可以實現的。比如執行obj.__proto__ = {}之後,obj instanceof Foo就會返回false了。
instanceof和多全域物件(多個frame或多個window之間的交互)
在瀏覽器中,我們的scripts可能需要在多個窗口之間進行交互。多個窗口意味著多個全域環境,不同的全域環境擁有不同的全域物件,從而擁有不同的內置類型建構式。這可能會引發一些問題。比如,表達式 [] instanceof window.frames[0].Array 會返回false,因為 Array.prototype !== window.frames[0].Array.prototype,因此你必須使用 Array.isArray(myObj) 或者 Object.prototype.toString.call(myObj) === "[object Array]"來判斷myObj是否是陣列。
Mozilla開發者注意:
在程式碼中使用 XPCOM instanceof 有特殊影響: obj instanceof xpcomInterface (e.g. Components.interfaces.nsIFile) calls obj.QueryInterface(xpcomInterface) and returns true if QueryInterface succeeded. A side effect of such call is that you can use xpcomInterface's properties on obj after a successful instanceof test. Unlike standard JavaScript globals, the test obj instanceof xpcomInterface works as expected even if obj is from a different scope.
例子
例子: 表明String物件和Date物件都屬於Object類型
下面的程式碼使用了instanceof來證明:String和Date物件同時也屬於Object類型。
var simpleStr = "This is a simple string";
var myString = new String();
var newStr = new String("String created with constructor");
var myDate = new Date();
var myObj = {};
simpleStr instanceof String; // returns false, 檢查原型鏈會找到 undefined
myString instanceof String; // returns true
newStr instanceof String; // returns true
myString instanceof Object; // returns true
myObj instanceof Object; // returns true, despite an undefined prototype
({}) instanceof Object; // returns true, 同上
myString instanceof Date; // returns false
myDate instanceof Date; // returns true
myDate instanceof Object; // returns true
myDate instanceof String; // returns false
演示mycar屬於Car類型的同時又屬於Object類型
下面的程式碼新增了一個類型Car,以及該類型的物件範例mycar. instanceof運算子表明了這個mycar物件既屬於Car類型,又屬於Object類型。
function Car(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
}
var mycar = new Car("Honda", "Accord", 1998);
var a = mycar instanceof Car; // 返回 true
var b = mycar instanceof Object; // 返回 true
語法
object instanceof constructor
參數
object
要檢測的物件.
constructor
某個建構式
描述
instanceof 運算子用來檢測 constructor.prototype 是否存在於參數 object 的原型鏈上。
// 定義建構式
function C(){}
function D(){}
var o = new C();
// true,因為 Object.getPrototypeOf(o) === C.prototype
o instanceof C;
// false,因為 D.prototype不在o的原型鏈上
o instanceof D;
o instanceof Object; // true,因為Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上
C.prototype = {};
var o2 = new C();
o2 instanceof C; // true
o instanceof C; // false,C.prototype指向了一個空物件,這個空物件不在o的原型鏈上.
D.prototype = new C(); // 繼承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true
需要注意的是,如果表達式 obj instanceof Foo 返回true,則並不意味著該表達式會永遠返回ture,因為Foo.prototype屬性的值有可能會改變,改變之後的值很有可能不存在於obj的原型鏈上,這時原表達式的值就會成為false。另外一種情況下,原表達式的值也會改變,就是改變物件obj的原型鏈的情況,雖然在目前的ES規範中,我們只能讀取物件的原型而不能改變它,但借助於非標準的__proto__魔法屬性,是可以實現的。比如執行obj.__proto__ = {}之後,obj instanceof Foo就會返回false了。
instanceof和多全域物件(多個frame或多個window之間的交互)
在瀏覽器中,我們的scripts可能需要在多個窗口之間進行交互。多個窗口意味著多個全域環境,不同的全域環境擁有不同的全域物件,從而擁有不同的內置類型建構式。這可能會引發一些問題。比如,表達式 [] instanceof window.frames[0].Array 會返回false,因為 Array.prototype !== window.frames[0].Array.prototype,因此你必須使用 Array.isArray(myObj) 或者 Object.prototype.toString.call(myObj) === "[object Array]"來判斷myObj是否是陣列。
Mozilla開發者注意:
在程式碼中使用 XPCOM instanceof 有特殊影響: obj instanceof xpcomInterface (e.g. Components.interfaces.nsIFile) calls obj.QueryInterface(xpcomInterface) and returns true if QueryInterface succeeded. A side effect of such call is that you can use xpcomInterface's properties on obj after a successful instanceof test. Unlike standard JavaScript globals, the test obj instanceof xpcomInterface works as expected even if obj is from a different scope.
例子
例子: 表明String物件和Date物件都屬於Object類型
下面的程式碼使用了instanceof來證明:String和Date物件同時也屬於Object類型。
var simpleStr = "This is a simple string";
var myString = new String();
var newStr = new String("String created with constructor");
var myDate = new Date();
var myObj = {};
simpleStr instanceof String; // returns false, 檢查原型鏈會找到 undefined
myString instanceof String; // returns true
newStr instanceof String; // returns true
myString instanceof Object; // returns true
myObj instanceof Object; // returns true, despite an undefined prototype
({}) instanceof Object; // returns true, 同上
myString instanceof Date; // returns false
myDate instanceof Date; // returns true
myDate instanceof Object; // returns true
myDate instanceof String; // returns false
演示mycar屬於Car類型的同時又屬於Object類型
下面的程式碼新增了一個類型Car,以及該類型的物件範例mycar. instanceof運算子表明了這個mycar物件既屬於Car類型,又屬於Object類型。
function Car(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
}
var mycar = new Car("Honda", "Accord", 1998);
var a = mycar instanceof Car; // 返回 true
var b = mycar instanceof Object; // 返回 true
留言
張貼留言