JavaScript原型链

羅 小子 前端评论2,765字数 945阅读3分9秒阅读模式

原型链JavaScript 中一个重要的概念,它决定了对象之间的继承关系。

JavaScript原型链文章源自羅小子-https://luozz.cn/javascript-prototype/

JavaScript 中,每个对象都有一个原型(prototype),而这个原型的原型又会有自己的原型,这样就形成了一个链式结构,即原型链。当在一个对象上调用一个属性或方法时,如果这个对象本身没有这个属性或方法,那么它会去它的原型链上寻找,直到找到这个属性或方法或者到达原型链的末端。文章源自羅小子-https://luozz.cn/javascript-prototype/

下面是一个简单的例子,可以帮助理解原型链的概念:文章源自羅小子-https://luozz.cn/javascript-prototype/

 // 创建一个空对象
 let person = {};
 // 给 person 对象添加一些属性和方法
 person.name = "羅小子"
 person.age = 28
 person.sayHello = ()=>{
   console.log(`你好, 我的名字是${this.name}`);
 }

 // 创建一个新的对象
 let engineer = {};
 // 将 engineer 的原型设置为 person
 engineer.__proto__ = person;
 // 调用 engineer 的 sayHello 方法
 engineer.sayHello(); // 输出 "你好, 我的名字是羅小子"
 // 修改 person 对象的 name 属性
 person.name = "luoxiaozi";
 // 再次调用 engineer 的 sayHello 方法
 engineer.sayHello(); // 输出 "你好, 我的名字是luoxiaozi"


在上面的例子中,我们创建了两个对象,person 和 engineerperson 对象有一些属性和方法,engineer 对象则没有。将 engineer 的原型设置为 person,这样 engineer 就能够访问 person 对象的属性和方法。当调用 engineer.sayHello() 方法时,实际上是调用 person 对象上的 sayHello 方法,因为 engineer 对象本身没有这个方法。由于 engineer 的原型链上有一个 person 对象,所以它能够访问 person 对象的属性和方法。文章源自羅小子-https://luozz.cn/javascript-prototype/

需要注意的是,JavaScript 中的原型链是由引用类型组成的,即每个对象的原型都可以是另一个对象。因此,如果一个对象上有循环引用,就可能导致内存泄漏等问题。为了避免这些问题,我们需要避免在原型链上形成循环引用。文章源自羅小子-https://luozz.cn/javascript-prototype/ 文章源自羅小子-https://luozz.cn/javascript-prototype/

继续阅读
微信小程序
微信扫一扫
weinxin
我的微信
微信公众号
微信扫一扫
weinxin
我的公众号
羅 小子
  • 本文由 发表于 2023年6月20日 10:52:31
  • 转载请务必保留本文链接:https://luozz.cn/javascript-prototype/
  • JavaScript
  • 原型链
评论  0  访客  0
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: