当前位置: 首页 > news >正文

JS原型与原型链

JS原型与原型链

JavaScript中一切引用类型都是对象,对象就是属性的集合。

Array类型Function类型、Object类型Date类型RegExp类型等都是引用类型。

原型是什么 总计一句话就是(继承里的父亲,你可以使用你的原型里的函数

在JavaScript中,原型(Prototype)是一个非常重要的概念,它允许对象之间共享方法和属性。在JavaScript中,几乎所有的对象都是通过构造器(Constructor)函数创建的,而这些构造器函数都有一个特殊的属性,叫做prototype。这个prototype属性是一个对象,它包含了可以由通过该构造器函数创建的所有实例对象共享的方法和属性。总结一下构造函数用来创建对象,同一构造函数创建的对象,其原型相同。

当你通过一个构造器函数创建一个新对象时,这个新对象内部会包含一个指向构造器函数的prototype属性的链接(在ES6之前,这个链接通常是通过__proto__属性来访问的,尽管__proto__并不是一个标准属性,而是一个内部属性在大多数环境中的实现方式;从ES6开始,建议使用Object.getPrototypeOf()Object.setPrototypeOf()来访问和设置这个链接)。

这个机制允许你定义一些通用的方法和属性在构造器的prototype上,然后这些方法和属性就可以被所有通过该构造器创建的对象所共享。这是JavaScript实现继承的一种机制,尽管它与其他面向对象编程语言中的继承概念有所不同。

举个例子

function Person(name, age) {  this.name = name;  this.age = age;  
}  // 在Person的prototype上添加一个方法  
Person.prototype.greet = function() {  console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);  
};  // 创建Person的实例  
var person1 = new Person('Alice', 30);  
var person2 = new Person('Bob', 25);  // 使用共享在prototype上的方法  
person1.greet(); // 输出: Hello, my name is Alice and I am 30 years old.  
person2.greet(); // 输出: Hello, my name is Bob and I am 25 years old.  // 注意:name和age属性不是共享的,每个实例都有自己的name和age属性

原型链:

当访问一个对象的属性时,先在对象的本身找,找不到就去对象的原型上找,如果还是找不到,就去对象的原型(原型也是对象,也有它自己的原型)的原型上找,如此继续,直到找到为止,或者查找到最顶层的原型对象中也没有找到,就结束查找,返回undefined这条由对象及其原型组成的链就叫做原型链。

1. 原型存在的意义就是组成原型链
2. 原型链存在的意义就是继承
3. 只要是引用类型都有`__proto__`属性,指向其原型。
4. 只有函数有prototype属性,指向原型对象。

static 关键字定义了静态方法或字段或静态初始化块。静态属性不能在类的实例上直接访问。相反,它们是在类本身上被访问的

在JavaScript中,在函数上直接添加属性或方法。这些属性和方法不会通过原型链继承给实例,而是直接绑定在构造函数上。

function phone(){
}
phone.name = '111';//这里的name添加到构造函数phone上了,他并不会传递给xiaoki
let xiaoki = new phone();//这里的phone就是构造函数
xiaoki.name //这是错误的,无法调用。
xiaoki.constructor.name // 这样可以调用,但是不推荐。phone.prototype.name = '111'// 这里的name添加到原型上了,他会传递给xiaoki
let xiaoki = new phone();//这里的phone就是构造函数
xiaoki.name //可以调用

相关文章:

JS原型与原型链

JS原型与原型链 JavaScript中一切引用类型都是对象,对象就是属性的集合。 Array类型、Function类型、Object类型、Date类型、RegExp类型等都是引用类型。 原型是什么 总计一句话就是(继承里的父亲,你可以使用你的原型里的函数)…...

Python编程学习第一篇——Python零基础快速入门(六)(4)异常处理

我们已经了解了Python的基本数据类型、变量和基本的逻辑控制语句,基于这些基础知识可以编写一些小程序了,但是在写程序的时候我们会发现,有时候程序并不是按我们预期的方向执行,有的直接报错,有的没有报错,…...

GraphHopper-map-navi_路径规划、导航(web前端页面版)

文章目录 一、项目地址二、踩坑环境三、问题记录3.1、graphhopper中地图问题3.1.1. getOpacity不存在的问题3.1.2. dispatchEvent不存在的问题3.1.3. vectorLayer.set(background-maplibre-layer, true)不存在set方法3.1.4. maplibre-gl.js.map不存在的问题3.1.5. Uncaught Ref…...

2-46 基于matlab的声音信号的短时能量、短时过零率、端点检测

基于matlab的声音信号的短时能量、短时过零率、端点检测。通过计算计算短时能量、调整能量门限,然后开始端点检测。输出可视化结果。程序已调通,可直接运行。 2-46 短时能量 短时过零率 端点检测 - 小红书 (xiaohongshu.com)...

力扣630.课程表 II

力扣630.课程表 II 反悔堆 将课程按照结束时间从大到小排序每次取一个判断当前是否能学完该课程如果能学完就将持续时间加入堆 更新答案如果学不完就判断该课程持续时间是否比之前学过的最大的还大 用时更短的话就将旧的弹出 class Solution {public:int scheduleCourse(ve…...

数字IC后端流程简述

1. 设计输入 目标:接收前端设计(如RTL代码和约束文件)的输出。 工具:前端设计工具(如Synopsys Design Compiler或Cadence Genus)。 步骤: 确保前端设计的RTL代码经过综合并生成了门级网表(Netlist)。 收集约束文件(Constraints),如时序约束(SDC文件)、功率约束等…...

数学建模--整数规划和非线性规划

目录 整数规划 非线性规划 总结 整数规划中分支定界法的具体步骤和实现细节是什么? 初始化: 分支: 定界: 剪枝: 终止条件: 非线性规划中的梯度法、牛顿法和拟牛顿法的比较分析有哪些?…...

Linux-查看dd命令进度

查看dd命令进度 一、概述1. 在一个终端执行拷贝任务2. 在另一终端执行进度命令 一、概述 系统:Ubuntu 22.04 在使用 dd 命令做拷贝大量数据的时候,因为并没有输出,所以比较难判断当前进度,因此可以使用下面的命令作为进度查看 …...

高效微调 100 多种大语言模型:先计算法,急速推理!

hiyouga/LLaMA-Factoryhttps://github.com/hiyouga/LLaMA-Factory Stars: 26.9k License: Apache-2.0 LLaMA-Factory 是一个用于高效微调 100 多个大型语言模型(ACL 2024)的 WebUI。 多种模型:LLaMA、LLaVA、Mistral、Mixtral-MoE、Qwen、Y…...

opencv grabCut前景后景分割去除背景

参考: https://zhuanlan.zhihu.com/p/523954762 https://docs.opencv.org/3.4/d8/d83/tutorial_py_grabcut.html 环境本次: python 3.10 提取前景: 1、需要先把前景物体框出来 需要坐标信息,可以用windows自带的画图简单提取像素…...

qt--电子相册

一、项目要求 设计一个电子相册&#xff0c;点击上一张&#xff0c;切换到上一张图片&#xff0c;点击下一张&#xff0c;切换到下一张图片。 要求&#xff1a;图片的展示可以循环&#xff08;QList<QString>&#xff09; 要求&#xff1a;界面美观 二、项目代码 本质是通…...

【MSP430】MSP430F5529几个定时器

MSP430F5529共有四个定时器&#xff0c;其中三个是Timer_A定时器&#xff0c;一个是Timer_B定时器。 这些定时器在MSP430F5529微控制器中发挥着重要的作用&#xff0c;不仅支持多重捕获/比较、PWM输出和内部定时功能&#xff0c;还具有丰富的中断处理能力。这些特性使得MSP430…...

苍穹外卖(一)之环境搭建篇

Ngnix启动一闪而退 启动之前需要确保ngnix.exe的目录中没有中文字体&#xff0c;在conf目录下的nginx.conf文件查看ngnix的端口号&#xff0c;一般默认为80&#xff0c;若80端口被占用就会出现闪退现象。我们可以通过logs/error.log查看错误信息&#xff0c;错误信息如下&…...

【限免】16PAM、16PSK、16QAM、16CQAM星座图及误码率【附MATLAB代码】

​微信公众号&#xff1a;智能电磁频谱算法 QQ交流群&#xff1a;949444104 主要内容 MATLAB代码 % Parameters M 16; N 4; % Number of circles for CQAM SNR_dB 0:2:25; % Extended SNR range to reach higher values num_symbols 1e5; % Total number of symbols for s…...

09-软件易用性

易用性是用户体验的一个重要方面&#xff0c;网站建设者一般会沉溺于自己的思维习惯&#xff0c;而造成用户使用的不畅。易用性不仅是专业UI/UE人员需要研究&#xff0c;对于网站建设其他岗位的人也应该了解一定的方法去检验和提升网站的易用性。通常对易用性有如下定义: 易理解…...

FPGA开发——独立仿真和联合仿真

一、概述 我们在进行FPGA开发的过程之中&#xff0c;大部分情况下都是在进行仿真&#xff0c;从而验证代码实现结果的正确与否&#xff0c;这里我们引入了独立仿真和联合仿真进行一个简单介绍。 联合仿真&#xff1a;一般我们在进行仿真之前需要在相应的软件中建立相应的工程…...

基于STM32瑞士军刀--【FreeRTOS开发】学习笔记(二)|| 堆 / 栈

堆和栈 1. 堆 堆就是空闲的一块内存&#xff0c;可以通过malloc申请一小块内存&#xff0c;用完之后使用再free释放回去。管理堆需要用到链表操作。 比如需要分配100字节&#xff0c;实际所占108字节&#xff0c;因为为了方便后期的free&#xff0c;这一小块需要有个头部记录…...

ABAP+从SAP发出去的PDF文件在第三方系统出现乱码

这是一个 ABAP转换PDF调用函数CALL FUNCTION CONVERT_OTF的问题记录&#xff0c;关乎字体STSong-Light-ldentity-H 和 STSong-Light的区别 背景&#xff1a; 做了一个增强&#xff0c;是采购订单审批后自动发送采购订单PDF1到企业微信&#xff0c;用户再将企业微信收到的P…...

基于springsecurity的会话并发处理功能(附代码)

1. 需求 在项目中往往需要实现一个限制不同设备同时登录的功能&#xff0c;比如我只允许同一时间只有一个客户端能登录&#xff0c;而其他的已登陆的客户端会被挤出来 而springsecurity中恰好就帮我们实现好了对应的接口功能&#xff0c;我们只需要自定义配置就好 2. 结合sp…...

Redis底层数据结构的实现

文章目录 1、Redis数据结构1.1 动态字符串1.2 intset1.3 Dict1.4 ZipList1.5 ZipList的连锁更新问题1.6 QuickList1.7 SkipList1.8 RedisObject 2、五种数据类型2.1 String2.2 List2.3 Set2.4 ZSET2.5 Hash 1、Redis数据结构 1.1 动态字符串 Redis中保存的Key是字符串&#xf…...

Lombok 的 @Data 注解失效,未生成 getter/setter 方法引发的HTTP 406 错误

HTTP 状态码 406 (Not Acceptable) 和 500 (Internal Server Error) 是两类完全不同的错误&#xff0c;它们的含义、原因和解决方法都有显著区别。以下是详细对比&#xff1a; 1. HTTP 406 (Not Acceptable) 含义&#xff1a; 客户端请求的内容类型与服务器支持的内容类型不匹…...

爬虫基础学习day2

# 爬虫设计领域 工商&#xff1a;企查查、天眼查短视频&#xff1a;抖音、快手、西瓜 ---> 飞瓜电商&#xff1a;京东、淘宝、聚美优品、亚马逊 ---> 分析店铺经营决策标题、排名航空&#xff1a;抓取所有航空公司价格 ---> 去哪儿自媒体&#xff1a;采集自媒体数据进…...

中医有效性探讨

文章目录 西医是如何发展到以生物化学为药理基础的现代医学&#xff1f;传统医学奠基期&#xff08;远古 - 17 世纪&#xff09;近代医学转型期&#xff08;17 世纪 - 19 世纪末&#xff09;​现代医学成熟期&#xff08;20世纪至今&#xff09; 中医的源远流长和一脉相承远古至…...

Golang——7、包与接口详解

包与接口详解 1、Golang包详解1.1、Golang中包的定义和介绍1.2、Golang包管理工具go mod1.3、Golang中自定义包1.4、Golang中使用第三包1.5、init函数 2、接口详解2.1、接口的定义2.2、空接口2.3、类型断言2.4、结构体值接收者和指针接收者实现接口的区别2.5、一个结构体实现多…...

elementUI点击浏览table所选行数据查看文档

项目场景&#xff1a; table按照要求特定的数据变成按钮可以点击 解决方案&#xff1a; <el-table-columnprop"mlname"label"名称"align"center"width"180"><template slot-scope"scope"><el-buttonv-if&qu…...

xmind转换为markdown

文章目录 解锁思维导图新姿势&#xff1a;将XMind转为结构化Markdown 一、认识Xmind结构二、核心转换流程详解1.解压XMind文件&#xff08;ZIP处理&#xff09;2.解析JSON数据结构3&#xff1a;递归转换树形结构4&#xff1a;Markdown层级生成逻辑 三、完整代码 解锁思维导图新…...

Neko虚拟浏览器远程协作方案:Docker+内网穿透技术部署实践

前言&#xff1a;本文将向开发者介绍一款创新性协作工具——Neko虚拟浏览器。在数字化协作场景中&#xff0c;跨地域的团队常需面对实时共享屏幕、协同编辑文档等需求。通过本指南&#xff0c;你将掌握在Ubuntu系统中使用容器化技术部署该工具的具体方案&#xff0c;并结合内网…...

深入浅出WebGL:在浏览器中解锁3D世界的魔法钥匙

WebGL&#xff1a;在浏览器中解锁3D世界的魔法钥匙 引言&#xff1a;网页的边界正在消失 在数字化浪潮的推动下&#xff0c;网页早已不再是静态信息的展示窗口。如今&#xff0c;我们可以在浏览器中体验逼真的3D游戏、交互式数据可视化、虚拟实验室&#xff0c;甚至沉浸式的V…...

在Zenodo下载文件 用到googlecolab googledrive

方法&#xff1a;Figshare/Zenodo上的数据/文件下载不下来&#xff1f;尝试利用Google Colab &#xff1a;https://zhuanlan.zhihu.com/p/1898503078782674027 参考&#xff1a; 通过Colab&谷歌云下载Figshare数据&#xff0c;超级实用&#xff01;&#xff01;&#xff0…...

动态规划-1035.不相交的线-力扣(LeetCode)

一、题目解析 光看题目要求和例图&#xff0c;感觉这题好麻烦&#xff0c;直线不能相交啊&#xff0c;每个数字只属于一条连线啊等等&#xff0c;但我们结合题目所给的信息和例图的内容&#xff0c;这不就是最长公共子序列吗&#xff1f;&#xff0c;我们把最长公共子序列连线起…...