【笔记】原型和原型链(持续完善)

概念

  1. 原型:函数都具有 prototype 属性,称之为原型,也称之为原型对象
    1.1 原型可以放一些属性和方法,共享给实例对象使用(也就是原生方法)。
    1.2 原型可以做继承
  2. 原型链:对象都有 __proto__ 属性,这个属性指向它的原型对象,原型对象也是对象,也有 __proto__ 属性,指向原型对象的原型对象,这样的链式结构称为原型链,最顶层找不到则返回 null.
  • 显式原型(prototype)是每个函数都有的一个属性,它指向一个对象,该对象包含可以由该函数的实例共享的属性和方法。当我们创建一个函数时,JavaScript 会自动为该函数创建一个 prototype 对象,并将其赋值给函数的 prototype 属性。
  • 隐式原型(__proto__)是每个对象都有的一个属性,它指向该对象的构造函数的原型对象。当我们创建一个对象时,JavaScript 会自动为该对象创建一个 __proto__ 属性,并将其指向创建该对象的构造函数的 prototype 属性。

区别

  1. prototype 是函数对象特有的属性,而 __proto__ 是对象特有的属性;
  2. prototype 用于实现继承,它包含了可以由该函数的实例共享的属性和方法。而 __proto__ 用于查找原型链,它指向该对象的构造函数的原型对象;
  3. prototype 可以通过函数名访问到它(显式原型),而 __proto__ 是隐式原型,可以通过对象的实例来访问它。
// 1. 声明一个构造函数 Person
function Person(name) {this.name = name;
}// 2. 为构造函数的原型增加 sayHello 方法
Person.prototype.sayHello = function() {console.log('Hello, ' + this.name);
};// 3. person1 为构造函数 Person 的实例对象
const person1 = new Person('Alice');// 4. 实例对象的隐式原型指向构造函数的原型
console.log(person1.__proto__ === Person.prototype); // true// 5. 构造函数的原型上的构造函数指向构造函数本身
console.log(Person.prototype.constructor === Person); // trueperson1.sayHello(); // 输出:Hello, Alice
  • 由 5 可得:在这里插入图片描述

  • 原型链:
    在这里插入图片描述

第一个是 fun 是实例对象 proto 等价于 [[prototype]],
第二个是 [[prototype]] 的 proto 是 Person 这个对象(注意不是函数/类)他的另一个身份是函数)
第三个是 Person 的 proto 是 Object,是由 Object.create 或 {} 或 new Object() 产生的

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

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

相关文章

Qt 4.8.6 的下载与安装

Qt 4.8.6 的下载与安装 Qt 4.8.6 的下载与安装下载并解压 MinGW 4.8.2Qt4.8.6 库的安装Qt Creator 3.3.0 的安装配置 Qt Creator测试 Qt 4.8.6 的下载与安装 学习《Qt Creator快速入门》(第3版),书里面要用 Qt:phonon,这个组件要…

CentOS7 安装Jenkins 2.414.3 详细教程

目录 1、前提条件硬件软件-java11安装 2、安装jenkins3、启动jenkins配置用户和用户组配置JAVA_HOME 4、配置Jenkins一直处于启动状态5、测试Jenkins是否可以访问以及配置6、访问Jenkins系统 1、前提条件 硬件 内存 4G ; 硬盘 20G 软件-java11安装 上传文件jdk-11.0.21_lin…

Vue+OpenLayers 创建地图并显示鼠标所在经纬度

1、效果 2、创建地图 本文用的是高德地图 页面 <div class"map" id"map"></div><div id"mouse-position" class"position_coordinate"></div>初始化地图 var gaodeLayer new TileLayer({title: "高德地…

Perl语言用多线程爬取商品信息并做可视化处理

首先&#xff0c;我们需要使用Perl的LWP::UserAgent模块来发送HTTP请求。然后&#xff0c;我们可以使用HTML::TreeBuilder模块来解析HTML文档。在这个例子中&#xff0c;我们将使用BeautifulSoup模块来解析HTML文档。 #!/usr/bin/perl use strict; use warnings; use LWP::User…

基于Fuzzing和ChatGPT结合的AI自动化测试实践分享

一、前言 有赞目前&#xff0c;结合insight接口自动化平台、horizons用例管理平台、引流回放平台、页面比对工具、数据工厂等&#xff0c;在研发全流程中&#xff0c;已经沉淀了对应的质量保障的实践经验&#xff0c;并在逐渐的进化中。 在AI能力大幅进步的背景下&#xff0c…

Maven 从入门到精通

目录 一. 前言 二. Maven 下载与安装 2.1. 下载 2.2. 安装 三. Maven 核心概念 3.1. POM 3.2. 约定的目录结构 3.3. 坐标 3.4. 依赖管理 3.4.1. 直接依赖和间接依赖 3.4.2. 依赖的排除 3.4.3. 统一的版本管理 3.4.4. 依赖范围 3.5. 仓库 3.6. 生命周期/插件/目标…

vue3怎么获取el-form的元素节点

在元素中使用ref设置名称 在ts中通过从element-plus引入formInstance,设置formRef同名名称字段来获取el-form节点

HackTheBox-Starting Point--Tier 1---Funnel

文章目录 一 题目二 实验过程三 利用SSH隧道3.1 本地端口转发 一 题目 Tags FTP、PostgreSQL、Reconnaissance、Tunneling、Password Spraying、Port Forwarding、Anonymous/Guest Access、Clear Text Credentials译文&#xff1a;FTP、PostgreSQL、侦察、隧道技术、密码喷洒…

AD9371 官方例程 NO-OS 主函数 headless 梳理(一)

AD9371 系列快速入口 AD9371ZCU102 移植到 ZCU106 &#xff1a; AD9371 官方例程构建及单音信号收发 ad9371_tx_jesd -->util_ad9371_xcvr接口映射&#xff1a; AD9371 官方例程之 tx_jesd 与 xcvr接口映射 AD9371 官方例程 时钟间的关系与生成 &#xff1a; AD9371 官方…

RPA处理重复工作,助力高效资金管理

在瞬息万变的市场竞争中&#xff0c;众多企业开展多元化经营以获取最大的经济效益。然而&#xff0c;企业的多元化经营程度越高&#xff0c;协调活动可能造成的决策延误也越多&#xff0c;其资金管理往往将面临更大的考验。随着新技术的发展&#xff0c;更多具备多元产业的企业…

【蓝桥杯选拔赛真题15】C++三个数排序 第十二届青少年组蓝桥杯C++选拔赛真题解析

目录 C/C++排序 一、题目要求 1、编程实现 2、输入输出 二、算法分析

【Redis】Redis与SSM整合Redis注解式缓存Redis解决缓存问题

一&#xff0c;Redis与ssm整合 1.1 pom.xml配置 在pom.xml中配置相关的redis文件 redis文件&#xff1a; <redis.version>2.9.0</redis.version> <redis.spring.version>1.7.1.RELEASE</redis.spring.version><dependency><groupId>red…

DAIR-V2X-V 3D检测数据集 转为Kitti格式 | 可视化

本文分享在DAIR-V2X-V数据集中&#xff0c;将标签转为Kitti格式&#xff0c;并可视化3D检测效果。 一、将标签转为Kitti格式 DAIR-V2X包括不同类型的数据集&#xff1a; DAIR-V2X-IDAIR-V2X-VDAIR-V2X-CV2X-Seq-SPDV2X-Seq-TFDDAIR-V2X-C-Example: google_drive_linkV2X-Seq-…

10-27 maven概念

maven maven的概念模型: 项目对象模型(POM: Project object Model)&#xff0c;一组标准集合: pom.xml 依赖管理系统(Dependency Management System) 项目生命周期(Project Lifecycle) 项目对象模型&#xff1a; 把项目当成一个对象&#xff0c;描述这个项目&#xff0c;使用p…

sql注入学习笔记

sql注入原理 掌握sql注入漏洞的原理掌握sql注入漏洞的分类 万能用户名 777 or 11 #原句 select userid from cms_users where username ".$username." and password".md5 ( $password ) ."输入过后为 select userid from cms_users where username …

Nginx网关配置

安装Nginx 下载最新版本Nginx nginx: download 解压 双击nginx.exe启动 浏览器访问 localhost 看到如下界面 微服务准备 准备两个服务&#xff0c;例如&#xff1a;product微服务和order微服务 分别启动后&#xff0c;访问相应服务接口 product服务 http://localhost:9001/…

【Codeforces】Codeforces Round 905 (Div. 3)

Problem - 1883C - Codeforces 这题当时想复杂了。 题目大意&#xff1a; 给一串数组和一个数字k&#xff0c;求对数组进行多少次操作能是他们的乘积是k的倍数。 操作是选定一个数加上1。 这题需要抓住一个点k属于[2,5]&#xff0c;2&#xff0c;3&#xff0c;4&#xff0c;5中…

将对象与返回的数据所对应的键相同时一一赋值

问题描述 对象与返回的数据直接赋值&#xff0c;会将多余的键与值也添加上 那么赋值时值要 目标对象的键所对应的值 解决方案&#xff1a; 利用双重遍历 来比对 当 键相同时再赋值 duiYingFuZhi(obj,data){for (let key in obj) {for (let index in data) {if (keyindex) {obj…

开发知识点-Pygame

Pygame Pygame最小开发框架与最小游戏游戏开发入门单元开篇 Pygame简介安装游戏开发入门语言开发工具的选择 Pygame最小开发框架与最小游戏 游戏开发入门单元开篇 Pygame简介安装 游戏开发入门语言开发工具的选择

C语言C位出道心法(三):共用体|枚举

C语言C位出道心法(一):基础语法 C语言C位出道心法(二):结构体|结构体指针|链表 一: C语言共用体数据类型认知 二:C语言枚举基本数据类型认知 忙着去耍帅,后期补充完整.............