js面试题继承的方法及优缺点解答

这篇文章主要为大家介绍了js面试题继承的方法及优缺点解答，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪

说一说js继承的方法和优缺点？

一、原型链继承

二、借用构造函数(经典继承)

三、组合继承

四、原型式继承

五、寄生式继承

六、寄生组合式继承

说一说js继承的方法和优缺点？

要点：原型链继承、借用构造函数继承、组合继承、原型式继承、寄生式继承、寄生组合式继承、ES6 Class

答：

一、原型链继承

缺点：

1.引用类型的属性被所有实例共享
2.在创建 Child 的实例时，不能向 Parent 传参

//原型链继承

function Parent() {

this.parentPrototype = "parent prototype"

//验证这种继承方法的确定，如果父类示例中存在一个引用类型的属性，将会被所有子类共享

this.parentObj = {

info: "我是 parent 引用属性parentObj中的 info"

}

function Children() {

}

//将Children的原型对象指定为Parent的示例，通过原型链，将Parent中的属性赋值给Children示例

Children.prototype = new Parent();

const a = new Children();

console.log(a.parentPrototype); // parent prototype

//缺点

const b = new Children();

//在a示例中改动继承的引用属性

a.parentObj.info = "我是a示例中引用属性parentObj中的 info"

//b与a示例共享引用属性

console.log(b.parentObj.info); // 我是a示例中引用属性parentObj中的 info

二、借用构造函数(经典继承)

优点：

1.避免了引用类型的属性被所有实例共享
2.可以在 Child 中向 Parent 传参

缺点：

1.方法都在构造函数中定义，每次创建实例都会创建一遍方法。

function Parent() {

this.parentPrototype = "parent prototype"

this.obj = {

info: "parent obj info"

}

this.fn = function () {

console.log("打印功能")

}

function Children() {

Parent.call(this);

}

const a = new Children();

console.log(a.parentPrototype); // parent ptototype

//缺点此时Parent()会再次创建一个fn函数，这个是没有必要的

const b = new Children();

a.obj.info = "a obj info";

//优点避免了子类实例共享引用属性

console.log(b.obj.info) // parent obj info;

三、组合继承

优点：

1.融合原型链继承和构造函数的优点，是 JavaScript 中最常用的继承模式。

function Parent() {

this.parentPrototype = "我是Parent 中的属性"

}

//Parent中的方法，在原型上定义

Parent.prototype.pFn = function () {

console.log('我是Parent中的方法');

}

function Children() {

//Parent中的属性仍然在构造函数中继承

Parent.call(this);

}

//将Children的原型对象赋值为 Parent实例，这样Parent中的方法也能够被Children继承

Children.prototype = new Parent();

const c = new Children();

console.log(c.parentPrototype); //我是Parent 中的属性

c.pFn(); //我是Parent中的方法

四、原型式继承

缺点： - 1.包含引用类型的属性值始终都会共享相应的值，这点跟原型链继承一样。

function objFn(o) {

o.objFnPrototype = "我是 objFnPrototype"

function F() {}

F.prototype = o;

return new F();

}

let a = objFn({

name: "name1"

});

console.log(a.name); //name1

console.log(a.objFnPrototype); //我是 objFnPrototype

五、寄生式继承

缺点：

1.跟借用构造函数模式一样，每次创建对象都会创建一遍方法。

function createObje(obj) {

let clone = Object.assign(obj); //接受到对象后，原封不动的创建一个新对象

clone.prototype1 = "我是新增的prototype1"; //在新对象上新增属性，这就是所谓的寄生

return clone; //返回新对象

}

const parent = {

parentPrototype: "parentPrototype"

}

//c实例，就继承了parent的所有属性

let c = createObje(parent);

console.log(c.parentPrototype); //parentPrototype

六、寄生组合式继承

优点：

1.这种方式的高效率体现它只调用了一次 Parent 构造函数，并且因此避免了在 Parent.prototype 上面创建不必要的、多余的属性。
2.与此同时，原型链还能保持不变；
3.因此，还能够正常使用 instanceof 和 isPrototypeOf。

function inherProto(superType, subType) {

//拷贝一个超类的原型副本

let proto = {

...superType.prototype

};

//将原型的超类副本作为子类的原型对象，也就是第一种中的原型链继承方式，只不过继承的是超类原型的副本

subType.prototype = proto;

//这一步比较迷，官方的说法是，我们在拷贝超类的原型的时候，拷贝的proto对象，将会丢失默认自己的构造函数，也就是superType，

//所以我们这里将它的构造函数补全为subType。貌似不做这一步也没啥问题，但是缺了点东西可能会有其他的副作用，所以还是补上

proto.constructor = subType;

}

function Super() {

this.superProto = "super proto";

this.colors = ["red", "yelloy"];

}

function Sub() {

this.subProto = "sub proto";

this.name = "sub name";

//这里还是借用构造函数的套路

Super.call(this);

}

Super.prototype.getName = function () {

console.log(this.name);

}

//这里要在定义完Super的属性后执行，因为继承的是超类原型的副本，与Super.prototype是两个对象，在这之后再改变Super.prototype，就已经不会在影响到Sub所继承的副本超类原型对象了

inherProto(Super, Sub);

let a = new Sub();

console.log(a.getName);

以上就是js面试题继承的方法及优缺点解答的详细内容。

300+Python经典编程案例
50G+学习视频教程
100+Python初阶、中阶、高阶电子书籍
1000+简历模板和汇报PPT模板(转正、年终等)

点击拿去