JS原型链

JavaScript|深入了解JS原型链 原型prototype 每个函数都有一个prototype属性,它默认指向一个object空对象(没有我们定义的属性),即称为原型对象。这里一般讨论构造函数。 其中Objecty也是有原型对象的。 当函数通过构造函数形式调用时,它所创建的对象都有一个隐含的属性:指向构造函数的原型对象,我们可以通过 __proto__ 来访问该属性。 原型对象中还有一个contructor属性,它指向函数对象。 构造函数、实例和原型对象在内存中的关系图1: 图1对应的伪代码如下: function Myclass(){ 阅读详情

1)什么是原型链?

原型链的核心就是依赖对象的_proto_的指向,当自身不存在的属性时,就一层层的扒出创建对象的构造函数,直至到Object时,就没有_proto_指向了。

2)如何分析原型链?

因为_proto_实质找的是prototype,所以我们只要找这个链条上的构造函数的prototype。其中Object.prototype是没有_proto_属性的,它==null。

3)最简单的原型链分析

    function Person(name){
            this.name = name;
     }
     var p = new Person();
     //p ---> Person.prototype --->Object.prototype---->null

属性搜索原则:
1.当访问一个对象的成员的时候,会现在自身找有没有,如果找到直接使用。
2.如果没有找到,则去原型链指向的对象的构造函数的prototype中找,找到直接使用,没找到就返回undifined或报错。

在这里插入图片描述prototype:

prototype属性,它是函数所独有的,它是从一个函数指向一个对象。它的含义是函数的原型对象,也就是这个函数(其实所有函数都可以作为构造函数)所创建的实例的原型对象; 这个属性是一个指针,指向一个对象,这个对象的用途就是包含所有实例共享的属性和方法(我们把这个对象叫做原型对象);

proto:

proto 是原型链查询中实际用到的,它总是指向 prototype,换句话说就是指向构造函数的原型对象,它是对象独有的。注意,为什么Foo构造也有这个属性呢,因为再js的宇宙里万物皆对象,包括函数;

根据以上的概括我们能知道Foo构造函数_proto_指向的是他的构造函数的原型对象,它的构造函数是Function, 也就是说Foo的_proto_指向Function.prototype, 我们再看到左边绿色的a和b函数的_proto_指像的是Foo.prototype,因为他们是通过 new Foo实例化出来的,它们的构造函数就是Foo(), 即a.proto = Foo.prototype; 接着我们来看看最右边紫色的模块Function.prororype, 它的_proto_指针指向的是Object.prototype,Object._proto_又为null.。于是我们就可以得出:在原型链中的指向是,函数 → 构造行数 → Function.prototype → Object.protype → null ;

结论:

1、proto 是原型链查询中实际用到的,它总是指向 prototype;

2、prototype 是函数所独有的,在定义构造函数时自动创建,它总是被 proto 所指。

所有对象都有__proto__属性,函数这个特殊对象除了具有__proto__属性,还有特有的原型属性prototype。prototype对象默认有两个属性,constructor属性和__proto__属性。prototype属性可以给函数和对象添加可共享(继承)的方法、属性,而__proto__是查找某函数或对象的原型链方式。constructor,这个属性包含了一个指针,指回原构造函数。

js原型链污染 JavaScript 原型链是实现继承的一种方式,每个对象都有一个内部属性(在代码中可通过__proto__访问),它指向该对象的原型对象。当访问一个对象的属性或方法时,JavaScript 首先会在该对象本身查找,如果找不到,就会沿着原型链向上查找,直到找到该属性或方法,或者到达原型链的末尾(传统的面向对象(例如java),采用类的形式,以类为模版创建对象JavaScript 是基于原型链实现继承和封装。 阅读详情

相关推荐

OpenHarmony 5.1 RK3568 开发板烧录:从源码编译到镜像写入的 6 步实战

本文详细解析了OpenHarmony 5.1在RK3568开发板上的全链路开发流程,包括环境搭建、源码编译、镜像烧录等6个关键步骤。通过实战指南和避坑技巧,帮助开发者快速掌握OpenHarmony系统的烧录与定制能力,提升物联网设备开发效率。

weixin_33722405的博客 343

浅析js中的原型和原型链

通过本篇文章,我们通俗地讲解了JS中的原型和原型链,重点理解了__proto__和prototype的相等关系,以及原型链的层次结构。通过共享属性和方法,节省内存,并且动态扩展实例对象的功能。掌握这些基础知识后,你将更容易理解JS的继承机制和构造函数的实现原理。如果你对本文的解释有任何疑问或建议,欢迎在评论区讨论,最后附上一张神图。

sasa66697的博客 1025

TI电量计BQ40Z50R2循环学习实战:从量产文件生成到关键标志位解析

本文详细解析了TI电量计BQ40Z50R2的循环学习实战流程,从量产文件生成到关键标志位解析。通过实战案例和易错分析,帮助工程师避开常见陷阱,提升电量计配置效率。重点介绍了循环学习前的准备工作、量产文件生成步骤及关键标志位的深度解读,适用于电池管理系统开发人员。

weixin_30505225的博客 439

详解js原型链

面试题 Object.prototype.test1 = function () { console.log('test1'); }; Function.prototype.test2 = function () { console.log('test2'); }; function Fun() { this.a = 1; } var obj = new Fun(); console.log(obj.test

brokenkay的博客 1566

ubuntu18.04 显卡驱动问题 造成屏幕分辨变大 NVIDIA-SMI has failed because it couldn't communicate with ....等问题

问题1:装好了显卡驱动,cudnn,tensorflow等没问题,一直可以用。但是突然有一天不行了,终端输入:nvidia-smi 显示:NVIDIA-SMI has failed because it couldn't communicate with the NVIDIA driver. Make sure that the latest NVIDIA driver is installed...

梦萦飞--CV/DL/ML 2248

DRAM知识整理系列(三):部分时序参数整理

一、tCL-tRCD-tRP-tRAS(第一时序) 内存是根据行和列寻址的,当请求触发后,最初是tRAS(Active to precharge Delay),预充电后,内存才真正开始初始化RAS(Row Address Strobe)。一旦tRAS激活后,RAS开始进行需要数据的寻址。首先是行地址,然后初始化tRCD(RAS to CAS Delay),周期结束,接着通过CAS(Column Address Strobe)访问所需数据的十六进制地址。其中,从CAS开始到CAS结束,就是CAS延迟(即t

不吃鱼的猫的博客 7万+

原型、原型链那点儿事儿

一、Object和Function的关系: 刚学JavaScript的时候,看书上说JavaScript中万物皆对象,而javascript中的其他对象都是从Object继承而来,包括内置对象。瞬间觉得Object碉堡了! 后来,又认识了Function,才知道原来Function才是隐藏在幕后的大BOSS,Object只不过是个大师兄。 从上面可以发现,Function.__proto__ =......

EmotionComputer 217

MCSDK5.4.8电机库双电阻采样适配:从扇区判断到固定采样的重构实践

本文详细解析了MCSDK5.4.8电机库中双电阻采样技术的重构实践,从扇区判断到固定采样的关键步骤。通过硬件配置优化、核心文件重构及电流读取函数改造,实现高效稳定的电机控制,特别适用于成本敏感型项目。文章还提供了占空比限制计算、参数调整及常见问题排查等实用技巧,助力工程师快速掌握两电阻采样方法。

weixin_42532938的博客 279

详解原型与原型链

详解原型与原型链 其实,刚开始学JavaScript时,就有学过原型与原型链的相关知识了,只是当时还没有养成写笔记的习惯,导致现在已经忘的七七八八了。 这边文章真是花了很多心思,写了两天,看了很多篇篇博文,其中有小参考的,有解决一点疑惑的,但是最后只标注了一篇帮助最大的。 构造函数 实例的构造函数属性(constructor)指向其构造函数 function Person(name) { this.name = name } const person = new Person('clz') cons

赤蓝紫の博客 5068

SAP 经营范围(Operating Concern) 和业务范围 (Business Area) 在核算架构或是管理架构中的区别和联系分别是什么 请给具体的示例

摘要:SAP系统中,业务范围(Business Area)和经营范围(Operating Concern)在核算架构中具有不同功能。业务范围是FI/CO共用维度,用于跨公司码的业务线核算(如电子产品、机械设备),支持内部管理和简单对外报表。经营范围则是CO-PA专属维度,聚焦获利能力分析,可细化到产品+客户+区域组合(如分析手机在华东区域的获利情况)。两者存在层级关联:经营范围包含业务范围作为基础维度,业务范围数据会传递至经营范围进行深度分析。实际应用中需先配置业务范围,再设置经营范围并关联相关维度,共同支

金牌架构师 94

YOLOv8改进 | 主干网络 | 将主干网络替换为轻量化的ShuffleNetv2【原理 + 完整代码】

yolov8,yolov8创新,yolov8改进

kay_545 2563

JS高级---原型链(一看就懂,但18岁以下请绕道)

1)小明是小明妈生的,小狗是小狗妈生的。小明和小狗都是对象实例,而小明妈和小狗妈就是原型。原型也是对象,叫原型对象。      2)小明妈和小明爸啪啪啪能生出一堆小明明、小狗妈和小狗爸啪啪啪能生出一堆小狗狗,啪啪啪就是构造函数,俗称造人或造狗。      3)小明妈会记录啪啪啪的信息,所以可以通过小明妈找到啪啪啪的信息,也就是说能通过原型对象找到构造函数。     4)小明妈可以生很多宝宝,

一个前端小学生的博客 2万+

Hermes Agent 安装部署完全指南

Hermes Agent安装部署指南提供了两种安装方式:一键脚本安装和手动分步安装。该AI助手支持多平台运行(Linux/macOS/WSL2),核心功能仅需Git作为前置依赖,其他依赖如Python、Node.js等均由安装脚本自动处理。文档详细介绍了系统要求、依赖管理、配置目录结构、环境变量设置以及10个手动安装步骤,并提供了功能模块化选项,用户可根据需求选择安装语音交互、浏览器自动化等扩展功能。安装完成后可通过hermes doctor命令验证环境,并通过交互式向导完成初始化配置。

简简单单Onlinezuozuo 2618

【JavaScript】一文了解JS原型与原型链

浅解JavaScript中原型与原型链的概念及其应用

ztK63LrD的博客 1261

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

霍尼韦尔SoftMaster使用说明

霍尼韦尔SoftMaster使用说明

彻底弄懂javaScript中的原型、原型链(手绘js原型链图)

原型和原型链都是来源于对象而服务于对象的概念,所以我们要先明确一点:JavaScript中一切引用类型都是对象,对象就是属性的集合。、、、、等都是引用类型。也就是说 数组是对象、函数是对象、正则是对象、对象还是对象。 二、原型和原型链是什么 上面我们说到对象就是属性(property)的集合,有人可能要问不是还有方法吗?其实方法也是一种属性,因为它也是的表现形式,具体见下图。可以看到上确实多了一个的属性,值为一个函数,但是问题来了,上面并没有这个方法,为什么我们可以调用呢?这就引出了 原型。每一

懒散小青年的博客 1700

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

Javascript原型链详解,一文带你彻底搞懂js原型、原型对象及原型链

原型链是 JavaScript 中的一个重要特性,它是实现对象之间继承关系的机制。在 JavaScript 中,每个对象都有一个原型属性,指向另一个对象。当试图访问一个对象的属性或方法时,如果该对象本身没有这个属性或方法,JavaScript 引擎会沿着原型链向上查找,直到找到对应的属性或方法为止。

greatming666的博客 2110

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

「JavaScript深入」彻底搞懂JS原型与原型链

「JavaScript深入」彻底搞懂JS原型与原型链:原因、使用class实现继承、原型、原型链、prototype和proto

XH_jing的博客 1612

【JS】理解 JavaScript 的原型与原型链

在 JavaScript 中,每个函数都有一个prototype属性,这个属性指向一个对象,这个对象就是该函数的原型对象。原型对象可以包含属性和方法,这些属性和方法可以被该函数创建的所有实例对象所共享。// 输出:Hello, my name is Alice// 输出:Hello, my name is Bob在上面的例子中,Person函数的prototype属性指向一个原型对象,该原型对象包含一个sayHello方法。person1和person2都是Person。

2301_78802081的博客 1254

js javascript 原型链详解

看了许多大神的博文,才少许明白了js 中原型链的概念,下面给大家浅谈一下,顺便也是为了巩固自己 首先看原型链之前先来了解一下new关键字的作用,在许多高级语言中,new是必不可少的关键字,其作用是为了产生一个类的实例对象,然后利用对象来进行操作,当然,在js身上也有高级语言的一些影子,它也配套了new的关键字下面看一下代码 //声明一个类 function Person(name){ th

小辣抓 569

【JS】JavaScript 中的原型与原型链

JavaScript中的原型(prototype)和原型链(prototype chain)是面向对象编程中的重要概念,用于实现对象之间的继承和属性访问。

Eliaukoyx 1099

JavaScript之彻底理解原型与原型链_js contructor

知识的海洋往往比想象中还要辽阔,原型与原型链这边也反复的学过多次,我认为应该学的比较全面,比较完善了。但遇到这个面试题后,我才发现我所学的只不过是一根枝干,JS里面真的有很多深层次的宝藏等待挖掘。学海无涯,与君共勉。本文部分图源:渡一教育的学习资料。

2401_87288988的博客 663

JavaScript原型和原型链

JavaScript 的核心机制原型和原型链是实现面向对象继承的关键。每个对象(除 null 外)都有一个原型对象作为模板,通过 __proto__ 属性访问,而函数对象特有的 prototype 属性指向其实例的原型。原型链由对象通过 __proto__ 连接形成,属性查找会沿链向上直至 Object.prototype(终点为 null)。通过将子类原型指向父类实例(而非直接共享父类原型)可实现继承,避免污染父类。原型链机制使 JavaScript 无需类也能实现继承,是理解面向对象编程的基础。

students33的博客 1454

JavaScript什么是原型和原型链JS

从事前端这么久,发现原型和原型链一直都是云里雾里,网上看了好多文章、博客也还是不怎么明朗,相信被它困扰的小伙伴,不在少数 以下是我总结的原型和原型链,个人认为是比较浅显易懂的: 一、首先大家在对JS原型进行解释的时候,会涉及两个概念:构造函数、原型对象 构造函数:通俗的一句话说,就是你在script标签里面声明的函数: function Person(params) { /**我就是构造函数*/ } 原型对象:当我们创建了一个函数A,浏览器就会在内存中创建一个对象B

Liberty_yes的博客 732

javascript之js原型-原型链总结

目录前言:铺垫函数创建对象创建原型链__proto__protoype 参考blog:https://segmentfault.com/a/1190000014849332 前言: 先前Niao(说的就是我啦)一直从事着js学习研究,当时我是跟着廖老师的es系列教程走的。打算在毕业前搞个小东东,迫于时间问题。教程仅仅过了个大概。之前买的js进阶书籍就一直凉着。为了完全吃透js。niao也是下定决心...

404

JS Raccoon:掌握JavaScript原型链与继承的完整教程

JS Raccoon是一个专注于Web开发技巧的开源项目,提供了丰富的JavaScript编程指南。本教程将帮助你彻底理解JavaScript中独特的原型链与继承机制,这是掌握面向对象编程的核心基础。 ## 为什么原型链是JavaScript开发者的必备知识? JavaScript作为一门灵活的脚本语言,其对象模型与传统的类式继承语言有本质区别。理解原型链不仅能帮助你写出更优雅的代码,还能让你

gitblog_00071的博客 617

JS中修改原型链继承

学习JS的继承需要对JS的原型链有一定了解: https://blog.youkuaiyun.com/PrisonersDilemma/article/details/89318495 之前学习了原型链,这里对原型链的继承总结一下。 文章目录 functionAnimal(){ this.name="this animal"; } Animal.prototype.eat= function (f...

PrisonersDilemma的博客 1412
上一篇: JS运动(向左,向右及停止)
下一篇: 数组的内置方法
javascript_meng
博客等级 码龄7年 5粉丝 13原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值