JavaScript自我實現系列（1）：instanceof

大眾美男典範發表於2018-11-28
JavaScript

JavaScript判斷型別的三種方法

  1. typeof

  2. instanceof

  3. Object.prototype.toString

typeof

使用：

console.log(typeof 1024) // "number"
複製程式碼

特殊情況：

// js自身的bug
console.log(typeof null) // "object"
複製程式碼

侷限：

// 不能明確是object型別的具體型別
console.log(typeof {}) // "object"
console.log(typeof []) // "object"
複製程式碼

使用建議：

最好用typeof判斷基本型別

instanceof

使用：

var arr = []
console.log(arr instanceof Array) // true
var now = new Date()
console.log(now instanceof Date) // true
複製程式碼

使用建議：

用來判斷一個例項是否是其父型別或祖先型別的例項

可以結合typeof判斷資料的具體型別

自我實現：

/*
*  instanceof的工作原理，就是判斷
*  右邊變數的prototype是否在左邊變數的原型鏈上。
*  
*  假如把prototype看成一個區域，
*  instanceof的工作原理，就是判斷
*  左邊變數是否可以到達右邊變數所屬的這個區域。
*  
*  所以，我們就能解鎖隱藏在instanceof裡面的彩蛋：
*  一個男孩找女孩的遊戲。
*/

function canBoyFind(boy, girl) {
    // girlRoom就是女孩的閨房
    var girlRoom = girl.prototype
    // room就是男孩現在所在的房間
    var room = boy.__proto__
    while (true){
        // 重複以下規則：
        // 1. 男孩一臉懵逼————自己竟然在馬路上。遊戲直接結束！
        if (room === null){
            return false
        }
        // 2. 男孩就在女孩閨房，恭喜這對新人！
        if (room === girlRoom){
            return true
        }
        // 3. 男孩既不在馬路上，也不在女孩閨房裡。
        //    但是，這裡有一把鑰匙（__proto__），可以通往下一個房間。
        //    男孩走進下一個房間...
        room = room.__proto__
    }
}
複製程式碼

Object.prototype.toString

使用：

Object.prototype.toString.call(1) // "[object Number]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call([]) // "[object Array]"
Object.prototype.toString.call(null) // "[object Null]"
複製程式碼

使用建議：

這麼好用，我先記下了

JavaScript自我實現系列 點選檢視

相關文章