typeof與instanceof
阿新 • • 發佈:2018-12-22
在 JavaScript 中,判斷一個變數的型別嚐嚐會用 typeof 運算子,在使用 typeof 運算子時採用引用型別儲存值會出現一個問題,無論引用的是什麼型別的物件,它都返回 "object"。ECMAScript 引入了另一個 Java 運算子 instanceof 來解決這個問題。instanceof 運算子與 typeof 運算子相似,用於識別正在處理的物件的型別。與 typeof 方法不同的是,instanceof 方法要求開發者明確地確認物件為某特定型別。
▍typeof
typeof能夠輸出的結果有六種:undefined、object、boolean、number、string、function。
console.log(typeof undefined); // undefined console.log(typeof null); // object console.log(typeof {a: "w",3: 2}); // object console.log(typeof [1, 2, 3]); // object console.log(typeof true); // boolean console.log(typeof 1); // number console.log(typeof 1.0); // number console.log(typeof "null"); // string console.log(typeof "1"); // string console.log(typeof foo); // function function foo() { console.log("foo()") }
▍instanceof
參考網址:instanceof-JavaScript | MDN
語法:
object instanceof constructor
object:要檢測的物件。
constructor:某個建構函式。
示例:instanceof
運算子用來檢測 constructor.prototype
是否存在於引數 object
的原型鏈上。
// 定義建構函式 function C() {} function D() {} var o = new C(); console.log(o instanceof C); // true,因為 Object.getPrototypeOf(o) === C.prototype console.log(o instanceof D); // false,因為 D.prototype不在o的原型鏈上 console.log(o instanceof Object); // true,因為Object.prototype.isPrototypeOf(o)返回true console.log(C.prototype instanceof Object) // true,同上 C.prototype = {}; var o2 = new C(); console.log(o2 instanceof C); // true console.log(o instanceof C); // false,C.prototype指向了一個空物件,這個空物件不在o的原型鏈上. D.prototype = new C(); // 繼承 var o3 = new D(); console.log(o3 instanceof D); // true console.log(o3 instanceof C); // true 因為C.prototype現在在o3的原型鏈上
示例:下面的程式碼使用了instanceof
來證明:String和
Date
物件同時也屬於Object
型別(他們是由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 = {};
console.log(simpleStr instanceof String); // 返回 false, 檢查原型鏈會找到 undefined
console.log(myString instanceof String); // 返回 true
console.log(myString instanceof Object); // 返回 true
console.log(newStr instanceof String); // 返回 true
console.log(myObj instanceof Object); // 返回 true, 儘管原型沒有定義
console.log(({}) instanceof Object); // 返回 true, 同上
console.log(myDate instanceof Date); // 返回 true
console.log(myDate instanceof Object); // 返回 true
console.log(myDate instanceof String); // 返回 false