JS的魔法三角:constructor、prototype与__proto__
在JavaScript中,constructor、prototype和__proto__是与对象创建和继承机制紧密相关的三个概念。理解它们之间的关系对于掌握JavaScript的面向对象编程至关重要。下面将详细介绍这个魔法三角:
1. constructor
-
定义:
constructor是一个函数,它被用来初始化一个新创建的对象实例。当使用new关键字创建一个新的对象时,构造函数会被调用。 -
作用:主要负责为新创建的对象设置初始属性和方法。
-
示例:
function Person(name, age) {this.name = name;this.age = age; }const Kobe = new Person('Kobe', 24);
2. prototype
-
定义:每个函数都有一个
prototype属性,它是一个对象,用于存储可以被该函数的所有实例共享的方法和属性。 -
作用:通过
prototype属性,可以实现原型链继承,允许子类继承父类的属性和方法。 -
示例:
Person.prototype.greet = function() {console.log(`my name is ${this.name}.`); };const Kobe = new Person('Kobe', 24); Kobe.greet(); // "my name is kobe."
3. __proto__
-
定义:
__proto__是每个对象的一个内部属性(非标准属性),指向该对象的原型对象。在ES6中,推荐使用Object.getPrototypeOf()或Object.setPrototypeOf()来获取或设置原型。 -
作用:
__proto__是原型链的核心,当尝试访问一个对象的属性时,如果该对象本身没有这个属性,JavaScript引擎会沿着__proto__链向上查找,直到找到该属性或者到达原型链的末端(通常是null)。 -
示例:
const Kobe = new Person('Kobe', 24); console.log(Kobe.__proto__ === Person.prototype); // true
4. 关系
-
构造函数与
prototype:- 每个构造函数都有一个
prototype属性,这是一个对象,包含所有实例共享的方法和属性。 - 当使用
new关键字创建对象时,新对象的__proto__属性会被设置为构造函数的prototype对象。
- 每个构造函数都有一个
-
__proto__与原型链:__proto__属性使得对象能够访问其构造函数prototype上的方法和属性。- 通过
__proto__,可以形成一个从子对象到父对象的链式结构,即原型链。
-
constructor与prototype:prototype对象上有一个默认的constructor属性,它指向构造函数本身。- 这个
constructor属性可以帮助我们识别一个对象是由哪个构造函数创建的。
5. 图解


6. 示例代码
function Person(name, age) {this.name = name;this.age = age;
}// 在构造函数的原型上添加方法
Person.prototype.greet = function() {console.log(`my name is ${this.name}.`);
};const Kobe = new Person('Kobe', 24);// 查看Kobe的原型
console.log(Kobe.__proto__ === Person.prototype); // true// 查看Person.prototype的constructor属性
console.log(Person.prototype.constructor === Person); // true// 使用Kobe调用greet方法
Kobe.greet(); // "my name is Kobe."// 原型链
console.log(Object.getPrototypeOf(Kobe) === Person.prototype); // true
7. 总结
constructor:构造函数,用于初始化新创建的对象实例。prototype:构造函数的原型对象,用于存储可以被所有实例共享的方法和属性。__proto__:对象的内部属性,指向该对象的原型对象,用于实现原型链继承。
这就是JS的魔法三角吗?看起来并不难吧?
相关文章:
JS的魔法三角:constructor、prototype与__proto__
在JavaScript中,constructor、prototype和__proto__是与对象创建和继承机制紧密相关的三个概念。理解它们之间的关系对于掌握JavaScript的面向对象编程至关重要。下面将详细介绍这个魔法三角: 1. constructor 定义:constructor是一个函数&am…...
CA系统(file.h---申请认证的处理)
#pragma once #ifndef FILEMANAGER_H #define FILEMANAGER_H #include <string> namespace F_ile {// 读取文件,返回文件内容bool readFilename(const std::string& filePath);bool readFilePubilcpath(const std::string& filePath);bool getNameFro…...
matlab显示sin二维图
1,新建脚本 2、保存脚本 3、脚本命令:clc 清除 脚本命令的信息 clrear all 清除全部 4工作区内容:变量啥的 x0:0.001:2*pi%% 开始 精度 中值 ysin(x) y1cos(x) figure%%产生一个屏幕 plot(x,y)%%打印坐标 title(ysin(x))%%标题 xlabel(…...
验证 kubelet 服务已经停止并且不再生成错误日志
要验证 kubelet 服务已经停止并且不再生成错误日志,可以按照以下步骤进行操作: 1. 检查 kubelet 服务状态 首先,确认 kubelet 服务已经停止。 Bash 深色版本 sudo systemctl status kubelet 你应该看到类似以下的输出,表示服…...
【Linux】进程控制-----进程替换
目录 一、为什么要进行进程替换: 二、进程替换的原理: 三、exec家族: 1、execl: 2、execlp: 3、execv: 4、execvp: 5、execle和execve 编辑 putenv: 一、为什么要进行进程…...
安装SQL Server 2022提示需要Microsoft .NET Framework 4.7.2 或更高版本
安装SQL Server 2022提示需要Microsoft .NET Framework 4.7.2 或更高版本。 原因是:当前操作系统版本为Windows Server 2016 Standard版本,其自带的Microsoft .NET Framework 版本为4.6太低,不满足要求。 根据报错的提示,点击链接…...
使用ECharts创建带百分比标注的环形图
在数据可视化领域,环形图是一种非常有效的图表类型,它能够清晰地展示各部分与整体的关系。今天,我们将通过ECharts来创建一个带百分比标注的环形图,并详细解释如何实现这一效果。 1. 数据准备 首先,我们定义了一些基础…...
学习threejs,设置envMap环境贴图创建反光效果
👨⚕️ 主页: gis分享者 👨⚕️ 感谢各位大佬 点赞👍 收藏⭐ 留言📝 加关注✅! 👨⚕️ 收录于专栏:threejs gis工程师 文章目录 一、🍀前言1.1 ☘️THREE.CubeTextureLoader 立…...
go语言里的mkdir mkdirall有什么区别?
在Go语言中,os.Mkdir 和 os.MkdirAll 都是用来创建目录的函数,但它们之间存在一些关键的区别。 ### os.Mkdir - **功能**:os.Mkdir 用于创建一个单一的目录。如果该目录已经存在,则会返回一个错误。 - **参数**: - na…...
使用Python OpenCV实现图像形状检测
目录 一、环境准备 二、读取和预处理图像 读取图像 灰度化 滤波去噪 三、边缘检测 四、查找轮廓 五、绘制轮廓 六、形状分类 七、显示结果 八、完整代码示例 九、总结 图像形状检测是计算机视觉领域中的一项关键技术,广泛应用于工业自动化、机器人视觉、医学图像处…...
继上一篇,设置弹框次数以及自适应图片弹框,部分机型(vivo)老手机不显示的问题
上一篇写的本来测试好多型号都无事, 今天下午公司的战斗机vivo横空冒出… 晕 弹框直接显示都出不来了,现在还有用这种老的机型的,但是没办法咯~ 前端遇到这种兼容性的问题就要勇于解决 主要解决了这几点: // 添加图片加载事件 <imgv-if"imageUrl":src"image…...
基于RISC-V 的代理内核实验(使用ub虚拟机安装基本环境)
1.安装支撑软件 第一步,安装依赖库 RISC-V交叉编译器的执行仍然需要一些本地支撑软件包,可使用以下命令安装: $ sudo apt-get install autoconf automake autotools-dev curl libmpc-dev libmpfr-dev libgmp-dev gawk build-essential bis…...
【MMKV】HarmonyOS中的优秀轻量化存储方式
MMKV 引言 在移动应用开发的世界里,数据存储和管理是至关重要的一环。随着技术的不断进步,开发者们对于高性能、轻量级、易用的数据存储解决方案的需求日益增长。MMKV(Memory Mapped Key-Value)正是这样一个开源的高性能key-val…...
docker安装hadoop环境
一、使用docker搭建基础镜像 1、拉取centos系统镜像 # 我这里使用centos7为例子 docker pull centos:7 2、创建一个dockerfiler文件,用来构建自定义一个有ssh功能的centos镜像 # 基础镜像 FROM centos:7 # 作者 #MAINTAINER hadoop ADD Centos-7.repo /etc/yum.re…...
开源多媒体处理工具ffmpeg是什么?如何安装?使用ffmpeg将M3U8格式转换为MP4
目录 一、FFmpeg是什么二、安装FFmpeg(windows)三、将M3U8格式转换为MP4格式 一、FFmpeg是什么 FFmpeg是一款非常强大的开源多媒体处理工具,它几乎可以处理所有类型的视频、音频、字幕以及相关的元数据。 FFmpeg的主要用途包括但不限于&…...
算法刷题Day5: BM52 数组中只出现一次的两个数字
描述: 一个整型数组里除了两个数字只出现一次,其他的数字都出现了两次。请写程序找出这两个只出现一次的数字。 要求:空间复杂度 O(1),时间复杂度O(n)。 题目传送门 is here 思路: 方法一:最简单的思路就…...
55 基于单片机的方波频率可调
目录 一、主要功能 二、硬件资源 三、程序编程 四、实现现象 一、主要功能 采用STC89C52单片机最小系统,设计DAC0832、放大器、与示波器显示方波,四位数码管显示频率,两个按键可调。 二、硬件资源 基于KEIL5编写C代码,PROT…...
23.useUnload
在 Web 应用开发中,处理页面卸载(unload)事件是一个重要但常常被忽视的方面。无论是提醒用户保存未保存的更改,还是执行一些清理操作,都需要在用户即将离开页面时进行处理。useUnload 钩子提供了一种简洁的方式来在 React 组件中处理 beforeunload 事件,使得在用户试图关…...
linux环境搭建
1、**连接外网** ssh在192.168.4.x上运行sudo ip link set ens160 down ssh切换到192.168.3.x(外网ip),运行sudo ip route add default via 192.168.2.1 dev ens192 onlink //连接外网 使用完外网后 ssh在192.168.3.x上运行sudo ip link set ens160 up ssh在1…...
《C++与生物医学的智能融合:医疗变革新引擎》
在当今科技飞速发展的时代,人工智能正以前所未有的深度和广度渗透到各个领域,为传统行业带来革新与突破。其中,将 C与生物学、医学等领域知识相结合,开发用于处理生物医学数据、辅助疾病诊断和治疗的人工智能应用,成为…...
工业意识:03 组态软件怎么选?WinCC、FactoryTalk、国产一篇讲透
03 组态软件怎么选?WinCC、FactoryTalk、国产一篇讲透 前面咱们把SCADA聊成“千里眼”,MES聊成“透明玻璃房”,现在终于到最爽的部分——画面组态!简单说,就是用鼠标拖拖拽拽,在电脑上搭出那些监控大屏:仪表盘、按钮、趋势图、报警灯、3D管道……全连上PLC变量,点一下…...
从SMP到NUMA:聊聊多核CPU时代Linux内存管理是怎么‘进化’的
从SMP到NUMA:多核CPU时代的内存管理演进之路 2000年代初,当单核CPU的主频竞赛逐渐触及物理极限时,计算机架构师们面临一个关键抉择:如何在芯片上堆叠更多晶体管?答案最终指向了多核设计。但随之而来的内存访问瓶颈&…...
Gemini实时字幕在Google Meet中延迟超800ms?揭秘谷歌内部SRE监控数据与3步毫秒级调优法
更多请点击: https://intelliparadigm.com 第一章:Gemini实时字幕在Google Meet中延迟超800ms?揭秘谷歌内部SRE监控数据与3步毫秒级调优法 谷歌内部SRE团队近期公开的一组匿名化监控数据显示:在高并发(>500人&…...
十大类型学系统性阐释:自感痕迹论的发生学分类体系
十大类型学系统性阐释:自感痕迹论的发生学分类体系引言:类型学作为公理的微分展开一个完备的发生学体系,不应满足于对单一现象的孤立分类。它应当从少数基本公设出发,在不同分析层面自然衍生出互相关联又各具独立性的类型学。自感…...
HsMod终极指南:55项功能全面优化炉石传说游戏体验的完整方案
HsMod终极指南:55项功能全面优化炉石传说游戏体验的完整方案 【免费下载链接】HsMod Hearthstone Modification Based on BepInEx 项目地址: https://gitcode.com/GitHub_Trending/hs/HsMod HsMod是一款基于BepInEx框架开发的炉石传说模改插件,为…...
vue3-vant-mobile项目部署指南:Netlify零配置发布终极教程
vue3-vant-mobile项目部署指南:Netlify零配置发布终极教程 【免费下载链接】vue3-vant-mobile An mobile web apps template based on the Vue 3 ecosystem。一个基于 Vue 3 生态系统的移动 web 应用模板,帮助你快速完成业务开发。 项目地址: https://…...
Linux I2C设备驱动避坑指南:以MPU6050为例,解决i2c_transfer返回EIO错误
Linux I2C设备驱动深度排障:MPU6050的EIO错误全解析 调试嵌入式设备时,最令人沮丧的莫过于那些间歇性出现的错误。它们像幽灵一样时隐时现,让开发者陷入无尽的猜测和试错循环。MPU6050作为一款广泛使用的运动传感器,其I2C接口的稳…...
5分钟打造专业音频可视化桌面:Lano Visualizer开源工具实战指南
5分钟打造专业音频可视化桌面:Lano Visualizer开源工具实战指南 【免费下载链接】Lano-Visualizer A simple but highly configurable visualizer with rounded bars. 项目地址: https://gitcode.com/gh_mirrors/la/Lano-Visualizer 你是否曾经想过ÿ…...
macOS菜单栏终极管理指南:用Ice开源工具打造高效工作空间
macOS菜单栏终极管理指南:用Ice开源工具打造高效工作空间 【免费下载链接】Ice Powerful menu bar manager for macOS 项目地址: https://gitcode.com/GitHub_Trending/ice/Ice 在macOS生态中,菜单栏作为系统交互的核心区域,却常常因为…...
大模型入门必看:收藏这份工业大模型学习指南,小白也能轻松入门
本文介绍了工业大模型的概念、体系架构和构建方法,分析了工业大模型在制造业中的应用潜力。文章指出,工业大模型并非通用大模型在工业领域的简单应用,而是一套全新的理论与技术体系。工业大模型通过融合工业数据和机理知识,具备智…...
