美文网首页
浅谈 instanceof 和 typeof 的实现原理

浅谈 instanceof 和 typeof 的实现原理

作者: 秋天de童话 | 来源:发表于2022-01-08 13:01 被阅读0次

    typeof 一般被用于判断一个变量的类型,我们可以利用 typeof 来判断number, string, object, boolean, function, undefined, symbol 这七种类型,这种判断能帮助我们搞定一些问题,比如在判断不是 object 类型的数据的时候,typeof能比较清楚的告诉我们具体是哪一类的类型

    其实,js 在底层存储变量的时候,会在变量的机器码的低位1-3位存储其类型信息

    000:对象
    010:浮点数
    100:字符串
    110:布尔
    1:整数

    but, 对于 undefined 和 null 来说,这两个值的信息存储是有点特殊的。
    null:所有机器码均为0
    undefined:用 −2^30 整数来表示

    null 直接被判断为不是 object,这也是 JavaScript 的历史遗留bug,可以参考typeof

    因此在用 typeof 来判断变量类型的时候,我们需要注意,最好是用 typeof 来判断基本数据类型(包括symbol),避免对 null 的判断。

    instanceof

    function Foo() {
    }
    
    Object instanceof Object // true
    Function instanceof Function // true
    Function instanceof Object // true
    Foo instanceof Foo // false
    Foo instanceof Object // true
    Foo instanceof Function // true
    

    Object.prototype.toString

    我们可以利用这个方法来对一个变量的类型来进行比较准确的判断

    
    Object.prototype.toString.call(1) // "[object Number]"
    
    Object.prototype.toString.call('hi') // "[object String]"
    
    Object.prototype.toString.call({a:'hi'}) // "[object Object]"
    
    Object.prototype.toString.call([1,'a']) // "[object Array]"
    
    Object.prototype.toString.call(true) // "[object Boolean]"
    
    Object.prototype.toString.call(() => {}) // "[object Function]"
    
    Object.prototype.toString.call(null) // "[object Null]"
    
    Object.prototype.toString.call(undefined) // "[object Undefined]"
    
    Object.prototype.toString.call(Symbol(1)) // "[object Symbol]"
    
    
    image.png

    我们知道每个 JavaScript 对象均有一个隐式的 proto 原型属性,而显式的原型属性是 prototype,只有 Object.prototype.proto 属性在未修改的情况下为 null 值。根据图上的原理,我们来梳理上面提到的几个有趣的 instanceof 使用的例子。

    总结

    简单来说,我们使用 typeof 来判断基本数据类型是 ok 的,不过需要注意当用 typeof 来判断 null 类型时的问题,如果想要判断一个对象的具体类型可以考虑用 instanceof,但是 instanceof 也可能判断不准确,比如一个数组,他可以被 instanceof 判断为 Object。所以我们要想比较准确的判断对象实例的类型时,可以采取 Object.prototype.toString.call 方法。

    资料参考
    https://juejin.cn/post/6844903613584654344

    相关文章

      网友评论

          本文标题:浅谈 instanceof 和 typeof 的实现原理

          本文链接:https://www.haomeiwen.com/subject/nfyecrtx.html