原型与原型链

news2024/10/6 22:28:52

 一、原型:prototype

1.什么是原型?

javascript常被描述为一种基于原型的语言(每个对象都拥有一个原型对象)

当访问一个对象的属性时,它不仅在该对象上寻找,还会寻找该对象的原型,以及该对象原型的原型,层层向上,直到找到或者到达原型链的末尾

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

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

// 控制台输出

/* {
    constructor: ƒ Fn(),
    __proto__: {
        constructor: ƒ Object(),
        hasOwnProperty: ƒ hasOwnProperty(),
        isPrototypeOf: ƒ isPrototypeOf(),
        propertyIsEnumerable: ƒ propertyIsEnumerable(),
        toLocaleString: ƒ toLocaleString(),
        toString: ƒ toString(),
        valueOf: ƒ valueOf()
    }
}
*/

上面的这个对象,就是大家常说的原型对象

可以看到,原型对象有一个自有属性constructor,这个属性指向该函数,如下图关系展示

2.函数的prototype属性

每个函数都有一个prototype属性,它默认指向一个Object对象(即为:原型对象)

原型对象中有一个属性constructor,它指向函数对象

3.给原型对象添加属性(一般都是方法)

作用:函数的所有实例对象自动拥有原型中的属性 

4.原型对象有一个属性constructor,它指向函数对象

二、显示原型与隐式原型

1.每个函数function都有一个prototype,即显示原型(属性)

2.每个实例对象都有一个_proto_,可称为隐式原型(属性)

3.对象的隐式原型的值为其对应构造函数的显示原型的值

4.内存结构

//定义构造函数
Function Fn(){  //内部语句:this.prototype={}

}
//每个函数function都有一个prototype,即显示原型属性,默认指向一个空的Object对象
console.log(Fn.prototype)
//创建实例对象
//每个实例对象都有一个_proto_,可称为隐式原型
var fn=new Fn()//内部语句:this._proto_===Fn.prototype
console.log(fn._proto_)
//对象的隐式原型的值为其对应构造函数的显示原型的值
console.loG(fn._proto_===Fn.prototype)
//给原型添加方法
Fn.prototype.test=function(){
   console.log('test()')
}
//通过实例调用原型的方法
fn.test()

5.总结:

函数的prototype属性:在定义函数时自动添加的,默认值是一个空Object对象

对象的_proto_属性:创建对象时自动添加的,默认值为构造函数的prototype属性值

程序员能直接操作显示原型,但不能直接操作隐式原型(ES6之前)

三、原型链

1.原型链的概念

原型对象也可能拥有原型,并从中继承方法和属性,一层一层,依次类推。这种关系就形成了原型链(这也就是为何一个对象会拥有定义在其他对象中的属性和方法)

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

2.原型链:访问一个对象的属性时

(1)先在自身属性中查找,找到返回

(2) 如果没有,则再沿着_proto_这条链向上查找,找到返回

(3) 如果最终没有找到,返回undefined

别名:隐式原型链

作用:查找对象的属性(方法)

function Fn(){
   this.test1=function(){
     console.log('test1()')
   }
}
Fn.prototype.test2=function(){
   console.log('test2()')
}
var fn=new Fn()
fn.test1()
fn.test2()
console.log(fn.toString())

3.构造函数/原型/实例对象的关系

(1) 函数的显示原型指向的对象默认是空的Object对象(但Object不满足) 

(2)所有的函数都是Function的实例(包含Function)

(3)Object的原型对象是原型链尽头 

(4)实例对象的隐式原型等于构造函数的显示原型属性,任何函数都是new Function产生的

小结:

function Person(name) {
    this.name = name
    this.age = 20
    this.sayName = function() {
        console.log(this.name)
    }
}
//	创建实例
let person = new Person('CSDN')

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

(2)每个对象的__proto__都是指向它的构造函数的原型对象的prototype

person1.__proto__ === Person.prototype

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

Person.__proto__===Function.prototype

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

Person.prototype.__proto===Object.prototype

(5)刚刚上面说了,所有的构造器都是函数对象,函数对象都是Function构造产生的

Object.__proto===Function.prototype

(6)Object的原型对象也有__proto__属性指向null,null是原型链的顶端

Object.prototype.__proto__ === null

tip:

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

4.原型继承:

(1)构造函数的实例对象自动拥有构造函数原型对象的属性

(2) 利用的就是原型链、

5.原型属性问题

(1)读取对象的属性值时,会自动到原型链中查找

(2)设置对象的属性值时,不会查找原型链,如果当前对象中没有此属性,直接添加此属性并设置其值

(3)方法一般定义在原型中属性一般通过构造函数定义在对象本身

6.探索instanceof

(1)instanceof是如何判断的?

   表达式:B  instanceof  A

   如果A函数的显示原型对象在B对象的原型链上,返回trur,否则返回false

(2)Function是通过new自己产生的实例

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

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

相关文章

【Java】人工智能交互智慧导诊系统源码

随着人工智能技术的快速发展,语音识别与自然语言理解技术的成熟应用,基于人工智能的智慧导诊导医逐渐出现在患者的生活视角中,智能导诊系统应用到医院就医场景中,为患者提供导诊、信息查询等服务,符合智慧医院建设的需…

Java利用反射和读取xml实现迷你容器

由于需要框架能实现多态,达到控制反转解耦。所以容器还是需要的,容器的存在可以简化对象获取工作,但是容器也不是万能的。合理使用即可,Spring对我来说太庞大了,用不着,为此给框架写一个迷你版容器。 容器…

Netty的高性能基石ByteBuf

前言 ​ NIO中缓冲区是数据传输的基础,JDK通过ByteBuffer实现,Netty框架中并未采用JDK原生的ByteBuffer,而是构造了ByteBuf。 ​ Netty中的ByteBuf对ByteBuffer做了大量的优化,比如说内存池,零拷贝,引用计数&#xf…

QFileDialog 文件对话框

文章目录 1、简介2、公共类型3、属性4、functions1、访问属性相关 function2、静态公共成员1、 通过对话框获取用户选择的文件路径:QFileDialog::getOpenFileName2、 通过对话框获取用户选择的文件夹路径:QFileDialog::getExistingDirectory 3、Public F…

家庭资产配置

不同家庭的资产配置 理财就是理人生 为人生的每件事,准备好相应的钱 生存的事 生活费 假设我们今年30岁,则至60岁期间所需的日常生活开支为: 4000元/月X 12月X30年144万 养老的事 养老费 吃饭居住娱乐其他开销60至80岁期间所需的养老…

用Wokwi仿真ESP-IDF项目

陈拓 2023/10/21-2023/10/21 1. 概述 Wokwi是一个在线的电子电路仿真器。你可以使用它来仿真Arduino、ESP32、STM32和许多其他流行的电路板、元器件以及传感器,免去使用开发板。 Wokwi提供基于浏览器的界面,您可以通过这种简单直观的方式快速开发一个…

农产品农货经营小程序商城的作用是什么

农产品行业涵盖的产品很多,以小麦、稻子、玉米、高粱等为主,还有粮油、果蔬、畜牧等产品。 自建技术团队,耗时耗力,培养成本较高,销售渠道单一、等客上门、产品无法高效宣传及促进用户购买,营销力不足&…

会声会影2023官方破解版激活码

随着短视频、vlog等媒体形式的兴起,视频剪辑已经成为了热门技能。甚至有人说,不会修图可以,但不能不会剪视频。实际上,随着各种智能软件的发展,视频剪辑已经变得越来越简单。功能最全的2023新版,全新视差转…

JavaWeb学生管理系统(详细源码+解析)

​ 很多人大学的第一个小项目就是使用JavaWeb实现了一个学生管理系统或者是图书管理系统。在没有项目经验的情况下,前后端都需要自己去完成,还是要耗费不少时间精力的。本次我就分享一下我在大学期间完成的第一个小项目:学生管理系统。采用的…

2023年【司钻(钻井)】及司钻(钻井)作业模拟考试

题库来源:安全生产模拟考试一点通公众号小程序 司钻(钻井)是安全生产模拟考试一点通生成的,司钻(钻井)证模拟考试题库是根据司钻(钻井)最新版教材汇编出司钻(钻井&#…

Tuxera NTFS2023破解版苹果电脑磁盘读写工具

当您获得一台新 Mac 时,它只能读取 Windows NTFS 格式的 USB 驱动器。要将文件添加、保存或写入您的 Mac,您需要一个附加的 NTFS 驱动程序。Tuxera 的 Microsoft NTFS for Mac 是一款易于使用的软件,可以在 Mac 上打开、编辑、复制、移动或删…

性能优化:JIT即时编译与AOT提前编译

优质博文:IT-BLOG-CN 一、简介 JIT与AOT的区别: 两种不同的编译方式,主要区别在于是否处于运行时进行编译。 JIT:Just-in-time动态(即时)编译,边运行边编译:在程序运行时,根据算法计算出热点代码&#xf…

CVE-2019-1388 UAC提权实战

1.查看用户权限:guest来宾权限 2.右键-以管理员身份运行: 3.这个时候会弹出UAC,不用管它,点击:显示详细信息 4.然后点击蓝色字体:显示有关此发布者的证书信息 5.来到证书信息这里,点击颁发着…

线程是如何在 6 种状态之间转换的?

Java全能学习面试指南:https://javaxiaobear.cn 今天我们主要学习线程是如何在 6 种状态之间转换的。 线程的 6 种状态 就像生物从出生到长大、最终死亡的过程一样,线程也有自己的生命周期,在 Java 中线程的生命周期中一共有 6 种状态。 …

揭开 Amazon Bedrock 的神秘面纱 | 基础篇

在 2023 年 4 月,亚马逊云科技曾宣布将 Amazon Bedrock 纳入使用生成式人工智能进行构建的新工具集。Amazon Bedrock 是一项完全托管的服务,提供各种来自领先 AI 公司(包括 AI21 Labs、Anthropic、Cohere、Stability AI 和 Amazon 等&#xf…

Python学习第一天-安装Python

文章目录 前言一、下载Python二、执行安装程序三、命令行验证总结 前言 以下榜单来自于TIOBE编程语言流行指数 不多说了,Python天下第一 一、下载Python 从官网下载Python安装程序 二、执行安装程序 找到python-3.12.0-amd64.exe执行,选择Install …

基于Python3的Scapy构造DNS报文

一:DNS协议 DNS(Domain Name System)协议是计算机网络中的一种基础协议,它用于将域名(如www.baidu.com)转换为IP地址(如192.168.0.1),从而实现计算机之间的通信。 DNS 分…

【Unity地编细节】为什么Unity笔刷在地形上面刷不出来

👨‍💻个人主页:元宇宙-秩沅 hallo 欢迎 点赞👍 收藏⭐ 留言📝 加关注✅! 本文由 秩沅 原创 😶‍🌫️收录于专栏:unity细节和bug 😶‍🌫️优质专栏 ⭐【…

【编解码】解码字符串中的 UNICODE 字符

前言 由于前后端交互中编码的问题,出现了这样的一串字符: {"share_names":["\u4e2d\u6587\u8def\u5f84"]}出现了unicode编码作为字符串内容的情况,直接用json解析的话会报错,所以在json解析前需要先进行转码…

Linux | 深入浅出冯诺依曼

前言 但凡是科班出生的小伙伴多多稍稍应该都听过冯诺依曼体系吧,这似乎已成为入门计算机的必备知识了,本章就带着大家一起去理解冯诺依曼体系; 一、体系构成 冯诺依曼体系主张计算机由五大部件组成,如下所示; 输入设备…