简单粗暴地理解js原型链--js面向对象编程
人是人他妈生的妖是妖他妈生的。人和妖都是对象实例而人他妈和妖他妈就是原型。原型也是对象叫原型对象。2人他妈和人他爸啪啪啪能生出一堆人宝宝、妖他妈和妖他爸啪啪啪能生出一堆妖宝宝啪啪啪就是构造函数俗称造人。3人他妈会记录啪啪啪的信息所以可以通过人他妈找到啪啪啪的信息也就是说能通过原型对象找到构造函数。4人他妈可以生很多宝宝但这些宝宝只有一个妈妈这就是原型的唯一性。5人他妈也是由人他妈他妈生的通过人他妈找到人他妈他妈再通过人他妈他妈找到人他妈他妈……这个关系叫做原型链。6原型链并不是无限的当你通过人他妈一直往上找最后发现你会发现人他妈他妈他妈……的他妈都不是人也就是原型链最终指向null。7人他妈生的人会有人的样子妖他妈生的妖会有妖的丑陋这叫继承。8你继承了你妈的肤色你妈继承了你妈他妈的肤色你妈他妈……这就是原型链的继承。9你谈对象了她妈让你带上房产证去提货你若没有那她妈会问你妈有没有你妈没有那她妈会问你妈她妈有没有……这就是原型链的向上搜索。10你会继承你妈的样子但是你也可以去染发洗剪吹就是说对象的属性可以自定义会覆盖继承得到的属性。11虽然你洗剪吹了染成黄毛了但你不能改变你妈的样子你妈生的弟弟妹妹跟你的黄毛洗剪吹没一点关系就是说对象实例不能改动原型的属性。12但是你家被你玩火烧了的话那就是说你家你妈家你弟们家都被烧了这就是原型属性的共享。13你妈外号阿珍邻居大娘都叫你阿珍儿但你妈头发从飘柔做成了金毛狮王后隔壁大婶都改口叫你包租仔这叫原型的动态性。14你妈爱美又跑到韩国整形整到你妈他妈都认不出来即使你妈头发换回飘柔了但隔壁邻居还是叫你金毛狮王子。因为没人认出你妈整形后的你妈已经回炉再造了这就是原型的整体重写。尼玛你特么也是够了 Dont BB Show me the codefunction Person (name) { this.name name; } function Mother () { } Mother.prototype { //Mother的原型 age: 18, home: [Beijing, Shanghai] }; Person.prototype new Mother(); //Person的原型为Mother //用chrome调试工具查看提供了__proto__接口查看原型这里有两层原型各位还是直接看chrome好一点。 var p1 new Person(Jack); //p1:Jack; __proto__:{__proto__:18,[Beijing,Shanghai]} var p2 new Person(Mark); //p2:Mark; __proto__:{__proto__:18,[Beijing,Shanghai]} p1.age 20; /* 实例不能改变原型的基本值属性正如你洗剪吹染黄毛跟你妈无关 * 在p1实例下增加一个age属性的普通操作与原型无关。跟var o{}; o.age20一样。 * p1下面多了个属性age而__proto__跟 Mother.prototype一样age18。 * p2只有属性name__proto__跟 Mother.prototype一样 */ p1.home[0] Shenzhen; /* 原型中引用类型属性的共享正如你烧了你家就是烧了你全家的家 * 这个先过下文再仔细唠叨一下可好 * p1Jack,20; __proto__:{__proto__:18,[Shenzhen,Shanghai]} * p2Mark; __proto__:{__proto__:18,[Shenzhen,Shanghai]} */ p1.home [Hangzhou, Guangzhou]; /* 其实跟p1.age20一样的操作。换成这个理解: var o{}; o.home[big,house] * p1Jack,20,[Hangzhou,Guangzhou]; __proto__:{__proto__:18,[Shenzhen,Shanghai]} * p2Mark; __proto__:{__proto__:18,[Shenzhen,Shanghai]} */ delete p1.age; /* 删除实例的属性之后原本被覆盖的原型值就重见天日了。正如你剃了光头遗传的迷人小卷发就长出来了。 * 这就是向上搜索机制先搜你然后你妈再你妈他妈所以你妈的改动会动态影响你。 * p1Jack,[Hangzhou,Guangzhou]; __proto__:{__proto__:18,[Shenzhen,Shanghai]} * p2Mark; __proto__:{__proto__:18,[Shenzhen,Shanghai]} */ Person.prototype.lastName Jin; /* 改写原型动态反应到实例中。正如你妈变新潮了邻居提起你都说你妈真潮。 * 注意这里我们改写的是Person的原型就是往Mother里加一个lastName属性等同于Mother.lastNameJin * 这里并不是改Mother.prototype改动不同的层次效果往往会有很大的差异。 * p1Jack,[Hangzhou,Guangzhou]; __proto__:{jin,__proto__:18,[Shenzhen,Shanghai]} * p2Mark; __proto__:{jin,__proto__:18,[Shenzhen,Shanghai]} */ Person.prototype { age: 28, address: { country: USA, city: Washington } }; var p3 new Person(Obama); /* 重写原型这个时候Person的原型已经完全变成一个新的对象了也就是说Person换了个妈叫后妈。 * 换成这样理解var a10; ba; a20; ca。所以b不变变得是c所以p3跟着后妈变化与亲妈无关。 * p1Jack,[Hangzhou,Guangzhou]; __proto__:{jin,__proto__:18,[Shenzhen,Shanghai]} * p2Mark; __proto__:{jin,__proto__:18,[Shenzhen,Shanghai]} * p3:Obama;__proto__: 28 {country: USA, city: Washington} */ Mother.prototype.no 9527; /* 改写原型的原型动态反应到实例中。正如你妈他妈变新潮了邻居提起你都说你丫外婆真潮。 * 注意这里我们改写的是Mother.prototypep1p2会变但上面p3跟亲妈已经了无瓜葛了不影响他。 * p1Jack,[Hangzhou,Guangzhou]; __proto__:{jin,__proto__:18,[Shenzhen,Shanghai],9527} * p2Mark; __proto__:{jin,__proto__:18,[Shenzhen,Shanghai],9527} * p3:Obama;__proto__: 28 {country: USA, city: Washington} */ Mother.prototype { car: 2, hobby: [run,walk] }; var p4 new Person(Tony); /* 重写原型的原型这个时候Mother的原型已经完全变成一个新的对象了人他妈换了个后妈 * 由于上面Person与Mother已经断开联系了这时候Mother怎么变已经不影响Person了。 * p4:Tony;__proto__: 28 {country: USA, city: Washington} */ Person.prototype new Mother(); //再次绑定 var p5 new Person(Luffy); // 这个时候如果需要应用这些改动的话那就要重新将Person的原型绑到mother上了 // p5:Luffy;__proto__:{__proto__: 2, [run,walk]} p1.__proto__.__proto__.__proto__.__proto__ //null你说原型链的终点不是null Mother.__proto__.__proto__.__proto__ //null你说原型链的终点不是null看完基本能理解了吧现在再来说说 p1.age 20、p1.home [Hangzhou, Guangzhou] 和 p1.home[0] Shenzhen 的区别。 p1.home[0] Shenzhen; 总结一下是 p1.object.methodp1.object.property 这样的形式。p1.age 20; p1.home [Hangzhou, Guangzhou];这两句还是比较好理解的先忘掉原型吧想想我们是怎么为一个普通对象增加属性的var obj new Object(); obj.namexxx; obj.num [100, 200];这样是不是就理解了呢一样一样的呀。那为什么 p1.home[0] Shenzhen 不会在 p1 下创建一个 home 数组属性然后将其首位设为 Shenzhen呢 我们还是先忘了这个想想上面的obj对象如果写成这样 var obj.name xxx, obj.num [100, 200]能得到你要的结果吗 显然除了报错你什么都得不到。因为obj还未定义又怎么能往里面加入东西呢同理p1.home[0]中的 home 在 p1 下并未被定义所以也不能直接一步定义 home[0] 了。如果要在p1下创建一个 home 数组当然是这么写了p1.home []; p1.home[0] Shenzhen;这不就是我们最常用的办法吗而之所以 p1.home[0] Shenzhen 不直接报错是因为在原型链中有一个搜索机制。当我们输入 p1.object 的时候原型链的搜索机制是先在实例中搜索相应的值找不到就在原型中找还找不到就再往上一级原型中搜索……一直到了原型链的终点就是到null还没找到的话就返回一个 undefined。当我们输入 p1.home[0] 的时候也是同样的搜索机制先搜索 p1 看有没有名为 home 的属性和方法然后逐级向上查找。最后我们在Mother的原型里面找到了所以修改他就相当于修改了 Mother 的原型啊。

相关新闻

2026春招AI抢人大战:小白程序员如何抓住大模型红利,速收藏!

2026春招AI抢人大战:小白程序员如何抓住大模型红利,速收藏!

2026年春招AI岗位激增8.7倍,大厂纷纷抢占人才,AI科学家月薪破13万。文章分析了AI岗位暴涨的原因、大厂抢人策略及职场焦虑,指出AI能力已成为职场新技能,并探讨了AI人才抢夺战后的可能发展趋势。对于想要抓住AI红利的程序员&#x…

2026/7/3 7:40:05 阅读更多 →
从Unity场景搭建到IoT数据驱动:我的数字孪生入门路径分享

从Unity场景搭建到IoT数据驱动:我的数字孪生入门路径分享

本文分享一个非科班出身的开发者,如何在15天内走通数字孪生全流程,并附上技术栈拆解和学习建议。 写在前面 2026年,数字孪生赛道持续升温。全球市场规模预计达到339.7亿美元(Fortune Business Insights数据)&#xff0…

2026/7/3 7:38:04 阅读更多 →
Flash Attention 安装地狱六重崩溃:CUDA_HOME not set、undefined symbol、预编译轮子不兼容、pip 编译两小时失败——逐一击破

Flash Attention 安装地狱六重崩溃:CUDA_HOME not set、undefined symbol、预编译轮子不兼容、pip 编译两小时失败——逐一击破

Flash Attention 安装地狱六重崩溃:CUDA_HOME not set、undefined symbol、预编译轮子不兼容、pip 编译两小时失败——逐一击破 如果你在 pip install flash-attn 之后见过以下任何一条报错——这篇文章就是写给你的。Flash Attention 是 AI 推理加速最重要的依赖&a…

2026/7/3 7:38:04 阅读更多 →

最新新闻

5步彻底解决OFD文件兼容性问题:开源转换工具实战指南

5步彻底解决OFD文件兼容性问题:开源转换工具实战指南

5步彻底解决OFD文件兼容性问题:开源转换工具实战指南 【免费下载链接】Ofd2Pdf Convert OFD files to PDF files. 项目地址: https://gitcode.com/gh_mirrors/ofd/Ofd2Pdf 你是否曾经因为收到OFD格式的电子发票而无法在手机上查看?是否因为政府发…

2026/7/3 8:38:26 阅读更多 →
AI知识库投喂:企业智能化的关键一步

AI知识库投喂:企业智能化的关键一步

于企业智能化转型的浪潮里面, AI知识库已然变成提升工作效率以及决策质量的核心工具。可是呢, 好多企业在部署AI知识库之际, 常常忽视了“投喂”这个关键环节。所说的“投喂”, 是把企业内部的结构化还有非结构化数据, 像项目文档、会议纪要、客户资料、技术手册等, 有系统地输…

2026/7/3 8:38:26 阅读更多 →
HsMod终极指南:55个功能全面解锁您的炉石传说游戏体验

HsMod终极指南:55个功能全面解锁您的炉石传说游戏体验

HsMod终极指南:55个功能全面解锁您的炉石传说游戏体验 【免费下载链接】HsMod Hearthstone Modification Based on BepInEx 项目地址: https://gitcode.com/GitHub_Trending/hs/HsMod HsMod是基于BepInEx框架开发的炉石传说增强插件,为您提供了55…

2026/7/3 8:36:25 阅读更多 →
软考中级→高级→系统架构师 vs HCIA→HCIP→HCIE:双轨成长路线图(附2024通过率与平均备考时长)

软考中级→高级→系统架构师 vs HCIA→HCIP→HCIE:双轨成长路线图(附2024通过率与平均备考时长)

更多请点击: https://kaifayun.com 第一章:软考vs华为认证HCIPHCIE区别 软考(计算机技术与软件专业技术资格考试)与华为认证(HCIP/HCIE)代表两类不同定位、目标与评估逻辑的技术能力认证体系。软考由国家工…

2026/7/3 8:36:25 阅读更多 →
如何快速掌握Forza Mods AIO:极限竞速地平线游戏修改终极指南

如何快速掌握Forza Mods AIO:极限竞速地平线游戏修改终极指南

如何快速掌握Forza Mods AIO:极限竞速地平线游戏修改终极指南 【免费下载链接】Forza-Mods-AIO Free and open-source FH4 & FH5 mod tool 项目地址: https://gitcode.com/gh_mirrors/fo/Forza-Mods-AIO Forza Mods AIO是一款专为《极限竞速:…

2026/7/3 8:32:22 阅读更多 →
乐道L60深度测试:端到端驾驶与自动泊车如何重塑智能出行体验

乐道L60深度测试:端到端驾驶与自动泊车如何重塑智能出行体验

1. 项目概述:一次深度体验乐道L60智能驾驶核心能力的旅程最近,我拿到了一台搭载最新版本车机系统的乐道L60试驾车,进行了一次为期一周的深度测试。这次测试的核心目标非常明确,就是聚焦于其智能驾驶系统的两大核心功能&#xff1a…

2026/7/3 8:30:22 阅读更多 →

日新闻

Nginx防御TLS重协商攻击实战:从原理到配置与监控

Nginx防御TLS重协商攻击实战:从原理到配置与监控

1. 项目概述:为什么TLS重协商攻击至今仍需警惕十多年前的CVE-2011-1473,一个关于TLS/SSL协议重协商机制的漏洞,现在提起来还有必要吗?很多运维和开发朋友可能会觉得,这都老掉牙了,现代服务器和客户端不都默…

2026/7/3 0:03:59 阅读更多 →
华为防火墙双通道远程管理实战:Web与SSH配置详解

华为防火墙双通道远程管理实战:Web与SSH配置详解

1. 项目概述:为什么需要双通道远程管理防火墙?在任何一个稍具规模的企业网络里,防火墙都是那个默默守护在边界的关键角色。作为网络工程师,我们不可能每次都跑到机房,插上console线去配置它。远程管理能力,…

2026/7/3 0:03:59 阅读更多 →
AD74413R与PIC18F65K40的高精度工业数据采集方案

AD74413R与PIC18F65K40的高精度工业数据采集方案

1. 项目概述:AD74413R与PIC18F65K40的协同工作在工业自动化和精密测量领域,同时实现高精度模数转换(ADC)和数模转换(DAC)功能是许多复杂系统的核心需求。AD74413R作为一款四通道可配置模拟输入/输出器件,与PIC18F65K40微控制器的组合&#xf…

2026/7/3 0:05:59 阅读更多 →

周新闻

月新闻