資訊專欄INFORMATION COLUMN
摘要：需要測試的函數(shù)構(gòu)造函數(shù)即用運算符來檢測是否存在參數(shù)的原型鏈。區(qū)別只能用來判斷對象函數(shù)和數(shù)組，不能用來判斷字符串和數(shù)字等用于判斷一個表達式的原始值，返回一個字符串。一般返回結(jié)果有函數(shù)數(shù)組，對象。
最近開始在整理ES6/ES7/ES8/ES9的知識點（已經(jīng)上傳到 我的博客 上），碰到一些知識點是自己已經(jīng)忘記（用得少的知識點），于是也重新復(fù)習(xí)了一遍。
這篇文章要復(fù)習(xí)的 instanceof 是我在整理過程中遇到的，那就整理下來吧，不然容易忘記。
要是哪里寫得不妥，歡迎各位大佬指點。
instanceof運算符用于測試構(gòu)造函數(shù)的prototype屬性是否出現(xiàn)在對象的原型鏈中的任何位置。 —— MDN
簡單理解為：instanceof可以檢測一個實例是否屬于某種類型。
比如：
function F (){
// ...
}
let a = new F ();
a instanceof F; // true
a instanceof Object; // true 后面介紹原因
還可以在繼承關(guān)系中用來判斷一個實例是否屬于它的父類型。
比如：
function F (){};
function G (){};
function Q (){};
G.prototype = new F(); // 繼承
let a = new G();
a instanceof F; // true
a instanceof G; // true
a instanceof Q; // false
2.使用方法
語法為: object instanceof constructor。
object : 需要測試的函數(shù)
constructor : 構(gòu)造函數(shù)
即：用instanceof運算符來檢測constructor.prototype 是否存在參數(shù)object的原型鏈。
function F (){};
function G (){};
let a = new F ();
a instanceof F; // true 因為：Object.getPrototypeOf(a) === F.prototype
a instanceof Q; // false 因為：F.prototype不在a的原型鏈上
a instanceof Object; // true 因為：Object.prototype.isPrototypeOf(a)返回true
F.prototype instanceof Object; // true,同上
注意：
a instanceof F 返回 true 以后，不一定永遠都都返回為true，F.prototype屬性的值有可能會改變。
原表達式a的值也會改變，比如 a.__proto__ = {}之后，a instanceof F就會返回false了。
檢測對象是不是特定構(gòu)造函數(shù)的實例：
// 正確
if (!(obj instanceof F)) {
// ...
}
// 錯誤 因為
if (!obj instanceof F); // 永遠返回false
// 因為 !obj 在instanceof之前被處理 ， 即一直使用一個布爾值檢測是否是F的實例
3.實現(xiàn)instanceof
/**
* 實現(xiàn)instanceof
* @param obj{Object} 需要測試的對象
* @param fun{Function} 構(gòu)造函數(shù)
*/
function _instanceof(obj, fun) {
let f = fun.prototype; // 取B的顯示原型
obj = obj.__proto__; // 取A的隱式原型
while (true) {
//Object.prototype.__proto__ === null
if (obj === null)
return false;
if (f === obj) // 這里重點：當(dāng) f 嚴(yán)格等于 obj 時，返回 true
return true;
obj = obj.__proto__;
}
}
4.instanceof 與 typeof 對比
相同：
instanceof和typeof都能用來判斷一個變量的類型。
區(qū)別：
instanceof 只能用來判斷對象、函數(shù)和數(shù)組，不能用來判斷字符串和數(shù)字等：
let a = {};
let b = function () {};
let c = [];
let d = "hi";
let e = 123;
a instanceof Object; // true
b instanceof Object; // true
c instanceof Array; // true
d instanceof String; // false
e instanceof Number; // false
typeof ：用于判斷一個表達式的原始值，返回一個字符串。
typeof 42; // "number" typeof "blubber"; // "string" typeof true; // "boolean" typeof aa; // "undefined"
一般返回結(jié)果有：
number
boolean
string
function（函數(shù)）
object（NULL,數(shù)組，對象）
undefined。
判斷變量是否存在：
不能使用：
if(a){
//變量存在
}
// Uncaught ReferenceError: a is not defined
原因是如果變量未定義，就會報未定義的錯，而應(yīng)該使用：
if(typeof a != "undefined"){
//變量存在
}
5.參考資料
MDN instanceof
IBM instanceof
js中typeof和instanceof用法區(qū)別
歡迎關(guān)注微信公眾號【前端自習(xí)課】每天早晨，與您一起學(xué)習(xí)一篇優(yōu)秀的前端技術(shù)博文 .
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/99643.html
摘要：構(gòu)造函數(shù)通常首字母大寫，用于區(qū)分普通函數(shù)。這種關(guān)系常被稱為原型鏈，它解釋了為何一個對象會擁有定義在其他對象中的屬性和方法。中所有的對象，都有一個屬性，指向?qū)嵗龑ο蟮臉?gòu)造函數(shù)原型由于是個非標(biāo)準(zhǔn)屬性，因此只有和兩個瀏覽器支持，標(biāo)準(zhǔn)方法是。 從這篇文章開始，復(fù)習(xí) MDN 中級教程 的內(nèi)容了，在初級教程中，我和大家分享了一些比較簡單基礎(chǔ)的知識點，并放在我的 【Cute-JavaScript】系...
摘要：系列目錄復(fù)習(xí)資料資料整理個人整理重溫基礎(chǔ)語法和數(shù)據(jù)類型重溫基礎(chǔ)流程控制和錯誤處理重溫基礎(chǔ)循環(huán)和迭代重溫基礎(chǔ)函數(shù)本章節(jié)復(fù)習(xí)的是中的表達式和運算符，用好這些可以大大提高開發(fā)效率。 本文是 重溫基礎(chǔ) 系列文章的第五篇。今日感受：家的意義。 系列目錄： 【復(fù)習(xí)資料】ES6/ES7/ES8/ES9資料整理(個人整理) 【重溫基礎(chǔ)】1.語法和數(shù)據(jù)類型 【重溫基礎(chǔ)】2.流程控制和錯誤處理 【重溫基...
摘要：本文是重溫基礎(chǔ)系列文章的第十二篇。注意對象的名稱，對大小寫敏感?；A(chǔ)用法第一個參數(shù)是目標(biāo)對象，后面參數(shù)都是源對象。用途遍歷對象屬性。用途將對象轉(zhuǎn)為真正的結(jié)構(gòu)。使用場景取出參數(shù)對象所有可遍歷屬性，拷貝到當(dāng)前對象中。類似方法合并兩個對象。 本文是 重溫基礎(chǔ) 系列文章的第十二篇。 今日感受：需要總結(jié)下2018。 這幾天，重重的感冒發(fā)燒，在家休息好幾天，傷···。 系列目錄： 【復(fù)習(xí)資料...
摘要：今天把接下來引用類型中的一些內(nèi)容全部記錄完畢基本包裝類型為了便于操作基本類型值，還提供了種特殊的引用類型。這三種類型具有與各自的基本類型響應(yīng)的特殊行為。重寫后的返回對象表示的數(shù)值類型，另外兩個方法則返回字符串形式的數(shù)值。 今天把接下來引用類型中的一些內(nèi)容全部記錄完畢~ 基本包裝類型 為了便于操作基本類型值，JavaScript還提供了3種特殊的引用類型：Boolean, Number,...
摘要：繼承了如上，我們通過方法借調(diào)了超類的構(gòu)造函數(shù)，實際上是在新創(chuàng)建的實力環(huán)境下調(diào)用了構(gòu)造函數(shù)。組合繼承組合繼承的基本思想將原型鏈和借用構(gòu)造函數(shù)的技術(shù)組合到一塊，從而發(fā)揮二者之長的一種繼承模式。繼承方法在上面這個例子中，構(gòu)造函數(shù)定義了兩個屬性和。 在ECMAScript中只支持實現(xiàn)繼承，而且實現(xiàn)繼承主要是依靠原型鏈來實現(xiàn)的。 1. 什么是原型鏈 繼承基本思想：利用原型讓一個引用類型繼承另一個...
閱讀 856·2023-04-25 19:53
閱讀 4524·2021-09-22 15:13
閱讀 2721·2019-08-30 10:56
閱讀 1463·2019-08-29 16:27
閱讀 3097·2019-08-29 14:00
閱讀 2573·2019-08-26 13:56
閱讀 732·2019-08-26 13:29
閱讀 1768·2019-08-26 11:31
