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

【JS 原型链】

JavaScript 原型链是一个重要的概念,它是 JavaScript 语言实现面向对象编程的核心。在 JavaScript 中,每个对象都有一个与之关联的原型,并且该对象继承了原型中的属性和方法。这些原型组成了一个原型链,可以通过该链追溯到顶层的 Object.prototype。

JavaScript 中的每个对象都有一个内部属性[[Prototype]],指向它的原型对象。如果该对象无法在自己的属性中找到一个属性或方法,它将查找与其关联的原型对象中的属性或方法。如果还是找不到,则会查找原型对象的原型,直到找到 Object.prototype,即顶层原型。这种机制被称为原型链。

例如,假设我们有这样一个对象:

let obj = {name: "Tom",age: 20
};

我们可以通过 Object.getPrototypeOf(obj) 来获取 obj 对象的原型,输出结果如下:

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

可以看到,obj 对象的原型是 Object.prototype。如果我们访问 obj.toString() 方法,由于 obj 对象本身没有该方法,JavaScript 将会在原型链上查找该方法,找到 Object.prototype 上的 toString() 方法并执行。从而,实现了对 obj.toString() 方法的调用。

在 JavaScript 中,我们可以通过构造函数创建对象的实例。例如:

function Person(name) {this.name = name;
}
let p = new Person("Tom");

在这个例子中,我们首先定义了一个名为 Person 的构造函数,它有一个参数 name,用于接收人名。在实例化一个 Person 对象时,我们通过 new 操作符调用了该构造函数,并传递了一个参数 “Tom”。在这个过程中,JavaScript 会自动为新创建的对象设置一个原型,即 Person.prototype。我们可以通过 Object.getPrototypeOf§ 或 p.proto 访问该对象的原型。

当我们在实例 p 上访问属性时,如果 p 对象本身没有该属性,则会通过原型链查找该属性。例如,如果我们在 p 对象上访问 p.toString() 方法,由于 p 对象本身没有该方法,JavaScript 将会在原型链上查找该方法,找到 Person.prototype 上的 toString() 方法并执行。如果 Person.prototype 上也没有该方法,则会在原型链的上一级继续查找,即 Object.prototype 上查找该方法。如果还是找不到,则会返回 undefined。

在 JavaScript 中,我们可以通过给对象的原型对象添加属性和方法来实现继承。例如:

function Animal() {}
Animal.prototype.walk = function() {console.log("Animal is walking");
};
function Dog() {}
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.bark = function() {console.log("Dog is barking");
};
let d = new Dog();

在这个例子中,我们首先定义了一个名为 Animal 的构造函数,并在其原型对象上添加了一个 walk() 方法。然后,我们定义了一个名为 Dog 的构造函数,它通过 Object.create() 方法继承了 Animal.prototype,并在其原型对象上添加了一个 bark() 方法。最后,我们通过 new 操作符创建了一个 Dog 的实例 d。

在实例 d 上访问 walk() 和 bark() 方法时,如果 d 对象本身没有该方法,则会通过原型链查找该方法。如果在 Dog.prototype 和 Animal.prototype 上都找不到该方法,则会在 Object.prototype 上查找,如果还是找不到,则会返回 undefined。

总之,JavaScript 中的原型链是一个非常重要的概念,它是 JavaScript 实现面向对象编程的核心机制。通过构造函数和原型对象,我们可以轻松地创建对象的实例,并实现对象的继承。

相关文章:

【JS 原型链】

JavaScript 原型链是一个重要的概念,它是 JavaScript 语言实现面向对象编程的核心。在 JavaScript 中,每个对象都有一个与之关联的原型,并且该对象继承了原型中的属性和方法。这些原型组成了一个原型链,可以通过该链追溯到顶层的 …...

harmonyOS 开发之UI开发(ArkTS声明式开发范式)概述

UI开发(ArkTS声明式开发范式)概述 基于ArkTS的声明式开发范式的方舟开发框架是一套开发极简、高性能、支持跨设备的UI开发框架,提供了构建OpenHarmony应用UI所必需的能力,主要包括: ArkTS ArkTS是UI开发语言&#xff…...

【人工智能】神经网络、M-P_神经元模型、激活函数、神经网络结构、学习网络参数、代价定义、总代价

M-P_神经元模型、激活函数、神经网络结构、学习网络参数、代价定义 文章目录 M-P_神经元模型、激活函数、神经网络结构、学习网络参数、代价定义M-P 神经元模型激活函数(Activation function)神经网络结构举例训练神经网络学习网络参数代价定义均方误差交叉熵(Cross Entropy)…...

小程序新渲染引擎 Skyline 发布正式版

为了进一步提升小程序的渲染性能和体验,我们推出了一套新渲染引擎 Skyline,现在,跟随着基础库 3.0.0 发布 Skyline 正式版。 我们知道,小程序一直用 WebView 来渲染界面,因其有不错的兼容性和丰富的特性,且…...

网络安全作业1

URL编码 当 URL 路径或者查询参数中,带有中文或者特殊字符的时候,就需要对 URL 进行编码(采用十六进制编码格式)。URL 编码的原则是使用安全字符去表示那些不安全的字符。 安全字符,指的是没有特殊用途或者特殊意义的…...

【NLP】视觉变压器与卷积神经网络

一、说明 本篇是 变压器因其计算效率和可扩展性而成为NLP的首选模型。在计算机视觉中,卷积神经网络(CNN)架构仍然占主导地位,但一些研究人员已经尝试将CNN与自我注意相结合。作者尝试将标准变压器直接应用于图像,发现在…...

【redis】通过配置文件简述redis的rdb和aof

redis的持久化方式有2种,rdb,即通过快照的方式将全量数据以二进制记录在磁盘中,aof,仅追加文件,将增量的写命令追加在aof文件中。在恢复的时候,rdb要更快,但是会丢失一部分数据。aof丢失数据极少…...

Cypress 上传 pdf 变空白页问题

在使用cypress 上传文件时,上传正常,但是,pdf一直空白的,翻边了资料也没找到原因。最后在一个不起眼的地方发现了问题所在。 错误的代码: cy.fixture(CBKS.pdf).as(uploadFile)cy.get(.el-upload-dragger).selectFile…...

【ArcGIS Pro二次开发】(52):布局导出图片(批量)

在ArcGIS Pro中设定好布局后,可以直接导出为各种类型的图片。 这是很基本的功能,但是如果你的布局很多,一张一张导图就有点费劲。 之前有网友提出希望可以批量导图,要实现起来并不难,于是就做了这个工具。 一、要实现…...

Git拉取远程分支并创建本地分支

一、查看远程分支 使用如下git命令查看所有远程分支: git branch -r 查看远程和本地所有分支: git branch -a 查看本地分支: git branch 在输出结果中,前面带* 的是当前分支。 二、拉取远程分支并创建本地分支 方法一 使用…...

OSI七层模型——物理层

OSI模型的物理层位于协议栈的底部。它是 TCP/IP 模型的网络接入层的一部分。如果没有物理层,就没有网络。本模块详细介绍了连接到物理层的三种方法。 1 物理层的用途 1.1 物理连接 不管是在家连接本地打印机还是将其连接到另一国家/地区的网站上,在进…...

【NLP】使用变压器(tranformer)和自动编码器

一、说明 自然语言处理 (NLP)中,trnsformer和编码器是至关重要的概念;本篇不是探讨原理,而是讲现实中,如何调用和使用transformer以及encoder,注意。本文中有时出现“变压器”,那是transormer的同义词,在此事先声明。 二、NLP及其重要性的简要概述 NLP是人工…...

广州华锐互动:水利数字孪生智能管理系统的特色

水利数字孪生智能管理系统是一种基于数字孪生的新型水利管理工具,它通过将现实世界中的水利设施和设备数字化,并在虚拟环境中进行模拟和分析,为水利管理者提供更加直观、精准的决策支持。该系统具有以下亮点: 首先,水利…...

php使用chatGPT生成一些东西做一个记录

好久没写了,这么长时间都去坐一些自己感兴趣的事情去了。 之前使用chatgpt-3,效果一直不咋好,这里我们来说说各个版本区别 gpt-3收费成本可以接受,生成的内容对话有点不太聪明的样子 git-3.5-turbo收费相对来说低,生成文本质量…...

轻量级Web报表工具ActiveReportsJS全新发布v4.0,支持集成更多前端框架!

ActiveReportsJS 是一款基于 JavaScript 和 HTML5 的轻量级Web报表工具,采用拖拽式设计模式,不需任何服务器和组件支持,即可在 Mac、Linux 和 Windows 操作系统中,设计多种类型的报表。ActiveReportsJS 同时提供跨平台报表设计、纯…...

听GPT 讲K8s源代码--pkg(七)

k8s项目中 pkg/kubelet/config,pkg/kubelet/configmap,pkg/kubelet/container,pkg/kubelet/cri 这几个目录处理与 kubelet 配置、ConfigMap、容器管理和容器运行时交互相关的功能。它们共同构成了 kubelet 的核心功能,使其能够在 …...

STM32MP157驱动开发——按键驱动(线程化处理)

文章目录 “线程化处理”机制:内核函数线程化处理方式的按键驱动程序(stm32mp157)编程思路button_test.cgpio_key_drv.cMakefile修改设备树文件编译测试 “线程化处理”机制: 工作队列是在内核的线程的上下文中执行的 工作队列中有多个 work&#xff0…...

探究HTTP代理爬虫的反爬虫策略

在当前信息爆炸的时代,海量的数据成为了企业发展和决策的关键资源。然而,越来越多的网站为了保护数据和用户隐私的安全,采取了各种反爬虫策略。作为一家专业的HTTP代理产品供应商,我们一直在研究和优化反爬虫策略,为用…...

短视频去水印小程序,一键部署你的小程序,可开流量主,实现睡后收入

插件地址 短视频去水印小程序,一键部署你的小程序,可开流量主,实现睡后收入 插件说明 本插件包含以下两部分: 短视频去水印插件,仅为一个接口,可以集成到自己的任意程序中。短视频去水印插件配套小程序…...

通讯录系统

目录 通讯录系统头文件&#xff1a; 通讯录系统Test&#xff1a; 通讯录系统函数源代码&#xff1a; 通讯录系统头文件&#xff1a; #define _CRT_SECURE_NO_WARNINGS 1 #include <stdio.h> #include <stdlib.h> #include <string.h> #include <assert…...

UE5 学习系列(二)用户操作界面及介绍

这篇博客是 UE5 学习系列博客的第二篇&#xff0c;在第一篇的基础上展开这篇内容。博客参考的 B 站视频资料和第一篇的链接如下&#xff1a; 【Note】&#xff1a;如果你已经完成安装等操作&#xff0c;可以只执行第一篇博客中 2. 新建一个空白游戏项目 章节操作&#xff0c;重…...

web vue 项目 Docker化部署

Web 项目 Docker 化部署详细教程 目录 Web 项目 Docker 化部署概述Dockerfile 详解 构建阶段生产阶段 构建和运行 Docker 镜像 1. Web 项目 Docker 化部署概述 Docker 化部署的主要步骤分为以下几个阶段&#xff1a; 构建阶段&#xff08;Build Stage&#xff09;&#xff1a…...

【杂谈】-递归进化:人工智能的自我改进与监管挑战

递归进化&#xff1a;人工智能的自我改进与监管挑战 文章目录 递归进化&#xff1a;人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管&#xff1f;3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...

【kafka】Golang实现分布式Masscan任务调度系统

要求&#xff1a; 输出两个程序&#xff0c;一个命令行程序&#xff08;命令行参数用flag&#xff09;和一个服务端程序。 命令行程序支持通过命令行参数配置下发IP或IP段、端口、扫描带宽&#xff0c;然后将消息推送到kafka里面。 服务端程序&#xff1a; 从kafka消费者接收…...

SciencePlots——绘制论文中的图片

文章目录 安装一、风格二、1 资源 安装 # 安装最新版 pip install githttps://github.com/garrettj403/SciencePlots.git# 安装稳定版 pip install SciencePlots一、风格 简单好用的深度学习论文绘图专用工具包–Science Plot 二、 1 资源 论文绘图神器来了&#xff1a;一行…...

day52 ResNet18 CBAM

在深度学习的旅程中&#xff0c;我们不断探索如何提升模型的性能。今天&#xff0c;我将分享我在 ResNet18 模型中插入 CBAM&#xff08;Convolutional Block Attention Module&#xff09;模块&#xff0c;并采用分阶段微调策略的实践过程。通过这个过程&#xff0c;我不仅提升…...

Java 加密常用的各种算法及其选择

在数字化时代&#xff0c;数据安全至关重要&#xff0c;Java 作为广泛应用的编程语言&#xff0c;提供了丰富的加密算法来保障数据的保密性、完整性和真实性。了解这些常用加密算法及其适用场景&#xff0c;有助于开发者在不同的业务需求中做出正确的选择。​ 一、对称加密算法…...

TRS收益互换:跨境资本流动的金融创新工具与系统化解决方案

一、TRS收益互换的本质与业务逻辑 &#xff08;一&#xff09;概念解析 TRS&#xff08;Total Return Swap&#xff09;收益互换是一种金融衍生工具&#xff0c;指交易双方约定在未来一定期限内&#xff0c;基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...

ElasticSearch搜索引擎之倒排索引及其底层算法

文章目录 一、搜索引擎1、什么是搜索引擎?2、搜索引擎的分类3、常用的搜索引擎4、搜索引擎的特点二、倒排索引1、简介2、为什么倒排索引不用B+树1.创建时间长,文件大。2.其次,树深,IO次数可怕。3.索引可能会失效。4.精准度差。三. 倒排索引四、算法1、Term Index的算法2、 …...

GitHub 趋势日报 (2025年06月08日)

&#x1f4ca; 由 TrendForge 系统生成 | &#x1f310; https://trendforge.devlive.org/ &#x1f310; 本日报中的项目描述已自动翻译为中文 &#x1f4c8; 今日获星趋势图 今日获星趋势图 884 cognee 566 dify 414 HumanSystemOptimization 414 omni-tools 321 note-gen …...