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

【JS知识点】——原型和原型链

文章目录

  • 原型和原型链
    • 构造函数
    • 原型
      • 显式原型(prototype)
    • 隐式原型(\_\_proto\_\_)
    • 原型链
    • 总结

原型和原型链

在js中,原型和原型链是一个非常重要的知识点,只有理解原型和原型链,才能深刻理解JS。在这一个月的面试中,原型和原型链也是一个高频知识点,现做出如下总结。

构造函数

构造函数本身就是一个函数,只是为了与普通函数区别,其首字母一般大写,构造函数与普通函数的区别在于,使用new创建实例的函数就是构造函数,直接调用则是普通函数。

function Student(){this.name="构造函数"
}var stu=new Student()console.log(stu.name);//构造函数

原型

显式原型(prototype)

JS是一门基于原型的语言。而JS中的原型是其中十分重要的一个概念。原型本质上就是一个对象,它的存在是为了JS中的实例对象可以获取到原型中的公共属性和公共方法
每个对象都有一个显式原型对象,当我创建一个名为Student的类时,其显式原型原型如下:

  • constructor:显式原型中包含的构造函数属性,指向该显式原型的构造函数
console.log(Student,Student.prototype);//输出展示如下图

Student的原型
于是,构造函数和原型之间存在以下关系,原型相当于每一个对象实例的私有属性,即每当创建一个对象,该对象就会有一个为空的显式原型属性。
构造函数和原型之间的关系

隐式原型(__proto__)

每一个对象(除了null)都有一个属性叫做__proto__(隐式原型),通过它可以访问到该对象的构造函数的原型对象,关系如下:
加入隐式原型的关系图
从JS的数据类型可以知道,函数类型本质是也是对象,而对象的原型又是指向其构造函数的原型对象,得出如下关系:
加入Object之后

下面是一段关于原型的代码,方便大家理解:

function Person() {this.name = "构造函数";function col() {console.log('我是构造函数中的方法');};
}
Person.prototype = {name: "原型",age: "18",getNum: function () {console.log('我是构造函数中的原型', 1);}
}
var per = new Person()
console.log(per.__proto__.__proto__ == Object.prototype);// true 对象实例的隐式原型(本质就是通过Object()构造出来的实例对象)的隐式原型指向Object.prototype;
console.log(per.__proto__ == Person.prototype);// true 没有给隐式原型添加数据时,其默认指向其构造函数的显式原型
console.log(per.name, per.age,per.getNum);// 原型,18 ,getNum  可以从构造函数中获取到age和name以及getNum,这里不能直接调用,但在外可以(原因不知)// 当为实例对象per的隐式原型中添加了数据时
per.__proto__={name:"隐式原型",age:"22"
}
console.log(per.name, per.age,per.getNum); // 隐式原型,22,报错,getNum不存在
//原因,此时实例对象的__proto__指定了特定的值,不会再去其构造函数的显示原型中查找,所以找不到getNum,报错

原型链

每个对象拥有一个原型对象,通过 __proto__ 指针指向上一个原型 ,并从中继承方法和属性,同时原型对象也可能拥有原型,这样一层一层,最终指向 null。这种关系被称为原型链 (prototype chain),通过原型链一个对象会拥有定义在其他对象中的属性和方法。
最后的关系图如下:
原型链最后的关系图

总结

  • 使用new生成实例的函数就是构造函数,直接调用的就是普通函数。
  • 原型的主要作用是用来存储对象实例的公共属性和公共方法
  • 每个对象都拥有一个原型对象;每个引用类型的隐式原型都指向它的构造函数的显式原型;
  • 一个对象可以通过原型链获取其他对象的属性和方法
  • Object.prototype是所有对象的根对象,即原型链终点,其隐式原型指向Null;

相关文章:

【JS知识点】——原型和原型链

文章目录原型和原型链构造函数原型显式原型(prototype)隐式原型(\_\_proto\_\_)原型链总结原型和原型链 在js中,原型和原型链是一个非常重要的知识点,只有理解原型和原型链,才能深刻理解JS。在…...

c盘怎么清理到最干净?有什么好的清理方法

c盘怎么清理到最干净?有什么好的清理方法?清理C盘空间是电脑维护的重要步骤之一。C盘是Windows操作系统的核心部分,保存了许多重要的系统文件,因此空间不足会影响计算机的性能和稳定性。下面是一些清理C盘空间的方法 一.清理临时文件 在使用…...

day26_HTML

今日内容 上课同步视频:CuteN饕餮的个人空间_哔哩哔哩_bilibili 同步笔记沐沐霸的博客_CSDN博客-Java2301 零、 复习昨日 一、二阶段介绍 二、HTML 零、 复习昨日 见代码 一、二阶段介绍 第一阶段: 基础入门 java基本语法编程基础(方法,数组)面向对象编程常用类高级(IO,线程,新…...

深度剖析C语言预处理

致前行的人: 人生像攀登一座山,而找寻出路,却是一种学习的过程,我们应当在这过程中,学习稳定冷静,学习如何从慌乱中找到生机。 目录 1.程序翻译过程: 2.字符串宏常量 3.用宏定义充当注释符号 4…...

【WPF 值转换器】ValueConverter 进阶用法

【WPF 值转换器】ValueConverter 进阶用法介绍基类实现子类实现效果介绍 值转换器在WPF开发中是非常常见的,当然不仅仅是在WPF开发中。值转换器可以帮助我们很轻松地实现,界面数据展示的问题,如:模块隐藏显示、编码数据展示为可读…...

Vue2的基本使用

一、vue的基本使用 第一步 引入vue.js文件 <script src"https://cdn.staticfile.org/vue/2.7.0/vue.min.js"></script> 或者<script src"./js/vue.js"></script> 第二步 在body中设置一个挂载点 {{msg}} <div id"app…...

【云原生kubernetes】k8s数据存储之Volume使用详解

目录 一、什么是Volume 二、k8s中的Volume 三、k8s中常见的Volume类型 四、Volume 之 EmptyDir 4.1 EmptyDir 特点 4.2 EmptyDir 实现文件共享 4.2.1 关于busybox 4.3 操作步骤 4.3.1 创建配置模板文件yaml 4.3.2 创建Pod 4.3.3 访问nginx使其产生访问日志 4.3.4 …...

SerDes---CDR技术

1、为什么需要CDR 时钟数据恢复主要完成两个工作&#xff0c;一个是时钟恢复&#xff0c;一个是数据重定时&#xff0c;也就是数据的恢复。时钟恢复主要是从接收到的 NRZ&#xff08;非归零码&#xff09;码中将嵌入在数据中的时钟信息提取出来。 2、CDR种类 PLL-Based CDROve…...

如何实现在on ethernetPacket中自动回复NDP response消息

对于IPv4协议来说,如果主机想通过目标ipv4地址发送以太网数据帧给目的主机,需要在数据链路层填充目的mac地址。根据目标ipv4地址查找目标mac地址,这是ARP协议的工作原理 对于IPv6协议来说,根据目标ipv6地址查找目标mac地址,它使用的不是ARP协议,而是邻居发现NDP(Neighb…...

CSS清楚浮动

先看看关于浮动的一些性质 浮动使元素脱离文档流 浮动元素可以设置宽高&#xff0c;在CSS中&#xff0c;任何元素都可以浮动&#xff0c;浮动元素会生成一个块级框&#xff0c;而不论其本身是何种元素。 如果没有给浮动元素指定高度&#xff0c;&#xff0c;那么它会以内容的…...

HTTPS详解(原理、中间人攻击、CA流程)

摘要我们访问浏览器也经常可以看到https开头的网址&#xff0c;那么什么是https&#xff0c;什么是ca证书&#xff0c;认证流程怎样&#xff1f;这里一一介绍。原理https就是httpssl&#xff0c;即用http协议传输数据&#xff0c;数据用ssl/tls协议加密解密。具体流程如下图&am…...

EventLoop机制

JavaScript 是单线程的语言 JavaScript 是一门单线程执行的编程语言。也就是说&#xff0c;同一时间只能做一件事情。 单线程执行任务队列的问题&#xff1a; 如果前一个任务非常耗时&#xff0c;则后续的任务就不得不一直等待&#xff0c;从而导致程序假死的问题。 同步任…...

倒立摆建模

前言 系统由一辆具有动力的小车和安装在小车上的倒立摆组成&#xff0c;系统是不稳定&#xff0c;我们需要通过控制移动小车使得倒立摆保持平衡。 具体地&#xff0c;考虑二维情形如下图&#xff0c;控制力为水平力FFF&#xff0c;输出为角度θ\thetaθ以及小车的位置xxx。 力…...

SpringSecurity支持WebAuthn认证

WebAuthn是无密码身份验证技术&#xff0c;解决了密码泄露的风险&#xff0c;主流的浏览器都支持。有很多开源的类库实现了WebAuthn规范&#xff0c;Java下流行的类库有&#xff1a;webauthn4jjava-webauthn-serververtx-authSpring Security官方暂时未支持WebAuthn&#xff0c…...

深度学习技巧应用3-神经网络中的超参数搜索

大家好&#xff0c;我是微学AI&#xff0c;今天给大家带来深度学习技巧应用3-神经网络中的超参数搜索。 在深度学习任务中&#xff0c;一个算法模型的性能往往受到很多超参数的影响。超参数是指在模型训练之前需要我们手动设定的参数&#xff0c;例如&#xff1a;学习率、正则…...

【信号量机制及应用】

水善利万物而不争&#xff0c;处众人之所恶&#xff0c;故几于道&#x1f4a6; 目录 一、信号量机制 二、信号量的应用 >利用信号量实现进程互斥   >利用信号量实现前驱关系   >利用记录型信号量实现同步 三、例题 四、参考 一、信号量机制 信号量是操作系统提…...

围棋高手郭广昌的“假眼”棋局

&#xff08;图片来源于网络&#xff0c;侵删&#xff09;文丨熔财经作者|易不二2022年&#xff0c;在复星深陷债务压顶和变卖资产漩涡的而立之年&#xff0c;“消失”已久的郭广昌&#xff0c;在质疑与非议声中回国稳定军心&#xff0c;强调复星将在未来的五到十年迎来一个全新…...

学成教育-统一异常处理实现

一、统一异常处理实现 统一在base基础工程实现统一异常处理&#xff0c;各模块依赖了base基础工程都 可以使用。 首先在base基础工程添加需要依赖的包&#xff1a; <dependency><groupId>org.springframework</groupId><artifactId>spring-web</…...

JNI内通过参数形式从C/C++中传递string类型数据至Java层

目录 0 前言 1 string类型参数形式传值 2 测试和结果 0 前言 类似之前我写过的两篇文章&#xff1a;一篇介绍了在JNI中基础类型int的传值方式&#xff1b;一篇详细梳理了在JNI层中多维数组的多种传值方式。 JNI内两种方式从C/C中传递一维、二维、三维数组数据至Java层详细…...

自动化测试——执行javaScript脚本

文章目录一、点击元素(对应的click())二、input标签对应的值&#xff08;对应的send_keys()&#xff09;修改时间控件的属性值&#xff1a;三、元素的文本属性四、js脚本滚动操作一、点击元素(对应的click()) 使用场景&#xff1a;当使用显性等待不能解决问题时 代码中实现点击…...

应用升级/灾备测试时使用guarantee 闪回点迅速回退

1.场景 应用要升级,当升级失败时,数据库回退到升级前. 要测试系统,测试完成后,数据库要回退到测试前。 相对于RMAN恢复需要很长时间&#xff0c; 数据库闪回只需要几分钟。 2.技术实现 数据库设置 2个db_recovery参数 创建guarantee闪回点&#xff0c;不需要开启数据库闪回。…...

工业安全零事故的智能守护者:一体化AI智能安防平台

前言&#xff1a; 通过AI视觉技术&#xff0c;为船厂提供全面的安全监控解决方案&#xff0c;涵盖交通违规检测、起重机轨道安全、非法入侵检测、盗窃防范、安全规范执行监控等多个方面&#xff0c;能够实现对应负责人反馈机制&#xff0c;并最终实现数据的统计报表。提升船厂…...

从深圳崛起的“机器之眼”:赴港乐动机器人的万亿赛道赶考路

进入2025年以来&#xff0c;尽管围绕人形机器人、具身智能等机器人赛道的质疑声不断&#xff0c;但全球市场热度依然高涨&#xff0c;入局者持续增加。 以国内市场为例&#xff0c;天眼查专业版数据显示&#xff0c;截至5月底&#xff0c;我国现存在业、存续状态的机器人相关企…...

【项目实战】通过多模态+LangGraph实现PPT生成助手

PPT自动生成系统 基于LangGraph的PPT自动生成系统&#xff0c;可以将Markdown文档自动转换为PPT演示文稿。 功能特点 Markdown解析&#xff1a;自动解析Markdown文档结构PPT模板分析&#xff1a;分析PPT模板的布局和风格智能布局决策&#xff1a;匹配内容与合适的PPT布局自动…...

鱼香ros docker配置镜像报错:https://registry-1.docker.io/v2/

使用鱼香ros一件安装docker时的https://registry-1.docker.io/v2/问题 一键安装指令 wget http://fishros.com/install -O fishros && . fishros出现问题&#xff1a;docker pull 失败 网络不同&#xff0c;需要使用镜像源 按照如下步骤操作 sudo vi /etc/docker/dae…...

HDFS分布式存储 zookeeper

hadoop介绍 狭义上hadoop是指apache的一款开源软件 用java语言实现开源框架&#xff0c;允许使用简单的变成模型跨计算机对大型集群进行分布式处理&#xff08;1.海量的数据存储 2.海量数据的计算&#xff09;Hadoop核心组件 hdfs&#xff08;分布式文件存储系统&#xff09;&a…...

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习)

Aspose.PDF 限制绕过方案&#xff1a;Java 字节码技术实战分享&#xff08;仅供学习&#xff09; 一、Aspose.PDF 简介二、说明&#xff08;⚠️仅供学习与研究使用&#xff09;三、技术流程总览四、准备工作1. 下载 Jar 包2. Maven 项目依赖配置 五、字节码修改实现代码&#…...

短视频矩阵系统文案创作功能开发实践,定制化开发

在短视频行业迅猛发展的当下&#xff0c;企业和个人创作者为了扩大影响力、提升传播效果&#xff0c;纷纷采用短视频矩阵运营策略&#xff0c;同时管理多个平台、多个账号的内容发布。然而&#xff0c;频繁的文案创作需求让运营者疲于应对&#xff0c;如何高效产出高质量文案成…...

免费数学几何作图web平台

光锐软件免费数学工具&#xff0c;maths,数学制图&#xff0c;数学作图&#xff0c;几何作图&#xff0c;几何&#xff0c;AR开发,AR教育,增强现实,软件公司,XR,MR,VR,虚拟仿真,虚拟现实,混合现实,教育科技产品,职业模拟培训,高保真VR场景,结构互动课件,元宇宙http://xaglare.c…...

《Docker》架构

文章目录 架构模式单机架构应用数据分离架构应用服务器集群架构读写分离/主从分离架构冷热分离架构垂直分库架构微服务架构容器编排架构什么是容器&#xff0c;docker&#xff0c;镜像&#xff0c;k8s 架构模式 单机架构 单机架构其实就是应用服务器和单机服务器都部署在同一…...