js实现的几种继承方式
他山之石,可以攻玉,本人一直以谦虚的态度学他人之所长,补自己之所短,望各位老师指正! 拜谢
js几种继承方式,学习中的总结:
所谓的继承是为了继承共有的属性,减少不必要代码的书写
第一种:借用构造函数继承 :可以继承实例属性。但是原型中的方法无法继承
// - 设置需要被继承的构造函数Animal
function Animal(name,age){
this.name = name;
this.age = age;
} Animal.prototype.eat = function(){
console.log("吃各种吃的");
}; //再设置一个猫咪构造函数 //思考:已经存在的构造函数Animal中具有了一些属性和方法,这些属性与方法时Cat构造函数需要的
// 没有必要再书写一遍了,可以使用继承的方式获取
function Cat(name,age){
//通过call的方式,修改Animal中的this指向为当前Cat的this,并设置参数
Animal.call(this,name,age);
} var c1 = new Cat("jack",);
console.log(c1);
第二种:原型继承
new Animal()这样的语句之后执行 否则会被覆盖 function Animal(name,age){
this.name = name;
this.age = age;
}
Animal.prototype.eat = function(){
console.log("吃各种吃的");
};
function Cat(color){
this.color = color;
}
//继承的核心代码:
Cat.prototype = new Animal("jack",);///这点是重要点:必须写在前面 ,否则会覆盖子类的方法
//设置被覆盖的constructor属性 让constructor重新指向Cat
Cat.prototype.constructor = Cat;
Cat.prototype.shangShu = function(){
console.log("猫咪可以爬树");
};
原型链:查找规则,优先查找自身,如果没有则查找__proto__中是否存在; 原型链是用来描述实例对象与原型对象之间关系的一种方式。
第三种:组合继承
function Animal(name,age){
this.name = name;
this.age = age;
}
Animal.prototype.eat = function(){
console.log("吃各种吃的");
};
function Cat(name,age,color){
//使用借用构造函数的方式继承:
Animal.call(this,name,age);
this.color = color;
}
//原型继承的核心代码:
//使用组合继承方式后,在构造函数体中就设置了实例属性,此处不需要传参
Cat.prototype = new Animal();
//设置被覆盖的constructor属性
Cat.prototype.constructor = Cat;
Cat.prototype.shangShu = function(){
console.log("猫咪可以爬树");
};
var c1 = new Cat("rose",,"red");
console.log(c1);
在这总结一下原型链:
原型链:查找规则,优先查找自身,如果没有则查找__proto__中是否存在; 原型链是用来描述实例对象与原型对象之间关系的一种方式
①Animal构造函数在设置时没用继承自其它的构造函数
②Animal的原型对象也是一个对象
③对象都是通过Object这个构造函数创建的
④Animal.prototype这个对象__proto__就应该指向Object.prototype
⑤通过观察我们发现确实含有一个属性constructor,并且值为Object构造函数
⑥Object.prototype中没有__proto__属性了,说明这个对象是原型对象的终点。若果使用一个对象的属性时,在整个原型对象中均没找到,值即为undefined Object。prototype.__proto__打印为null
扩展:在作用域中,都没有找到会报错
第四种:对组合继承的优化方式
个人认为:
function Animal(name,age){
this.name = name;
this.age = age;
}
Animal.prototype.eat = function(){
console.log("吃各种吃的");
};
function Cat(name,age,color){
//使用借用构造函数的方式继承:
Animal.call(this,name,age);
this.color = color;
}
//原型继承方式中希望获取到Animal的原型方法
//Cat.prototype = new Animal();
//可以省去不需要继承的实例属性
//这种方式的确会比组合继承的方式性能更好,但是略麻烦(了解即可)
function Fun (){}
Fun.prototype = Animal.prototype;
Cat.prototype = new Fun();
Cat.prototype.constructor = Cat;
Cat.prototype.shangShu = function(){
console.log("猫咪可以爬树");
};
var c1 = new Cat("rose",,"red");
console.log(c1);
第五种:拷贝继承
function Animal(name,age){
this.name = name;
this.age = age;
}
Animal.prototype.eat = function(){
console.log("吃各种吃的");
};
//核心代码
补充一下:对象之间的继承:
var obj={
name:'jack',
age:,
gender:'男',
sayHai:function(){
console.log(‘我是人)
}
}
问题:obj2想要继承obj的属性
)拷贝继承:
var obj2={};
for(var k in obj){
obj2[k]=obj[k];
}
)原型继承:
function Fun(){};
Fun.prototype=obj;
var obj2=new Fun();
console.log(obj2);
js实现的几种继承方式的更多相关文章
- js常见的几种继承方式
1.原型链继承 “父类”的实例作为子类的prototype SubType.prototype = new SuperType() 2.组合继承(原型链+构造函数) function SubType( ...
- js中的几种继承方法
JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一. 继承:子承父业:一个原本没有某些方法或属性的对象,统一写方法,拿到了另外一个对象的属性和方法 下面是js中的几种继承方式 1.改变this ...
- js的三种继承方式及其优缺点
[转] 第一种,prototype的方式: //父类 function person(){ this.hair = 'black'; this.eye = 'black'; this.skin = ' ...
- 重新理解JS的6种继承方式
写在前面 一直不喜欢JS的OOP,在学习阶段好像也用不到,总觉得JS的OOP不伦不类的,可能是因为先接触了Java,所以对JS的OO部分有些抵触. 偏见归偏见,既然面试官问到了JS的OOP,那么说明这 ...
- js的6种继承方式
重新理解js的6种继承方式 注:本文引用于http://www.cnblogs.com/ayqy/p/4471638.html 重点看第三点 组合继承(最常用) 写在前面 一直不喜欢JS的OOP,在学 ...
- js的5种继承方式——前端面试
js主要有以下几种继承方式:对象冒充,call()方法,apply()方法,原型链继承以及混合方式.下面就每种方法就代码讲解具体的继承是怎么实现的. 1.继承第一种方式:对象冒充 function P ...
- 细说 js 的7种继承方式
在这之前,先搞清楚下面这个问题: function Father(){} Father.prototype.name = 'father'; Father.prototype.children = [ ...
- JavaScript_几种继承方式(2017-07-04)
原型链继承 核心: 将父类的实例作为子类的原型 //父类 function SuperType() { this.property = true; } SuperType.prototype.ge ...
- 都0202年了,你还不知道javascript有几种继承方式?
前言 当面试官问你:你了解js哪些继承方式?es6的class继承是如何实现的?你心中有很清晰的答案吗?如果没有的话,可以通过阅读本文,帮助你更深刻地理解js的所有继承方式. js ...
随机推荐
- python简单爬虫(爬取pornhub特定关键词的items图片集)
请提前搭好梯子,如果没有梯子的话直接403. 1.所用到的包 requests: 和服务器建立连接,请求和接收数据(当然也可以用其他的包,socket之类的,不过requests是最简单好用的) Be ...
- Kotlin基本语法和使用技巧
基本语法 val value: String? = "HelloWorld" val name: String = getName() ?: return //如果是null就re ...
- Shell之StdI/O和Pipe
目录 Shell之StdI/O和Pipe 参考 StdI/O重定向 Pipe 常用组合 Shell之StdI/O和Pipe
- [ngclass]、[ngstyle]、管道
[ngclass] 动态改变一个元素的class ts: public classcolor:boolean=false; public list:any = [{title:"新闻1&qu ...
- 用深度学习做命名实体识别(六)-BERT介绍
什么是BERT? BERT,全称是Bidirectional Encoder Representations from Transformers.可以理解为一种以Transformers为主要框架的双 ...
- Java为什么需要四种引用?
首先抛出一个问题:在闲暇时间收拾自己家里的时候,对某一件物件要不要丢弃的问题上,是否有过食之无味,弃之可惜的感觉? 同样的,JVM在回收Java对象的时候,是否对对象实例也有食之无味,弃之可惜的感受? ...
- LitePal的查询
转载:http://blog.csdn.net/guolin_blog/article/details/40153833 传统的查询数据方式 其实最传统的查询数据的方式当然是使用SQL语句了,Andr ...
- 深入理解C#多线程 -戈多编程
引用(http://www.cnblogs.com/luxiaoxun/p/3280146.html) 一.使用线程的好处 1.可以使用线程将代码同其他代码隔离,提高应用程序的可靠性. 2.可以使 ...
- The Troublesome Frog
In Korea, the naughtiness of the cheonggaeguri, a small frog, is legendary. This is a well-deserved ...
- MySQL索引的建立与实现
一.索引介绍 1.MySQL中,所有的数据类型都可以被索引,索引包括普通索引,唯一性索引,全文索引,单列索引,多列索引和空间索引等. 2.额外的:我已知的自动创建索引的时机:创建主键,唯一,外键约束的 ...