JavaScript自我实现系列（1）：instanceof

best-xiaoqiang 2018-11-28 原文

JavaScript判断类型的三种方法

typeof
instanceof
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]"

使用建议：