Javascript继承(原型链)

远程桌面连接失败?手把手教你解决CredSSP加密Oracle漏洞(Win10/Win11通用) 本文详细解析了Windows远程桌面连接因CredSSP加密Oracle漏洞安全更新导致的“身份验证错误”问题。文章从原理入手,提供了通过组策略编辑器(适用于专业版)和注册表编辑器(适用于家庭版)两种核心解决方案,指导用户将安全策略调整为推荐的“缓解”模式,以在保障安全的前提下恢复连接,并给出了高级脚本处理与安全最佳实践。 阅读详情

Javascript继承(原型链)

  继承是OO语言中的一个最为人津津乐道的概念。许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。由于javascript函数没有签名,在ECMAScript中无法实现接口继承,ECMAScript只支持实现继承,而且其实现主要依靠原型链来实现的。


1.原型链
原型链是JavaScript中继承的主要方法。
每个构造函数都拥有一个原型对象,原型对象都包含一个指向构造函数的指针(constructor),实例都包含一个指向原型对象的内部指针(__proto__)。
假如,原型对象(Son.prototype)等于另一个类型(Pserson)的实例(person1),那么此时的原型对象(Son.prototype)将包含一个指向另一个原型(Person.prototype)的指针,相应的,另有一个原型(Person.prototype)中也包含着一个指向另一个构造函数(Person())的指针。
再如,另一个原型(Person.prototype)又是另一个类型(Person)的实例(person1),那么上述关系依旧成立,如此层层递进,就构成了实例与原型的链条,这就是所谓的原型链。
 ​
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
function  SuperType(){ 
     this .property= true ; 
     } 
    
SuperType.prototype.getSuperValue= function (){ 
     return  this .property; 
     } 
    
function  SubType(){ 
     this .subproperty= false ; 
     } 
        
//继承了SuperType 
SubType.prototype= new  SuperType 
(); 
    
SubType.prototype.getSubValue= function (){ 
     return  this .subproperty; 
     } 
    
var  instance= new  Son(); 
alert(instance.getSuperValue());       //true 
    
alert(instance instanceof  Object);     //true 
alert(instance instanceof  SuperType);  //true 
alert(instance instanceof  SubType);    //true


以上代码定义了两个类型:SuperType和SubType。每个类型分别有一个属性和方法。它们主要区别就是SubType继承了SuperType,而这继承是通过创建SuperType新实例,并将这个新实例赋给SubType.prototype实现的。实现的本质就是重写原型对象,代之以新类型的实例。

 

instance指向Subtyoe.prototype,SubType.prototype又指向了SuperType.prototype。getSuperValue()方法仍然还在SuperType。prototype中,但property则位于SubType.prototype中。这是因为property是一个实例属性,而getSyoerValue()则是一个原型方法。既然SubType.prototype现在是SuperType的实例,那么property当然位于该实例中。此外,要注意instance.constrcutor现在指向的是SuperType,这是因为原来SubType.propertype中的constructor被重写了的缘故。

注:SubType.propertype中的constructor不被重写了的缘故,而是SubType的原型指向了另一个对象——SuperType的原型,而这个原型对象的constructor是指向SuperType的。

通过实现原型链,本质上就是扩展了原型搜索机制。

2.别忘了默认的原型

事实上,我们的原型链还少了一环,所有引用类型默认继承了Object类型,而这个继承也是通过原型链实现的。我们要记住,所有函数的默认原型都是Object的实例,因此默认原型都会包含一个内部指针,指向Object.prototype。这也正式自定义类型能使用toString()等默认方法的原因。

 

一句话,SubType集成了SuperType,而SuperType继承了Object。当调用instance.toSring()时,实际调用的是保存在Object.prototype中的那个方法。

3.确定原型和实例的关系

可以使用instanceof操作符来测试实例与原型链中出点过的构造函数。 

1
2
3

alert(instance instanceof  Object);     //true
alert(instance instanceof  SuperType);  //true
alert(instance instanceof  SubType);    //true

4.谨慎的定义方法

子类型有时需要重写父类型中的某个方法,或者需要添加父类型中不穿在的某个方法,但不管怎么,给原型添加的代码一定要放在替换原型的语句之后。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
function  SuperType(){
     this .property= true ;
     }
  
SuperType.prototype.getSuperValue= function (){
     return  this .property;
     }
  
function  SubType(){
     this .subproperty= false ;
     }
      
//继承了SuperType
SubType.prototype= new  SuperType();
  
//添加新方法
SubType.prototype.getSubValue= function (){
     return  this .subproperty;
     }
  
//重写父类型中的方法
SubType.prototype.getSuperValue= function (){
     return  this .subproperty;
     }
  
var  instance= new  SubType();
alert(instance.getSuperValue());         //false

注意,在通过原型链实现继承时,不能使用对象字面量创建原型对象,这样会重写原型链。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
function  SuperType(){
     this .property= true ;
     }
  
SuperType.prototype.getSuperValue= function (){
     return  this .property;
     }
  
function  SubType(){
     this .subproperty= false ;
     }
      
//继承了SuperType
SubType.prototype= new  SuperType();
  
//使用字面量添加新方法,会导致上一行代码无效
SubType.prototype={
     getSubValue: function (){
         return  this .subproperty;
         },
     someOtherMethod: function (){
         return  false ;
         }
          
     }
var  instance= new  SubType();
alert(instance.getSuperValue());         //error

由于现在的原型包含的是一个Object的实例,而非SuperType的实例,因此我们设想中的原型链已经别切断——SubType和SuperType已经没关系了。

5.原型链的问题

​原型链最主要的问题还是来支援引用类型的原型,我们以前说过包含引用类型值的原型属性会被所有实例共享,这也是为什么要在构造函数中定义属性,而不是在原型中定义属性的原因了。在通过原型来实现继承时,原型实际上会被变成另一个类型的实例。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function  SuperType(){
     this .colors=[ "red" , "blue" , "green" ];
     }
      
function  SubType(){
}
  
//继承了SuperType
SubType.prototype= new  SuperType();
  
var  instance= new  SubType();
instance.colors.push( "black" );   //"red","blue","green","black"
alert(instance.colors);
  
var  instance2= new  SubType();
alert(instance2.colors);          //"red","blue","green","black"

原型的第二个问题:在创建子类的实例时,不能向父类型的构造函数传递参数,所以实践中很少单独用到原型链。

OpenClaw实战一|企业微信AI客服数字员工:自动应答+工单创建+数据统计,零代码3天落地 OpenClaw做企业微信AI客服数字员工,真正的价值不是“能自动回复”,而是把“咨询-应答-工单-统计-复盘”全流程闭环。对中小企业来说,不用招专职AI开发、不用买昂贵客服系统,一台服务器、零代码配置,就能拥有媲美大厂的智能客服能力。 阅读详情

相关推荐

想学嵌入式但没开发板?试试这个免费的STM32虚拟仿真平台(含LVGL界面教程)

本文介绍如何利用免费的STM32虚拟仿真平台学习嵌入式开发,特别适合预算有限或零硬件基础的学习者。通过详细的LVGL界面开发教程,展示虚拟仿真在嵌入式学习中的高效性和实用性,涵盖环境搭建、代码实现到实机迁移的全流程,助力快速掌握嵌入式开发核心技能。

weixin_29266647的博客 306

javascript原型、原型链、继承详解

在JavaScript中,call和apply是两个用于调用函数的方法。call。它接收一个参数列表,并将每个参数传递给函数。第一个参数thisArg是可选的,用于指定函数中的this值。如果不传递thisArg,默认为全局对象(在浏览器中是window对象)。call方法会立即调用函数。${${this在这个例子中,call方法将person对象作为第一个参数传递给了greet函数。函数执行后,this.name将会是person对象的name属性。输出将会是。

jieyucx的博客 2037

5G核心网Framed Routing功能解析:基于PFCP的帧路由机制与多终端互联实践

5G核心网Framed Routing功能解析:基于PFCP的帧路由机制与多终端互联实践

大家好,我是码农老gou,一名专注于编程技术的程序员。在这个博客中,我将与大家分享我在工作和学习中的经验、见解以及一些实用的技术干货。 1467

理解对象原型和原型链

本篇文章带大家介绍一下JavaScript中的对象原型和原型链。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 对象原型 相信大家都这样用过 map: letarr=[0,1,2] letdoubleArr=arr.map(c=>c*2) console.log(doubleArr)//0,2,4 不知道你有没有想过,arr本身并没有设定map属性,那为什么可以用map这个函数呢? 把它打印出来看看: console...

qq_43067585的博客 333

别再乱选保护板了!手把手教你用ABLIC S-8254A为3/4串锂电池组DIY安全保护电路

本文详细介绍了如何使用ABLIC S-8254A保护集成电路为3/4串锂电池组DIY安全保护电路。从选型策略、电路搭建到功能验证,手把手教你实现可靠的充放电保护系统,适用于无人机、电动工具等场景,确保锂电池组的安全使用。

weixin_42525264的博客 189

AI 生成 ECU 功能测试用例

本文分享了AI辅助汽车电子测试的实战经验。作者以某车企车身控制器(BCM)项目为例,对比了传统测试用例编写方式(需100小时)与AI辅助方式(仅3个工作日)的效率差异,实现76%的效率提升。文章详细展示了从需求文档生成测试用例的全过程,包括需求文档示例、AI提示词模板和AI生成的完整测试用例表格(涵盖正常功能、边界条件、异常场景等测试类型)。通过具体案例说明如何利用AI快速生成初稿后人工审核优化的方法,为ECU测试工程师提供了可复用的效率提升方案。

小明的博客 882

【JavaScript】原型链 & 继承

访问实例的属性时,先查看该实例自己的属性;若还是没有,则查看其原型对象的原型对象的属性;思路:因为实例可以获取原型链上的数据,这样我们可以把父类的实例作为子类的构造函数的原型。思路:复制父类实例的属性给子类实例,解决原型链继承中的 “引用值共享问题”。可以发现,只要我们更新原型链上的某一节点,就会影响该节点以下的所有实例。通过构造函数继承,继承父类的属性,并解决 “引用值共享问题”。如果我们给实例重写了一些的同名属性,会覆盖其原型对象的属性。通过原型链继承,继承父类的原型链的属性。

Superman_H的博客 751

海康威视 2024届 数字逻辑设计 实习笔试分析

记录一下 5月11日晚,做的海康威视的一场笔试。分享给需要的IC人。 岗位:数字逻辑设计工程师(浙江 杭州) 转载需要本人同意! 我的见解不一定都是准确的,欢迎评论区交流指正~~

记录所学,分享知识,结识挚友 1万+

JS | JS中原型链的常见继承模式

每个对象拥有一个原型对象,对象以其原型为模板,从原型继承属性和方法。当然 原型对象 也可能拥有原型,并从中继承属性和方法,依此类推,这种关系被称为原型链。准确地说,这些属性和方法定义在Object的构造器函数(constructor functions)之上的prototype属性上,而非对象实例本身。

青春木鱼的博客 1478

3D 韩系风格漫剧人设 | GPT-Image2 人设生成【附完整提示词】

宁姚同款清冷剑系美人,极致小巧鹅蛋脸,下颌线紧致纤细流畅,下巴小巧精致收窄,小脸衬得五官格外舒展,韩式水光肌,面部精细水光高光,鼻梁高光、鼻尖高光、面中苹果肌高光、唇珠高光,红棕色长卷发偏分大波浪,垂在一侧肩前,发量蓬松。发量丰厚蓬松有体积感,不贴头皮,几缕碎发自然垂落脸侧修饰脸型,长度过胸及背,发丝柔顺丝滑卷度自然,发尾自然垂落,身穿香槟色缎面挂脖长裙,挂脖设计无袖露肩露背,上半身围裹式荡领胸口垂褶,腰部堆褶收腰,修身直筒包臀裙长度到脚踝,缎面光泽感强垂坠感好,极简剪裁。纯白色背景,3D漫剧写实厚涂风。

欢迎来到鸾姝淡月博客,专为程序员和编程爱好者打造的技术博客。我们分享编程语言趋势、开发工具、编程哲学、职业发展等,助你掌握新技术,优化技能,激发编程热情。 133

告别 DEFINE VIEW:CDS View Entity 迁移全景实战(报表迁移 + ADT 向导 + 避坑清单)

CDS迁移的关键要点与策略 CDS DDIC-based View已被标记为废弃,迁移到CDS View Entity成为必要。迁移面临的主要挑战包括激活成本、命名约束和依赖风险。ABAP 7.57及以上版本必须优先处理,否则将积累技术债务。 迁移方式主要有两种: 报表路线:适合渐进式迁移的On-Premise项目 ADT向导:适合云环境批量迁移 关键注意事项: 必须提前检查SQL View依赖关系 金额/数量字段需要显式引用单位/货币字段 建议按使用场景分批迁移 最佳实践是结合报表进行系统盘点,再通过AD

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 208

JavaScript 继承 知识点

继承 1.原型链 a.案例 // 创建Animal function Animal() { this.name = 'animal'; } Animal.prototype.getAnimalName = function () { console.log(this.name + 'getAnimalName'); } // 创建Dog function Dog() { this.name = 'dog'; } // Dog继承自Animal 将Animal的实例赋值给Dog的原型对象,...

Hfffs的博客 343

基于深度学习的堰塞坝表层颗粒物质识别研究

本文提出一种基于深度学习的堰塞坝表层颗粒物质智能识别方法,针对颗粒分布散乱、背景复杂的问题,采用"大颗粒逐个识别、密集小颗粒分块识别"策略。结合Mask R-CNN、SLIC和AlexNet构建识别模型,通过无人机影像实现自动识别。实验表明该方法精度超过90%,具备迁移能力。文章提供了Python实现代码,涵盖数据预处理、SLIC分割、模型构建(Mask R-CNN和AlexNet)及训练流程,为堰塞坝应急抢险提供技术支持。

huanghm88的专栏 181

JS中修改原型链继承

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

PrisonersDilemma的博客 1412

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

迈瑞BS系列全自动生化分析仪LIS协议接口手册(内含HL7和ASTM)

迈瑞BS系列全自动生化分析仪LIS协议接口手册,内含HL7和ASTM)

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

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

gitblog_00071的博客 617

华为的C语言编程规范.pdf

华为技术有限公司内部技术规范。本规范制定了编写C语言程序的基本原则、规则和建议。从代码的清晰、简洁、可测试、安全、程序效率、可移植各个方面对C语言编程作出了具体指导。

js原型继承和原型链继承以及注意事项

* 就是子对象自动拥有父对象的属性和方法, 继承可以提高代码的复用性。 * JS里的继承主要依靠是的原型链。让原型对象(每一个构造函数都有一个原型对象)的值,等于另一个类型的实例,即实现了继承;另外一个类型的原型再指向第三个类型的实例,以此类推,也就形成了一个原型链 function Animal(newName,newAge){ this.name = newName; ...

素描本里的男子的博客 3774

lwip-2.0.3

lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。

JavaScript 原型链与继承

原型链与继承 系列文章 这是JavaScript系列文章: 类 promise async & await 原型链与继承 闭包 this CommonJS ES6 Module 文章目录原型链与继承系列文章

一出好剧 9505

javascript中的继承(JS基于原型链的继承),以及JS中的call和apply函数

继承是面向对象编程语言的一个重要特性,比如JAVA中,通过extend可以实现多继承,但是javascript中的继承方式跟JAVA中有很大的区别,JS中通过原型链的方式实现继承。

liwusen的博客 1912

JavaScript:原型、原型链、继承

每个函数都有一个 prototype(原型)属性,这个属性是一个指针,指向一个对象, 而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法,使用原型对象的好处是可以 让所有对象实例共享它所包含的属性和方法。当你创建一个对象时,Javascript会从该对象的构造函数的原型对象中查找属性和方法。结合第四种中提及的继承方式,解决普通对象的继承问题的 Object.create 方法,我们在前面这几种继承方式的优缺点基础上进行改造,得出了寄生组合式的继承方式,这也是所有继承方式里面相对最优的继承方式。

snow的博客 1625

js原型、原型链和继承

继承是指将特性从父代传递给子代,以便新代码可以重用并基于现有代码的特性进行构建。JavaScript 使用对象实现继承。每个对象都有一条链接到另一个称作原型的对象的内部链。该原型对象有自己的原型,依此类推,直到原型是 null 的对象。

hole_diss的博客 1237

JavaScript的原型链-JS实现继承的底层机制

对于如何是原型链,我们要先了解原型链的“钥匙”——‘prototype’和‘__proto__’,对于这两个属性需要知道该用在哪里,而不是随便乱用。

2401_83354214的博客 198

JavaScript的继承方式——原型链

JavaScript中依靠原型链的继承方式 开门见山,ECMAScript中实现继承主要是靠原型链来实现的。 什么是原型链呢?   其基本思想是利用原型,让一个引用类型继承另一个引用类型的属性和方法。根据上一节原型对象:我们知道,每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针。那么如果我们让原型对象等于另一个类型的实例,结果会怎样呢

flyingpig2016的博客 1707

深入了解js原型与原型链——继承

导语 说到 js原型、原型链、继承,是个令人头疼的问题,说懂吧,只懂一点,说不懂,倒是知道一点。 看到网上很多关于这几个知识点的文章,不过大都会把人讲懵,今天你刷到我,那么你就舒服了。 js 原型 话不多说,先上代码: function Person(){ } Person.prototype.name = "养猪的王某人"; Person.prototype.age = 18; ...

欧阳的技术博客 8635

JavaScript原型链与继承

本文系统介绍了JavaScript中的原型链机制。首先阐述了原型链的基本概念,包括对象与原型的关系、构造函数/原型对象/实例的三者关联,以及原型链的查找规则。其次详细讲解了原型链操作相关方法,如原型检测、修改与替换,Object.create()的使用,以及属性遮蔽现象。接着分析了继承的本质,比较了原型链继承的优缺点,并讨论了性能优化策略。最后介绍了ES6类语法如何基于原型链实现继承。整体来看,原型链是JavaScript实现继承的核心机制,理解其原理有助于编写更高效的代码

asdzkj的博客 855

JavaScript的原型链与基于原型链的继承

深入学习JavaScript的人都知道,JavaScript也是门支持面向对象编程的语言。面向对象的语言有一个标志,就是它们都有类的概念,通过类可以创建任意多个具有相同属性和方式的对象。然鹅,ECMAScript里没有类的概念,(ES6的class也只是一种语法糖,它仍然是基于原型的),但是JavaScript可以通过原型链机制为对象提供“继承”功能。 在了解原型链之前,我觉得了解一下JavaScript的继承设计思想,也就是JavaScript的设计人员的设计想法和故事,是挺有帮助的。 在我一开始学习原型

qq_45908404的博客 163

详解JS原型链与继承

详解JS原型链与继承

hzj1369的博客 2203
上一篇: Ext Form用法详解
下一篇: 验证(正则表达式)
Andy_java_
博客等级 码龄10年 4粉丝 22原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值