Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $YECBGYFECGEAFWHA as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2

Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $BBWFDDBHHYHDXXAB as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2
js怎么获取原型链上的默认值_创想鸟

js怎么获取原型链上的默认值

javascript中“获取原型链上的默认值”并非主动获取,而是通过属性查找机制在对象自身不存在该属性时,自动沿原型链向上搜索直到找到或到达链尾;2. 判断属性是否来自原型链而非自身,应使用object.prototype.hasownproperty()方法,若返回false则说明属性继承自原型链;3. 修改原型链上的属性可能引发共享引用类型导致的意外修改和属性遮蔽带来的逻辑混乱,尤其在多个实例间共享可变对象时需格外谨慎;4. 实际开发中应利用原型链共享方法以节省内存、实现继承结构、提供可覆盖的默认配置,但避免修改内置对象原型,确保实例独有数据与共享行为分离。

js怎么获取原型链上的默认值

JavaScript里说“获取原型链上的默认值”,这说法挺有意思的。其实JS并没有一个专门的“默认值”概念等着你去取,它更像是一种查找机制。当你尝试访问一个对象的某个属性时,如果这个对象本身没有这个属性,JS引擎就会顺着它的原型链往上找,直到找到或者找到头(也就是

null

)。所以,你最终拿到的那个值,如果不是对象自身的,那它就是来自原型链上的某个“默认”——因为它在那里,等待被继承或被覆盖。

js怎么获取原型链上的默认值

解决方案

理解JavaScript如何通过原型链查找属性是关键。当你写

myObject.someProperty

时,JavaScript会先看看

myObject

自身有没有

someProperty

。如果没有,它就会去

myObject

的原型(也就是

Object.getPrototypeOf(myObject)

)上找。如果原型上也没有,它会继续往原型的原型上找,直到找到这个属性或者原型链的顶端(通常是

Object.prototype

,再往上就是

null

)。找到的第一个值就是你要的。

所以,“获取原型链上的默认值”本质上就是让JS的属性查找机制自然地工作。如果你想明确地知道一个属性是从哪里来的,或者想遍历原型链来找到它,可以这样做:

js怎么获取原型链上的默认值

function Animal(name) {    this.name = name;}Animal.prototype.species = 'Unknown'; // 原型链上的“默认”属性Animal.prototype.sound = function() {    return 'Generic animal sound';};let dog = new Animal('Buddy');dog.species = 'Canine'; // dog 自身有了 species 属性,覆盖了原型上的let cat = new Animal('Whiskers');// cat 自身没有 species 属性,会去原型链上找console.log(dog.species); // 输出 'Canine' (dog自身的属性)console.log(cat.species); // 输出 'Unknown' (从 Animal.prototype 获取)// 如果你想明确地获取原型链上的那个“默认”值,你可以直接访问原型:console.log(Object.getPrototypeOf(cat).species); // 输出 'Unknown'console.log(Animal.prototype.species); // 输出 'Unknown'// 甚至可以写一个函数来遍历查找:function findPropertyInPrototypeChain(obj, propName) {    let current = obj;    while (current) {        if (Object.prototype.hasOwnProperty.call(current, propName)) {            // 找到了,返回当前对象和属性值            return {                owner: current,                value: current[propName]            };        }        current = Object.getPrototypeOf(current);    }    return null; // 没找到}console.log(findPropertyInPrototypeChain(dog, 'species')); // { owner: { name: 'Buddy', species: 'Canine' }, value: 'Canine' }console.log(findPropertyInPrototypeChain(cat, 'species')); // { owner: Animal { species: 'Unknown', sound: [Function: sound] }, value: 'Unknown' }console.log(findPropertyInPrototypeChain(cat, 'sound'));   // { owner: Animal { species: 'Unknown', sound: [Function: sound] }, value: [Function: sound] }console.log(findPropertyInPrototypeChain(cat, 'nonExistent')); // null

这基本上就是JS处理“默认值”的方式。它不是一个主动的“获取”动作,更像是一个被动的“查找”过程。

如何判断一个属性是否来自原型链而非自身?

在JavaScript开发中,你经常会遇到需要区分一个属性是对象自身的(own property)还是从原型链上继承来的情况。这不仅仅是好奇心,很多时候它直接影响你的代码逻辑,比如遍历对象属性时。

js怎么获取原型链上的默认值

最常用的方法是使用

Object.prototype.hasOwnProperty()

方法。这个方法会检查一个对象是否直接拥有某个属性,而不会去原型链上查找。

const myObject = {};myObject.myOwnProperty = 'I am unique';const protoObject = {    inheritedProperty: 'I am inherited'};Object.setPrototypeOf(myObject, protoObject);console.log(myObject.myOwnProperty);     // 'I am unique'console.log(myObject.inheritedProperty); // 'I am inherited'// 判断是否是自身属性console.log(myObject.hasOwnProperty('myOwnProperty'));     // trueconsole.log(myObject.hasOwnProperty('inheritedProperty')); // false// 另一个需要注意的运算符是 'in'// 'in' 运算符会检查属性是否存在于对象本身或其原型链上console.log('myOwnProperty' in myObject);     // trueconsole.log('inheritedProperty' in myObject); // true// 甚至 'toString' 这种来自 Object.prototype 的属性也会被 'in' 找到console.log('toString' in myObject);          // trueconsole.log(myObject.hasOwnProperty('toString')); // false

所以,如果你想确保只处理对象自身的属性,

hasOwnProperty

是你的首选。比如,在遍历对象的属性时,使用

for...in

循环结合

hasOwnProperty

是一个常见的模式,可以避免遍历到原型链上的属性:

for (const key in myObject) {    if (myObject.hasOwnProperty(key)) {        console.log(`Own property: ${key} = ${myObject[key]}`);    }}// 输出: Own property: myOwnProperty = I am unique

这避免了不必要的副作用,也让你的代码更健壮。

修改原型链上的属性会带来哪些意想不到的问题?

修改原型链上的属性,尤其是那些会被多个实例共享的属性,常常会引发一些让人头疼的问题,我个人就踩过不少坑。它不像修改实例自身的属性那么直接,因为牵扯到“共享”这个概念。

一个最典型的例子就是共享引用类型数据:

function Configurator() {}// 假设我们想给所有 Configurator 实例一个默认的设置对象Configurator.prototype.defaultSettings = {    theme: 'light',    fontSize: 14};let user1Config = new Configurator();let user2Config = new Configurator();// user1 修改了设置user1Config.defaultSettings.theme = 'dark';console.log(user1Config.defaultSettings.theme); // 'dark'console.log(user2Config.defaultSettings.theme); // 'dark' —— 糟糕!user2的设置也被改了

这里的问题在于

defaultSettings

是一个对象,它在原型上被所有实例共享。当你通过

user1Config.defaultSettings

去修改它时,实际上修改的是原型上的那个唯一对象,导致所有其他实例也看到了这个修改。如果

defaultSettings

是一个原始值(比如字符串或数字),就不会有这个问题,因为修改原始值会创建实例自己的副本(也就是“遮蔽”)。

另一个问题是“属性遮蔽”(Shadowing)。当你给一个实例添加一个与原型上同名的属性时,实例的属性会“遮蔽”原型上的属性。这听起来没什么,但如果后续你删除了实例的属性,那么原型上的属性又会“浮现”出来,这可能会导致一些难以追踪的bug:

function Item() {}Item.prototype.status = 'available';let item1 = new Item();let item2 = new Item();console.log(item1.status); // 'available'item1.status = 'sold'; // 实例自身有了 status 属性,遮蔽了原型上的console.log(item1.status); // 'sold'console.log(item2.status); // 'available' (item2 依然使用原型上的)delete item1.status; // 删除了 item1 自身的 status 属性console.log(item1.status); // 'available' —— 原型上的又回来了

这种行为在复杂系统中可能会让开发者感到困惑,尤其是在没有明确区分自身属性和继承属性的情况下。

总的来说,修改原型链上的属性需要非常谨慎。对于引用类型数据,几乎总是建议在实例创建时就进行深拷贝或在构造函数中初始化,而不是依赖原型上的共享对象。而对于方法,原型是理想的放置位置,因为方法通常不改变自身状态。

在实际开发中,何时应该利用原型链的特性?

原型链在JavaScript中是实现继承和共享行为的核心机制,它的用处非常广泛,而且在很多场景下是性能和内存优化的关键。

最经典也是最直接的用例就是共享方法。如果你有成百上千个对象实例,每个实例都需要执行同样的方法(比如一个

greet()

方法),把这个方法放在原型上是最高效的方式。每个实例不会拥有自己的

greet

函数副本,它们都指向原型上的同一个函数。这不仅节省了内存,也保证了行为的一致性。

function User(name) {    this.name = name;}// 将方法定义在原型上User.prototype.sayHello = function() {    console.log(`Hello, my name is ${this.name}`);};let userA = new User('Alice');let userB = new User('Bob');userA.sayHello(); // Hello, my name is AliceuserB.sayHello(); // Hello, my name is Bob// 它们共享同一个函数引用console.log(userA.sayHello === userB.sayHello); // true

这种模式是JavaScript面向对象编程的基石,也是ES6

class

语法糖背后实际运行的机制。

另一个重要的应用是实现继承。通过原型链,一个对象可以继承另一个对象的属性和方法。这允许我们构建复杂的类型层次结构,实现代码复用。

// 假设我们有一个通用的 Animal 构造函数function Animal(name) {    this.name = name;}Animal.prototype.eat = function() {    console.log(`${this.name} is eating.`);};// 现在我们想创建一个 Dog 类型,它继承 Animal 的特性function Dog(name, breed) {    Animal.call(this, name); // 调用父类构造函数,继承属性    this.breed = breed;}// 关键一步:让 Dog 的原型继承 Animal 的原型Dog.prototype = Object.create(Animal.prototype);Dog.prototype.constructor = Dog; // 修复 constructor 指向// Dog 自己的方法Dog.prototype.bark = function() {    console.log(`${this.name} barks! Woof!`);};let myDog = new Dog('Max', 'Golden Retriever');myDog.eat();  // Max is eating. (继承自 Animal.prototype)myDog.bark(); // Max barks! Woof! (Dog.prototype 自己的方法)

通过

Object.create()

来设置原型,是实现这种继承的一种干净且推荐的方式。

此外,原型链也常用于添加默认配置或行为。比如,你有一个库或者框架,想要为用户提供一些默认的设置,但允许他们覆盖。你可以把这些默认设置放在原型上,用户在实例上设置同名属性就可以覆盖它。但正如前面提到的,对于可变对象,需要非常小心。

最后,Polyfills(垫片)也经常利用原型链来为旧的JavaScript环境添加新的API。例如,如果旧浏览器不支持

Array.prototype.includes

,你可以手动在

Array.prototype

上添加这个方法。但这通常不推荐在生产环境中随意修改内置对象的原型,因为它可能导致冲突和不可预测的行为。

总结一下,原型链是JavaScript的灵魂之一,理解并合理利用它,能让你写出更高效、更结构化的代码。核心思想就是:共享不变的、通用的行为和属性,让每个实例只拥有它自己独有的数据。

以上就是js怎么获取原型链上的默认值的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1516958.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
Morris遍历是什么?O(1)空间的遍历
上一篇 2025年12月20日 10:26:19
js怎么获取原型链上的迭代器方法
下一篇 2025年12月20日 10:26:26

相关推荐

  • 悟空浏览器提示“网络错误”无法上网怎么办_悟空浏览器网络错误解决方法

    首先检查网络连接是否正常,确认Wi-Fi或移动数据已开启并信号良好;尝试切换网络类型或重启路由器。若问题仍存在,进入设置清除悟空浏览器缓存与数据,排除因缓存堆积导致的加载失败。接着可更改DNS为8.8.8.8和114.114.114.114以提升解析成功率。同时禁用浏览器插件与扩展功能,避免其干扰网…

    2026年9月23日
    100
  • VS Code算法实战:竞赛编程与调试环境搭建

    首先安装编程语言环境及VS Code扩展,如C/C++、Code Runner和LeetCode;接着配置Code Runner支持编译运行与输入重定向;最后通过代码片段提升编码速度,形成高效竞赛开发环境。 在竞赛编程中,高效的开发环境能大幅提升编码速度与调试效率。VS Code凭借轻量、可扩展和强…

    2026年9月23日
    000
  • 字节入局,AR眼镜掀起新“风口”?

    近日,关于老凤祥与字节跳动合作推出AI眼镜的消息在网络上引发热议。据相关媒体报道,老凤祥计划联合字节跳动旗下的火山引擎共同开发多款AI眼镜,并由豆包大模型提供技术支持,预计将在今年7月正式发布。 对此,6月12日,火山引擎方面进行了澄清。其负责人表示,并未有与老凤祥合作研发AI智能眼镜的计划。而豆包…

    2026年9月23日
    000
  • AdobePhotoshop的AI混合工具怎么用?掌握智能图像编辑的教程

    Photoshop的AI混合工具以生成式填充和神经网络滤镜为代表,通过语义理解实现智能图像融合。生成式填充可依据文本提示添加、移除或扩展内容,自动匹配光影与纹理;神经网络滤镜如和谐化则优化颜色与光照匹配。与传统基于像素计算的混合模式不同,AI工具理解图像内容,实现“生成并融合”。使用时需精准输入英文…

    2026年9月23日
    100
  • 解决 Conda 环境中 Java 版本冲突的策略

    本文旨在解决 Conda 环境中 Java 版本激活不正确的问题。当用户尝试在 Conda 环境中指定特定 Java 版本(如 OpenJDK 8)时,系统可能仍激活旧的或错误的 Java 版本。教程将详细分析问题根源,并提供一种通过精确指定 Java 包名来确保 Conda 环境正确管理 Java…

    2026年9月23日
    000
  • Windows安装过程中蓝屏INACCESSIBLE_BOOT_DEVICE怎么办?

    1、蓝屏“INACCESSIBLE_BOOT_DEVICE”通常因SATA模式不匹配或驱动缺失导致;2、进入BIOS将SATA模式从RAID改为AHCI可解决兼容性问题;3、安装时加载主板存储控制器驱动以识别NVMe或RAID磁盘;4、使用diskpart命令清理磁盘并转换为GPT(UEFI)或MB…

    2026年9月23日
    000
  • 谷歌为 Gemini CLI 带来扩展功能

    谷歌旗下的 AI 编程助手 Gemini CLI 最近推出了名为“扩展”的全新功能。官方表示,这一更新让用户能够“接入常用工具,并定制属于自己的 AI 命令行体验”。现在,任何开发者都可以发布扩展程序,无需经过谷歌的审核批准即可上线使用。 目前扩展库中已提供超过 50 款扩展,涵盖多种实用场景。例如…

    2026年9月23日
    000
  • 递归方法中静态变量状态管理与重置策略

    本教程探讨了在递归方法中使用静态(全局)变量时,如何正确管理和重置其状态,以避免多次调用时出现累积错误。核心问题在于静态变量在方法调用之间保留其值,导致后续调用基于旧状态进行计算。解决方案是在递归的基准情况(base case)中,在完成当前调用的计算后,立即将静态变量重置为初始值,从而确保每次独立…

    2026年9月23日
    200
  • 绘蛙AI修图怎样优化旅游照片?旅行社合作方案

    绘蛙ai修图的核心优势在于智能识别与校正,能自动调整白平衡、曝光和色彩饱和度,解决光线不佳或色彩偏差问题;2. 提供一键美化与风格化处理,内置“电影感”“清新自然”等风格,综合调整光影、对比度与锐度,提升照片视觉质感;3. 具备细节增强与瑕疵修复能力,可智能去除背景杂物、降噪、锐化,并自然修复人像瑕…

    2026年9月23日
    000
  • 谷歌浏览器如何将网页添加到阅读清单_谷歌浏览器添加网页到阅读清单方法

    谷歌浏览器支持通过地址栏按钮、右键菜单、主菜单和快捷键四种方式将网页添加到阅读清单。1、点击地址栏右侧“添加到阅读清单”图标即可保存;2、在页面空白处右键选择“添加页面到阅读清单”;3、通过三点菜单进入书签子菜单选择“添加到阅读清单”;4、使用Command+Shift+D(Mac)或Ctrl+Sh…

    2026年9月23日
    100
  • Deepseek 满血版联动 Typinator Pro,创建复杂文本模板​

    Deepseek 满血版联动 Typinator Pro,创建复杂文本模板​Deepseek 满血版联动 Typinator Pro,创建复杂文本模板​Deepseek 满血版联动 Typinator Pro,创建复杂文本模板​Deepseek 满血版联动 Typinator Pro,创建复杂文本模板​

    将 ai 与 typinator 联动可打造高效文本模板系统。1. 使用 deepseek 等 ai 工具生成结构化内容,如邮件草稿;2. 将生成内容调整为 typinator 变量格式(如 %|name%);3. 导入 typinator 并设置快捷短语,实现一键插入。典型场景包括批量写邮件、报告…

    2026年9月23日 用户投稿
    000
  • Java中用户输入验证:正确使用equals()或转换为整数进行比较

    本教程详细阐述了Java中用户输入字符串(如菜单选项)验证的正确方法。针对==运算符在字符串比较中的局限性,文章介绍了两种解决方案:一是使用String.equals()方法进行内容比较,二是将字符串输入解析为整数后进行数值比较。通过代码示例,帮助开发者避免常见的字符串比较错误,确保程序逻辑的健壮性…

    2026年9月23日
    000
  • 微软免费文件恢复工具介绍

    微软免费文件恢复工具介绍微软免费文件恢复工具介绍微软免费文件恢复工具介绍微软免费文件恢复工具介绍

    现在好了,最近微软在 windows 10 应用商店中上架了一款免费的数据删除恢复工具 windows file recovery,猿妹再也不用担心误删文件了。 Windows File Recovery基于命令行程序设计,大小仅有8.26MB,所有Windows 10用户均可免费下载使用。 无论是…

    2026年9月23日 用户投稿
    100
  • VSCode精简配置Perl:语法检查、中文编码、正则调试

    vscode中perl语法检查不生效的主要原因是perl解释器路径未正确配置或缺失,解决方法是在settings.json中明确设置”perl.perlpath”指向正确的perl可执行文件;其次是因缺少cpan模块导致检查失败,需安装对应模块;此外,多个perl扩展冲突、大…

    2026年9月23日
    000
  • AO3镜像站直接访问链接_AO3镜像站推荐镜像站点

    AO3镜像站直接访问链接包括https://archiveofourown.org/、https://ao3.cubeart.club/、https://l.ao4.live、https://s.ao3l.live,用户可通过浏览器直接输入网址访问,主站无法加载时可切换镜像站点,部分支持手机浏览且无…

    2026年9月23日
    000
  • AfterEffects如何制作AI动效视频?创建动态AI视频的完整教程

    AfterEffects如何制作AI动效视频?创建动态AI视频的完整教程AfterEffects如何制作AI动效视频?创建动态AI视频的完整教程AfterEffects如何制作AI动效视频?创建动态AI视频的完整教程AfterEffects如何制作AI动效视频?创建动态AI视频的完整教程

    答案是掌握AE动画原理并融合AI素材进行创作。需根据风格选择合适AI工具(如Midjourney、RunwayML),注重素材质量、可定制性与透明背景支持;将AI素材导入AE后,调整分辨率,运用颜色校正、模糊、跟踪及表达式增强效果;通过关键帧控制位置、缩放、旋转,并应用缓动实现流畅动画;搭配契合主题…

    2026年9月23日 用户投稿
    200
  • 如何在Java中安装Eclipse开发环境

    先安装JDK并配置环境变量,再下载安装Eclipse IDE。1. 安装JDK:从Oracle或Eclipse Adoptium下载JDK 17/21,按提示安装,设置JAVA_HOME和PATH,用java -version验证。2. 安装Eclipse:官网下载“Eclipse IDE for …

    2026年9月23日
    000
  • 配置Linux下vim自动缩进

    从终端打开配置文件: vim ~/.vimrc 添加如下代码: set tabstop=4set softtabstop=4set shiftwidth=4set autoindentset cindentset cinoptions={0,1s,t0,n-2,p2s,(03s,=.5s,>1…

    2026年9月23日
    800
  • 2025 旗舰手机选购指南:四款机型精准匹配你的需求

    2025 旗舰手机选购指南:四款机型精准匹配你的需求2025 旗舰手机选购指南:四款机型精准匹配你的需求2025 旗舰手机选购指南:四款机型精准匹配你的需求2025 旗舰手机选购指南:四款机型精准匹配你的需求

    在智能手机市场持续繁荣的今天,面对琳琅满目的旗舰%ignore_a_1%,用户往往难以抉择。本文精选四款当前热门的高端手机,帮你高效锁定心仪之选。 1 五款旗舰机型推荐 1. OPPO Find X9 系列 大容量电池、护眼显示屏、双 2 亿像素影像系统——适合对续航敏感、热爱摄影以及重视视觉健康的…

    2026年9月23日 用户投稿
    200
  • VSCode如何实现AI辅助编程 VSCode Copilot插件的深度使用指南

    github copilot能显著提升编程效率,但需合理使用。1. 安装插件并登录github账号是基础步骤;2. 提供清晰的上下文,如规范命名和详细注释,可提高生成代码的准确性;3. 利用快捷键切换多个建议,筛选最优方案并进行修改;4. 对生成代码必须严格审查,尤其关注安全性与业务逻辑匹配度;5.…

    2026年9月23日
    100

发表回复

登录后才能评论
关注微信