JavaScript各种继承方式(一):原型链继承(prototype chaining)
一 原理
子类的构造函数的原型对象,是父类的构造函数创建的实例。
function Fruit(){
this.name = '水果';
this.nutrition=['维生素','膳食纤维'];
} Fruit.prototype.eat = function(){
console.log('eat');
}; function Mango(){ } // 继承父类的方法
Mango.prototype = new Fruit();
// 修改父类的构造函数的原型对象的constructor属性:
// 父类的实例会继承原型对象的constructor属性,从而父类的实例的constructor属性都指向父类的构造函数。仅此而已。
Mango.prototype.constructor = Mango;
// 添加子类的方法
Mango.prototype.taste = function(){
console.log('taste');
}; let mango1 = new Mango();
let mango2 = new Mango(); // 子类的实例共享原型对象中的属性/方法
console.log(mango1.name,mango2.name); // 水果 水果
console.log(mango1.nutrition === mango2.nutrition); // true
console.log(mango1.eat === mango2.eat) // true // 原型对象中的属性是基础数据类型:不能被子类直接修改
mango1.name = '泰国芒果';
mango2.name = '海南芒果';
console.log(mango1.__proto__.name,mango2.__proto__.name); // 水果 水果
console.log(mango1.name,mango2.name); // 泰国芒果 海南芒果 // 原型对象中的属性是对象类型:可以被子类直接修改。
mango1.nutrition.push('柠檬酸');
console.log(mango2.nutrition); // ["维生素", "膳食纤维", "柠檬酸"] // 原型链
console.log(mango1 instanceof Mango); // true
console.log(mango1 instanceof Fruit); // true
二 优点
拼接了原型链。子类的实例可以从父类继承属性/方法,子类的实例是父类的实例。
三 缺点
1 子类的构造函数无法向父类的构造函数传参。定义子类的构造函数时,继承就确定了,跟子类的构造函数的执行无关。
2 子类的实例共享原型对象的属性/方法,互相干扰。
3 不能实现多继承。 原型对象只能有一个。
JavaScript各种继承方式(一):原型链继承(prototype chaining)的更多相关文章
- js继承之组合继承(结合原型链继承 和 借用构造函数继承)
在我的前两篇文章中,我们已经介绍了 js 中实现继承的两种模式:原型链继承和借用构造函数继承.这两种模式都存在各自的缺点,所以,我们考虑是否能将这二者结合到一起,从而发挥二者之长.即在继承过程中,既可 ...
- JS高阶---继承模式(原型链继承)
[前言] 之前已经介绍了对象创建的五种模式,下面看下继承模式 本节介绍下<原型链继承> [主体] 验证如下: 关键点: .
- 【前端知识体系-JS相关】深入理解JavaScript原型(继承)和原型链
1. Javascript继承 1.1 原型链继承 function Parent() { this.name = 'zhangsan'; this.children = ['A', 'B', 'C' ...
- javascript原型与原型链,prototype、__proto__、constructor
javascript通过构造函数(constructor)和原型链来(prototype chain)实现其他面向对象语言的类概念.ES6语法中引入了“类”(class)的概念,但只是一个语法糖,只是 ...
- 深入浅出JavaScript之原型链&继承
Javascript语言的继承机制,它没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instanc ...
- 一步步学习javascript基础篇(5):面向对象设计之对象继承(原型链继承)
上一篇介绍了对象创建的几种基本方式,今天我们看分析下对象的继承. 一.原型链继承 1.通过设置prototype指向“父类”的实例来实现继承. function Obj1() { this.name1 ...
- javascript中继承(一)-----原型链继承的个人理解
[寒暄]好久没有更新博客了,说来话长,因为我下定决心要从一个后台程序员转为Front End,其间走过了一段漫长而艰辛的时光,今天跟大家分享下自己对javascript中原型链继承的理解. 总的说来, ...
- 《JAVASCRIPT高级程序设计》根植于原型链的继承
继承是面向对象的语言中,一个最为津津乐道并乐此不疲的话题之一.JAVASCRIPT中的继承,主要是依靠原型链来实现的.上一篇文章介绍过,JAVASCRIPT中,每一个对象都有一个prototype属性 ...
- Javascript 组合继承 原型链继承 寄生继承
Javascript继承通常有三种方式. 第一种:组合式继承: function SuperType(name) { this.name = name; this.colors = ["re ...
- 三张图搞懂JavaScript的原型对象与原型链 / js继承,各种继承的优缺点(原型链继承,组合继承,寄生组合继承)
摘自:https://www.cnblogs.com/shuiyi/p/5305435.html 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__pro ...
随机推荐
- SecureCRT显示乱码的解决办法
下面来看看SecureCRT的显示出现乱码这种情况.比如: 现在我们重新设置一下 设置下图中的配置 1.选择字符编码为UTF-8. 2.设置字符集为GB2312后保存好后确认退出. 3.再次测试一下.
- day08-字符串操作
name = 'hello,world,WORLD! 123,你好' #capitalize()#首字母大写,其他全部变成小写,没有iscapitalize()方法print(name.capital ...
- JSONArray 遍历
JSONArray 遍历 刚遇到一个接接口任务,发现其中返回数据中,是个字符串数组,数组中就是单个json形式的内容,其实应该也可以称这种数据叫做json数组吧,只不过是字符串形式.而我需要的是将 ...
- pycharm 直接删掉数据表之后,makemigration和migrate 之后,数据库中依然没有生成数据表的问题
综合分析一下行程这个问题的原因: 在终端中运行 select * from django_migrations; 查看 提交的记录,如果你的表删掉了,记录还在,那么数据库会觉得,这个表依然是存在的,所 ...
- jquery接触初级----- 一种新奇的选择器用法
今天看到一个新奇的jquery 选择器的用法,因为以前没有见过,所以记录下来 1.jquery 选择器: 给body添加一个元素,添加元素的时候,同时把属性和点击事件都一起进行添加 <!DOCT ...
- Servlet基本_オブジェクトのスコープ
1.スコープ種類Servletには以下のスコープがあります.Request.Session.Applicationの順にスコープは広くなっていきます.・Applicationスコープ:アプリケーション ...
- The Google File System 中文版
摘要 我们设计并实现了Google文件系统,一个面向分布式数据密集型应用的.可伸缩的分布式文件系统.虽然运行在廉价的日用硬件设备上,但是它依然了提供容错功能,为大量客户机提供了很高的总体性能. 虽然与 ...
- Lazarus 中文汉字解决方案
使用Lazarus不得不面对编码问题,尤其中文.Lazarus使用的是UTF8编码,而很多windows程序使用的是ANSI编码,编码问题在此不多说大家可以google去. ANSI数据库与Lazar ...
- Linux命令:sshpass
sshpass介绍 sshpass是一款凡是为凡是使用ssl方式访问的操作提供一个免输入密码的非交互式操作,以便于在脚本中执行ssl操作,如ssh,scp等.sshpass是一家以色列公司Lingnu ...
- RH_KABI_RESERVE的使用
struct mm_struct { .......... #if defined(__GENKSYMS__) || !defined(CONFIG_SPAPR_TCE_IOMMU) /* We're ...