<强>写在前面
本文讲解JavaScript各种继承方式和优缺点。
<强>注意:
跟《JavaScript深入之创建对象》一样,更像是笔记。
哎,再让我感叹一句:《JavaScript高级程序设计》写得真是太好了!
<强> 1。原型链继承
函数父(){
this.name=翱摹?
}
Parent.prototype。getName=function () {
console.log (this.name);
}
函数子(){
}
的孩子。原型=new父();
var child1=新的子();
凯文console.log (child1.getName ())//之前
问题:
1。引用类型的属性被所有实例共享,举个例子:
函数父(){
this.names=(“凯文”,“黛西”);
}
函数子(){
}
的孩子。原型=new父();
var child1=新的子();
child1.names.push(“义务”);
console.log (child1.names);//(“凯文”,“黛西”、“义务”)
var child2=新的子();
console.log (child2.names);//(“凯文”,“黛西”、“义务”)
之前
2。在创建儿童的实例时,不能向父母传参
<强> 2。借用构造函数(经典继承)
函数父(){
this.names=(“凯文”,“黛西”);
}
函数子(){
Parent.call(这个);
}
var child1=新的子();
child1.names.push(“义务”);
console.log (child1.names);//(“凯文”,“黛西”、“义务”)
var child2=新的子();
console.log (child2.names);//(“凯文”,“黛西”)
之前
<>强优点:
1,避免了引用类型的属性被所有实例共享
2。可以在孩子中向父传参
举个例子:
函数的父(名字){
this.name=名称;
}
函数的孩子(名字){
的父母。调用(这名字);
}
var child1=新的子(“凯文”);
console.log (child1.name);//凯文
var child2=新的子(“黛西”);
console.log (child2.name);//黛西
之前
缺点:
方法都在构造函数中定义,每次创建实例都会创建一遍方法。
<强> 3。组合继承
原型链继承和经典继承双剑合璧。
函数的父(名字){
this.name=名称;
这一点。颜色=(“红”、“蓝”、“绿色”);
}
Parent.prototype。getName=function () {
console.log (this.name)
}
函数的孩子(姓名、年龄){
的父母。调用(这名字);
这一点。年龄=年龄;
}
的孩子。原型=new父();
var child1=新的子(“凯文”、“18”);
child1.colors.push(黑色);
console.log (child1.name);//凯文
console.log (child1.age);//18
console.log (child1.colors);//(“红”、“蓝”、“绿色”、“黑色”)
var child2=新的子(“黛西”、“20”);
console.log (child2.name);//黛西
console.log (child2.age);//20
console.log (child2.colors);//(“红”、“蓝”、“绿色”)
之前
优点:融合原型链继承和构造函数的优点,是JavaScript中最常用的继承模式。
<强> 4。原型式继承
函数createObj (o) {
函数F () {}
F。原型=o;
返回新F ();
}
就是ES5对象。创建的模拟实现,将传入的对象作为创建的对象的原型。
缺点:
包含引用类型的属性值始终都会共享相应的值,这点跟原型链继承一样。
={var人
名称:“凯文”,
朋友:[“黛西”,“凯利”]
}
var person1=createObj(人);
var person2=createObj(人);
person1.name=皃erson1”;
console.log (person2.name);//凯文
person1.firends.push(“泰勒”);
console.log (person2.friends);//(“黛西”、“凯利”,“泰勒”)
之前
注意:修改<代码> person1.name> person2.name> 深入理解JavaScript继承的多种方式和优缺点
