js 原型链与构造函数与实例之间关系
我们知道每个对象都有__proto__,每个函数都有prototype属性,它们之间是怎样实现原型继承的呢?
1.对象继承 __proto__属性
1 2 3 4 5 6 7 8 9 | function Test() { this .name = "21" ; this .age = 12; } Test.prototype.toString = (() => '测试' ); let obj5 = new Test() obj5.toString = (() => 'test' ) console.dir(obj5.toString()) |
每个对象都有一个__proto__属性,__proto__指向一个原型对象(可以理解为父对象),当我们调用一个方法时,如果这个对象没有这个属性,
就会调用__proto__查找,如果还没查找到继续往上查找,最顶层为null,没找到会报错,这就是原型链。
2.构造函数 prototype属性
prototype属性是函数独有的,它指向函数的原型对象,每个构造函数都可以通过new 创建一个实例对象,所以 Test.prototype === obj5.__proto__;
需要注意的是 函数也是对象,也拥有__proto__属性。
3.constructor属性
constructor指向该对象的构造函数,当创建一个Test构造函数时,prototype属性会自动生成一个constructor属性指向这个函数,当我们new一个obj5实例对象时,obj5.constructor 会通过原型链查找construtor属性,所以 obj5.constructor === Test;
Test.prototype.constructor === Test;
所有函数最终构造函数指向都是Function,Object 的构造函数指向也是Function;Function 的构造函数指向是自身。
4.一些对象类型判断方法
4.1 typeof
typeof 可以检测数据的类型,如果数据是Aarry类型时也会返回Object。
4.2 Object.prototype.toString
使用 Object.prototype.toString.call(obj) 来识别对象类型,他会返回一个"[object Type]"
的东西来告诉你所指对象的类型。
4.3 instanceof
用法: obj5 instanceof Test;
主要是通过原型链判断 当前对象是不是某一个构造函数的实例对象。
tips: 我们在浏览器打印查看对象属性时 [[prototype]] 和__proto__ 意义一样的。
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析