JavaScript 原型

JavaScript 的原型(Prototype)是其面向对象编程模型的核心概念之一,它决定了对象如何继承属性和方法。通过理解 JavaScript 的原型,你可以更好地理解对象之间的关系以及如何扩展对象功能。


核心概念

  1. [[Prototype]](内部属性)

    • 每个 JavaScript 对象都有一个隐藏的内部属性,称为 [[Prototype]]
    • 这个属性通常指向另一个对象,也就是该对象的原型。
  2. Object.prototype

    • 所有普通对象都最终继承自 Object.prototype,除非手动更改。
    • Object.prototype 是原型链的顶端,它的 [[Prototype]]null
  3. __proto__

    • 这是一些浏览器(如 Chrome 和 Firefox)中提供的访问 [[Prototype]] 的非标准方式。
    • 它主要用于调试,不推荐在实际代码中使用。
    • 现代的方式是使用 Object.getPrototypeOf(obj)Object.setPrototypeOf(obj, prototype)
  4. 构造函数与 .prototype

    • 每个函数(作为构造函数)都有一个 prototype 属性。
    • 当用构造函数创建一个对象时,该对象的 [[Prototype]] 会被设置为该构造函数的 prototype

示例

1. 创建对象与原型链
function Person(name) {this.name = name;
}Person.prototype.sayHello = function () {console.log(`Hello, my name is ${this.name}`);
};const person1 = new Person("Alice");
person1.sayHello(); // Hello, my name is Aliceconsole.log(person1.__proto__ === Person.prototype); // true
console.log(Person.prototype.__proto__ === Object.prototype); // true
console.log(Object.prototype.__proto__); // null
2. 使用 Object.create 创建对象
const proto = {greet() {console.log("Hello!");},
};const obj = Object.create(proto);
obj.greet(); // Hello!
console.log(Object.getPrototypeOf(obj) === proto); // true
3. 修改原型
function Dog(name) {this.name = name;
}const dog = new Dog("Rex");// 修改原型
Dog.prototype.bark = function () {console.log(`${this.name} says Woof!`);
};dog.bark(); // Rex says Woof!

原型链

JavaScript 通过原型链实现继承。如果对象在自身没有找到属性或方法,会沿着原型链向上查找,直到顶端的 Object.prototype,若仍未找到,则返回 undefined

示例:

const obj = {};
console.log(obj.toString()); // "[object Object]" 来自 Object.prototype

原型链结构:

  • objObject.prototypenull

注意点

  1. 避免循环引用
    修改原型链时要小心,避免导致无限循环。

    const a = {};
    a.__proto__ = a; // 不推荐,可能导致错误
    
  2. 性能问题
    频繁访问深层次的原型链可能会导致性能问题。

  3. 现代方法
    使用 class 语法可以更优雅地操作原型。

    class Animal {speak() {console.log("Animal speaks");}
    }class Dog extends Animal {bark() {console.log("Dog barks");}
    }const dog = new Dog();
    dog.speak(); // Animal speaks
    dog.bark();  // Dog barks
    

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/61080.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据结构树和二叉树知识点和递归序列

二叉树知识点 一.树的概念1.1关于树的名词解释 二.二叉树的概念1. 二叉树性质: 三.满二叉树与完全二叉树递归前序遍历递归中序遍历递归后续遍历 一.树的概念 树是一种非线性数据结构,它是由n个或大于n个的结点来组成具有层次关系的一个集合(…

速通前端篇 —— CSS

找往期文章包括但不限于本期文章中不懂的知识点: 个人主页:我要学编程程(ಥ_ಥ)-CSDN博客 所属专栏:速通前端 目录 CSS的介绍 基本语法规范 CSS选择器 标签选择器 class选择器 id选择器 复合选择器 通配符选择器 CSS常见样式 颜…

使用 Elastic 3 步实现基于 OTel 的原生 K8s 和应用可观测性

作者:来自 Elastic Bahubali Shetti Elastic 的 OpenTelemetry 发行版现已支持 OTel Operator,可使用 EDOT SDK 自动检测应用程序,并管理 EDOT OTel Collector 的部署和生命周期以实现 Kubernetes 可观察性。了解如何通过 3 个简单步骤进行配…

stack、queue、priority_queue、deque的使用和模拟实现

目录 1.容器适配器 2.stack stack的常用接口及使用示例 stack的模拟实现 3.queue queue的常用接口及使用示例 queue的模拟实现 4.priority_queue priority_queue的常用接口及使用示例 priority_queue的模拟实现 5.deque 认识deque deque底层的数据结构 deque和ve…

Linux的cuDNN(cudnn)安装教程(CUDA(cuda\cuda toolkit))

CUDA(cuda\cuda toolkit)安装教程 https://blog.csdn.net/huiyayaya/article/details/143863835?spm1001.2014.3001.5502官网下载cudnn https://developer.nvidia.com/rdp/cudnn-archive这个下载到自己的电脑 下载到本地就好 复制到服务器 切换到cudnn文件所在目…

Kafka中ACKS LSO LEO LW HW AR ISR OSR解析

名称解释 ACKS(Acknowledgments)确认、回执 LW(Low watermark)低水位、LSO(Log start offset)起始偏移量 HW(High watermark)高水位 LEO(Log end offset)…

C++设计模式行为模式———迭代器模式

文章目录 一、引言二、迭代器模式三、总结 一、引言 迭代器模式是一种行为设计模式, 让你能在不暴露集合底层表现形式 (列表、 栈和树等) 的情况下遍历集合中所有的元素。C标准库中内置了很多容器并提供了合适的迭代器,尽管我们不…

智能体Agent调研

单个智能体建模与优化现状 人类长期以来追求类似于或超越人类水平的人工智能 (AI),而 基于AI的代理(Agent)被认为是一个有前途的研究方向。传统计算机领域的Agent有多种,如自动化脚本、网络爬虫、推荐系统、软件机器人能够独立自…

SAP PI/PO Proxy2JDBC SQL_QUERY动态接口示例

目录 背景: 完整demo步骤: IR: ID: SPROXY: 测试代码: 注意点: 背景: 中途临时帮客户项目做其他功能,项目上有部分开发项需要通过PO去第三方数据库取数,项目上的开发对PO不太熟&#xf…

【汇编语言】数据处理的两个基本问题(三) —— 汇编语言的艺术:从div,dd,dup到结构化数据的访问

文章目录 前言1. div指令1.1 使用div时的注意事项1.2 使用格式1.3 多种内存单元表示方法进行举例1.4 问题一1.5 问题一的分析与求解1.5.1 分析1.5.2 程序实现 1.6 问题二1.7 问题二的分析与求解1.7.1 分析1.7.2 程序实现 2. 伪指令 dd2.1 什么是dd?2.2 问题三2.3 问…

模型的评估指标——IoU、混淆矩阵、Precision、Recall、P-R曲线、F1-score、mAP、AP、AUC-ROC

文章目录 预测框的预测指标——IoU(交并比)分类预测指标混淆矩阵(Confusion Matrix,TP、FP、FN、TN)Precision(精度)Recall(召回率)P-R曲线F1-scoreTPR、TNR、FPR、FNRROC曲线下面积…

轻量云服务器:入门级云计算的最佳选择

在云计算领域,轻量云服务器逐渐成为小型企业、个人开发者和初创公司关注的热点。它凭借高性价比、简单易用和稳定性能,正在改变传统的服务器部署方式。本文将详细解析轻量云服务器的定义、优势、适用场景及如何选择最佳方案,帮助您全面了解这…

【初阶数据结构篇】归并排序、计数排序

文章目录 须知 💬 欢迎讨论:如果你在学习过程中有任何问题或想法,欢迎在评论区留言,我们一起交流学习。你的支持是我继续创作的动力! 👍 点赞、收藏与分享:觉得这篇文章对你有帮助吗&#xff1…

移远通信5G RedCap模组RG255C-CN通过中国电信5G Inside终端生态认证

近日,移远通信5G RedCap模组RG255C-CN荣获中国电信颁发的5G Inside终端生态认证证书。这表明,该产品在5G基本性能、网络兼容性、安全特性等方面已经过严格评测且表现优异,将进一步加速推动5G行业终端规模化应用。 中国电信5G Inside终端生态认…

Towards Reasoning in Large Language Models: A Survey

文章目录 题目摘要引言什么是推理?走向大型语言模型中的推理测量大型语言模型中的推理发现与启示反思、讨论和未来方向 为什么要推理?结论题目 大型语言模型中的推理:一项调查 论文地址:https://arxiv.org/abs/2212.10403 项目地址: https://github.com/jeffhj/LM-reason…

Android Studio | 修改镜像地址为阿里云镜像地址,启动App

在项目文件的目录下的 settings.gradle.kts 中修改配置,配置中包含插件和依赖项 pluginManagement {repositories {maven { urluri ("https://www.jitpack.io")}maven { urluri ("https://maven.aliyun.com/repository/releases")}maven { urlu…

Python | Leetcode Python题解之第564题数组嵌套

题目&#xff1a; 题解&#xff1a; class Solution:def arrayNesting(self, nums: List[int]) -> int:ans, n 0, len(nums)for i in range(n):cnt 0while nums[i] < n:num nums[i]nums[i] ni numcnt 1ans max(ans, cnt)return ans

2024-11-17 -MATLAB三维绘图简单实例

1. x -1:0.05:1; y x; [X, Y] meshgrid(x, y); f (X, Y) (sin(pi * X) .* sin(pi * Y)) .^ 2.*sin(2.*X2.*Y); mesh(X, Y, f(X, Y)); % 调用函数f并传递X和Y xlabel(X-axis); ylabel(Y-axis); zlabel(Z-axis); title(Surface Plot of (sin(pi * X) .* sin(pi * Y)) .^ 2.*…

网络层9——虚拟专用网VPN和网络地址转换NAT

目录 一、为什么有虚拟专用网&#xff1f; 二、如何理解“虚拟专用网”&#xff1f; 三、IP隧道技术实现虚拟专用网 四、网络地址变换 一、为什么有虚拟专用网&#xff1f; 第一&#xff0c;IPv4只有32位&#xff0c;最多有40亿个全球唯一的IP地址数量不够&#xff0c;无法…

小程序如何完成订阅

小程序如何完成订阅 参考相关文档实践问题处理授权弹窗不再触发引导用户重新授权 参考相关文档 微信小程序实现订阅消息推送的实现步骤 发送订阅消息 小程序订阅消息&#xff08;用户通过弹窗订阅&#xff09;开发指南 实践 我们需要先选这一个模板&#xff0c;具体流程参考…