当前位置: 首页 > article >正文

javascript手写实现instanceof函数 介绍判断数组的方法

1 手写实现instanceof函数

        instanceof 是 JavaScript 中的一个运算符,用于检测一个对象是否是某个构造函数的实例。它的语法是 object instanceof Constructor,如果 object 是 Constructor.prototype 的一个实例,返回 true,否则返回 false。

简易实现步骤:

  1.  获取到对象__proto__
  2. 如果对象__proto__存在,则判断constuctor的prototype是否和__proto__相等,相等的话函数返回true
  3. 不相等的话继续沿原型链向上查找proto = __proto__
  4. 直到proto为空,返回false
极简版手写instanceof函数

自己实现的出版代码如下,大家自己想想有什么问题?

const Myinstanceof = (obj, constructor) => {
    let proto = obj.__proto__
    while(proto){
        if(proto === constructor.prototype){
            return true
        }
        proto = proto.__proto__
    }
    return false
}
优化版手写instanceof函数

有以下问题:

  • 未检查 obj 是否为对象或函数

  • 未检查 constructor 是否为函数

  • 通过__proto__获得obj原型链上的对象不一定可用,Object.getPrototypeOf 获取 obj 的原型对象是官方给出的方法

修改后的代码如下所示:

const MyGoinstanceof = (obj, constructor) => {
    // 检查 obj 是否为对象或函数
    if (obj == null || (typeof obj !== 'object' && typeof obj !== 'function')) {
        return false;
    }
    
    // 检查 constructor 是否为函数
    if (typeof constructor !== 'function') {
        return false;
    }

    let proto = Object.getPrototypeOf(obj);
    
    while (proto) {
        if (proto === constructor.prototype) {
            return true;
        }
        proto = Object.getPrototypeOf(proto);
    }
    
    return false;
}

 测试代码如下所示:

function test(){
}

const obj = new test()
console.log(Myinstanceof(obj, test)) // true
console.log(obj instanceof test) // true
console.log("--------------------")
console.log(Myinstanceof(obj, Object)) // true
console.log(obj instanceof Object) // true
console.log("--------------------")
console.log(Myinstanceof(obj, Array)) // false
console.log(obj instanceof Array) // false
console.log("--------------------")
console.log(Myinstanceof([], Array)) // true
console.log([] instanceof Array) // true
console.log("--------------------")
console.log(Myinstanceof([], Object)) // true
console.log([] instanceof Object) // true
console.log("--------------------")
console.log(MyGoinstanceof(undefined, Object)) // false
console.log(undefined instanceof Object) // false
console.log("--------------------")
console.log(MyGoinstanceof(null, Object)) // false
console.log(null instanceof Object) // false
console.log("--------------------")
console.log(MyGoinstanceof({}, function(){})) // false
console.log({} instanceof function(){}) // false
console.log("--------------------")
console.log(MyGoinstanceof({}, 1)) // TypeError: Right-hand side of 'instanceof' is not callable

2 判断数组的方法

  1.  使用Array.prototype.isArray() Array类上的静态方法。
  2.  使用1中提到的instanceof方法 instanceof Array。
  3.  使用对象上的constructor方法判断,其指向构造函数 arr.constuctor === Array。
  4. 使用Object.prototype.toString.call(array) 判断是否等于字符串"[object Array]"

四种实现方式代码验证如下所示:

// 判断数组的方法
// Array.isArray
const arr = []
console.log(Array.isArray(arr)) 
// instanceof Array
console.log(arr instanceof Array)
// constructor
console.log(arr.constructor === Array)
// Object.prototype.toString.call
console.log(Object.prototype.toString.call(arr) === '[object Array]')

http://www.kler.cn/news/330304.html

相关文章:

  • 网站开发基础:HTML、CSS
  • 四、网络层(下)
  • 《 Spring Boot实战:优雅构建责任链模式投诉处理业务》
  • 【Redis 源码】6AOF持久化
  • Linux_kernel字符设备驱动12
  • 云计算SLA响应时间的matlab模拟与仿真
  • Golang | Leetcode Golang题解之第446题等差数列划分II-子序列
  • C++学习笔记----8、掌握类与对象(二)---- 成员函数的更多知识(3)
  • 【数一线性代数】021入门
  • 代码工艺:Spring Boot 防御式编程实践
  • JavaScript Map全解:从基础到高级应用
  • jackson对于对象序列化的时候默认空值和手动传入的null的不同处理
  • 模拟斗地主发扑克的编程
  • Vue.js组件开发教程
  • JavaWeb——Vue组件库Element(3/6):常见组件:Dialog对话框、Form表单(介绍、使用、实际效果)
  • 新手教学系列——curl_cffi异步Session使用注意事项
  • AI生成垃圾内容对互联网的冲击与应对:一场持续扩展的危机
  • 嵌入式面试刷题(day18)
  • 在Ubuntu 16.04上使用LAMP安装WordPress
  • uniapp中uni.request的统一封装 (ts版)