JS中instanceof的使用小结

 更新时间:2026年03月05日 09:56:12   作者:发现一只大呆瓜  
在JavaScript中,instanceof是判断引用类型的重要工具,本文就来介绍一下JS中instanceof的使用小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

前言

在 JavaScript 中,instanceof 是判断引用类型的重要工具。它不像 typeof 那样只能识别基础类型,而是能够深入“家谱”,判断一个实例是否属于某个构造函数。本文将带你通过手写实现,彻底掌握其底层原理。

一、 实现思路

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。

1. 实现思路

  1. 类型检查:首先确保左侧是一个对象或函数(基础类型直接返回 false)。

  2. 获取原型:取得左侧对象的原型 __proto__ 和右侧构造函数的原型 prototype

  3. 循环遍历:沿着左侧的原型链不断向上查找(__proto__ = __proto__.__proto__)。

  4. 结果判定

    • 如果查找到某个环节等于右侧的 prototype,则返回 true
    • 如果查找到原型链的尽头(null)仍未找到,则返回 false

二、 具体实现

  function myInstanceof(obj, func) {
    if (typeof obj !== 'object' && typeof obj !== 'function') {
      return false;
    }
    let proto = obj.__proto__;
    const prototype = func.prototype;
    while (proto !== prototype) {
      if (proto === null) {
        return false;
      }
      proto = proto.__proto__;
    }
    return true;
  }
  const date = new Date();
  console.log(myInstanceof(date, Object));    // true

  console.log(myInstanceof([1, 2], Array)); // true

到此这篇关于JS中instanceof的使用小结的文章就介绍到这了,更多相关JS instanceof内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 简述Matlab中size()函数的用法

    简述Matlab中size()函数的用法

    size()函数用来获取矩阵的行数和列数。接下来通过本文给大家介绍matlab中size()函数的用法,需要的朋友一起学习吧
    2016-03-03
  • 得到元素真实的背景颜色的js代码

    得到元素真实的背景颜色的js代码

    这个函数来自Rico,Longbill及Dnew.cn修改。 说明: 传入参数一个,为元素的id值或元素本身,返回为元素的真实背景色值(字符串)。背景值均为16进制的值(原代码是是IE里面返回的是16进制的值,而Mozilla则是rgb值,Dnew.cn将其修改为均返回16进制的值)。
    2007-12-12
  • 基于javascript实现的搜索时自动提示功能

    基于javascript实现的搜索时自动提示功能

    这篇文章主要介绍了基于javascript实现的搜索时自动提示功能,非常实用,推荐给需要的小伙伴参考下。
    2014-12-12
  • 浅析Virtual DOM的概念与其在现代前端框架中的实践

    浅析Virtual DOM的概念与其在现代前端框架中的实践

    这篇文章将深入探讨Virtual DOM(虚拟DOM)的概念,分析其对前端开发的革新影响,并以此展示前端技术的深度和魅力,感兴趣的小伙伴可以跟随小编一起学习一下
    2023-12-12
  • JavaScript实现网页tab栏效果制作

    JavaScript实现网页tab栏效果制作

    这篇文章主要为大家详细介绍了JavaScript实现网页tab栏效果制作,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • 微信小程序页面调用自定义组件内的事件详解

    微信小程序页面调用自定义组件内的事件详解

    这篇文章主要介绍了微信小程序页面调用自定义组件内的事件详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-09-09
  • PWA介绍及快速上手搭建一个PWA应用的方法

    PWA介绍及快速上手搭建一个PWA应用的方法

    这篇文章主要介绍了PWA介绍及快速上手搭建一个PWA应用的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-01-01
  • JavaScript用20行代码实现虎年春节倒计时

    JavaScript用20行代码实现虎年春节倒计时

    春节将至,相信大家跟小编一样很激动呀。为了迎接虎年春节到来,小编为大家准备了一个虎年春节倒计时,仅20行代码用js就实现啦。感兴趣的可以动手试一试
    2022-01-01
  • Javascript 变量作用域 两个可能会被忽略的小特性

    Javascript 变量作用域 两个可能会被忽略的小特性

    关于Javascript,大家肯定都很熟悉啦,对于有编程经验的朋友来说,Javascript很快就能上手,不过关于JS的变量作用域,还是有一点差别的。
    2010-03-03
  • JS实现的网页背景闪电闪烁效果代码

    JS实现的网页背景闪电闪烁效果代码

    这篇文章主要介绍了JS实现的网页背景闪电闪烁效果代码,涉及JavaScript定时函数结合页面元素样式操作的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-10-10

最新评论