23-JavaScript原型、原型链、特点

news/2024/10/17 20:34:14/

文章目录

  • 一、原型
  • 二、原型链
  • 三、总结
  • 总结


一、原型

提示:这里可以添加本文要记录的大概内容:

🥙JS 常被描述为一种基于原型的语言-每个对象拥有一个原型对象。访问一个对象的属性时,在该对象上查找,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到匹配的或到达原型链的末尾。

准确的来讲,这些属性和方法定义在Object的构造器函数之上的 prototype 属性上,而非实例对象本身。


例如

函数可以有属性。每个函数都有一个特殊的属性叫做原型 prototype

function doSomething(){}
console.log(doSomething.prototype);

控制台输出

{
constructor:f doSomething(),
__proto__:{constructor:f Object(),hasOwnProperty:f hasOwnProperty(),isPrototypeOf:f isPrototypeOf(),toLocaleString:f toLocaleString(),toString:f toString(),valueOf:f valueOf()}
}

上面的对象,称之为原型对象。自有属性 constructor,指向该函数,

在这里插入图片描述

二、原型链

原型对象也可能拥有原型,并从中继承方法和属性,层层类推。这种关系被称为原型链(prototype chain),它解释了 一个对象会拥有定义在其他对象中的属性和方法

在对象实例和它的构造器之间建立一个链接( 它是 __proto__属性,是从构造函数的 prototype 属性派生的),之后通过上溯原型链,在构造器中找到属性和方法。

例子:

function Person(name){this.name = name;this.age = 18;this.sayName = function(){console.log(this.name);}
}
var person = new Person('李四')

关系图:

在这里插入图片描述
分析:

  • 构造函数Person存在原型对象Person.prototype
  • 构造函数生成实例对象 person,person 的 __proto__指向构造函数 Person原型对象
  • Person.prototype.proto 指向内置对象,因为 Person.prototype 是个对象,默认是由 Object函数作为类创建的,而 Object.prototype 为内置对象。
  • Person.proto 指向内置匿名函数 anonymous,因为Person是个函数对象,默认由 Function作为类创建
  • Function.prototype 和 Function.proto 同时指向内置匿名函数 anonymous,这样原型链的终点 就是 null

三、总结

🥪__proto__ 作为不同对象之间的桥梁,用来指向创建他的构造函数的原型对象

在这里插入图片描述
每个对象的__proto__都是指向它的构造函数的原型对象prototype的

person1.__proto__ === Person.prototype

构造函数是一个函数对象,是通过 Function 构造器产生的

Person.__proto__ === Function.prototype

原型对象本身是一个普通对象,而普通对象的构造函数都是 Object

Person.prototype.__proto__ === Object.prototype

所有的构造器都是函数对象,函数对象都是Function 构造产生的

Object.__proto__ === Function.prototype

Object 的原型对象也有 proto 属性指向 null,null是原型链的顶端

Object.prototype.__proto__ === null

总结

  • 一切对象都是继承自 Object 对象, Object对象直接继承根源对象null
  • 一切的函数对象(包括 Object对象) ,都是继承自 Function 对象
  • Object 对象直接继承自 Function 对象
  • Function 对象的 proto 会指向自己的原型对象,最终还是继承自Object 对象。

http://www.ppmy.cn/news/589318.html

相关文章

keil5-调试

1、首先选择使用调试器 2、点击debug进入调试窗口。首先会跳到main函数。 3、点击debug进入调试窗口。首先会跳到main函数。 4、可以打断点(单击左键),然后点击 run,就会执行到断点处。 5、->{} 是执行到光标所在位置。 6、…

【Tomcat】MAC下IDEA使用Tomcat部署Spring项目

一、参考资料 idea如何配置tomcat_k55的博客-CSDN博客_idea配置tomcat Tomcat部署javaweb项目的步骤_酷飞飞的博客-CSDN博客_tomcat部署java项目 Mac的Tomcat配置(含Eclipse、IDEA)_duck不必啊啊的博客-CSDN博客_idea mac tomcat Mac下brew安装Tomca…

Keil 5 安装教程

安装步骤: 1、选中软件压缩包,鼠标右击选择解压到Keil5。 2、双击打开解压文件夹中的MDK511文件夹。 3、双击打开mdk511。 4、点击Next。 5、勾选I accept,然后点击Next。 6、分别点击Core与Pack后面的Browse更改安装路径,建…

KEIL5安装与使用。

1、KEIL5安装与使用 1.1 KEIL5软件获取 Keil官网下载地址:https://www.keil.com/download/product/ 1.2 KEIL5软件安装 双击安装包&#x

opencv findContours()轮廓特征分析大全(求面积、周长、几何矩、质心、凸包、最小外接矩形、最小外接三角形、最小外接椭圆等)

文章目录 前言一、效果二、opencv对应函数介绍1.轮廓面积2.轮廓周长3.轮廓几何矩4.轮廓的最大外接矩形5.轮廓的凸包6.轮廓的最小外接矩形7.轮廓的最小外接三角形8.轮廓的最小外接椭圆9.轮廓的多边形逼近10.轮廓的最小外接圆 三、完整代码 前言 二值化轮廓发现之后,…

Keil 5安装激活教程

Keil 5安装激活教程 听语音 |浏览:10426|更新:2018-01-23 15:53 1 2 3 4 5 6 7 分步阅读 Keil 5安装激活教程 工具/原料 电脑 方法/步骤 首先打开keill安装包,双击文件,安装软件 根据提示,单击“Next”…

基于三菱PLC的饮料售货机控制系统设计

目 录 摘要 I Abstract II 1 绪论 1 1.1研究背景及意义 1 1.2自动售货机的简介 1 1.2.1自动售货机的发展历史 1 1.2.2自动售货机的定义 2 1.2.3自动售货机的组成以及分类 3 1.3自动售货机的研究现状 4 1.4课题研究内容 9 1.4.1 自动售货机的功能要求 9 1.4.2研究内容及方法 10…

柔索离散模型 Bushing衬套力 Simulink仿真

柔索离散模型 Simulink仿真 柔索建模方法Bushing模型Simulink仿真模型仿真源文件 柔索建模方法 目前针对柔索建模方法主要有以下几种: 有限元法:先建立柔索刚体模型,然后用有限元分析软件(如ANSYS)对刚体模型进行柔化,把处理后的…