当前位置:首页 > JavaScript

js实现instanceof

2026-04-05 12:52:01JavaScript

实现 instanceof 的原理

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。手动实现需要遍历对象的原型链并与构造函数的 prototype 属性进行比较。

js实现instanceof

实现代码

function myInstanceof(obj, constructor) {
  // 获取对象的原型
  let proto = Object.getPrototypeOf(obj);
  // 获取构造函数的 prototype 对象
  const prototype = constructor.prototype;

  // 遍历原型链
  while (proto !== null) {
    if (proto === prototype) {
      return true;
    }
    proto = Object.getPrototypeOf(proto);
  }

  return false;
}

代码解析

Object.getPrototypeOf() 方法用于获取指定对象的原型。通过循环不断获取对象的原型,并与构造函数的 prototype 属性进行比较。

js实现instanceof

如果找到匹配的原型,返回 true。如果遍历完整个原型链仍未找到匹配项,返回 false。

使用示例

function Person() {}
const p = new Person();

console.log(myInstanceof(p, Person)); // true
console.log(myInstanceof(p, Object)); // true
console.log(myInstanceof([], Array)); // true
console.log(myInstanceof({}, Array)); // false

注意事项

原始值(如数字、字符串、布尔值)使用 instanceof 检测会返回 false,手动实现也遵循这一行为。

console.log(myInstanceof(123, Number)); // false
console.log(myInstanceof('str', String)); // false

标签: jsinstanceof
分享给朋友:

相关文章

js实现复制到剪贴板

js实现复制到剪贴板

使用document.execCommand方法(传统方式,已废弃但部分浏览器仍支持) 该方法适用于旧版浏览器,但已被标记为废弃。执行前需确保文本已被选中: function copyToClipb…

js实现vr

js实现vr

使用WebXR API实现VR体验 WebXR是浏览器中实现VR和AR体验的标准API,它取代了早期的WebVR。现代浏览器如Chrome、Edge和Firefox已支持WebXR。 // 初始化W…

节流js实现

节流js实现

节流(Throttle)的实现原理 节流是一种限制函数执行频率的技术,确保函数在一定时间间隔内最多执行一次。适用于高频触发事件(如滚动、输入、窗口调整等)的场景。 基础实现方式 使用时间戳判断是否执…

js实现吸色

js实现吸色

使用Canvas实现吸色功能 通过Canvas的getImageData方法获取像素颜色数据。创建一个Canvas元素,将目标图像绘制到Canvas上,通过鼠标事件获取坐标对应的颜色值。 const…

js实现文字滚动

js实现文字滚动

实现文字滚动的几种方法 使用CSS动画实现滚动 通过CSS的@keyframes和transform属性可以实现平滑的文字滚动效果。 <style> .scroll-text { w…

js图片上传实现

js图片上传实现

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API实现基础图片上传功能。HTML部分需要设置accept="image/…