6种JavaScript继承方式及优缺点
发布网友
发布时间：2024-12-25 02:08
共1个回答
热心网友
时间：2024-12-26 16:56
理解JavaScript的继承方式需要对构造函数、原型对象、实例化对象、原型链等概念有一定了解。以下是JavaScript的六种继承方式及各自的优缺点。
第一种：原型链继承
利用原型链的特点进行继承。通过Parent构造函数的属性设置Say方法，此时，Parent具有2个属性和1个方法。创建一个叫做Son的构造函数，其原型对象继承了Parent实例对象，Son也有2个属性和1个方法。对Son构造函数进行实例化，结果赋值给变量son1，son1拥有2个属性和1个方法。输出son1的Say方法，结果为"web前端"。
优点：可以实现继承。
缺点：Son实例化对象都共享原型对象的属性及方法；Son构造函数实例化对象无法进行参数的传递。
第二种：构造函数继承
通过构造函数call方法进行继承。创建父级构造函数Parent，有name、type两个属性。创建子级构造函数Son，函数内部通过call方法调用父级构造函数Parent，实现继承。分别创建构造函数Son的两个实例化对象son1、son2，对son1的type属性新增元素，son2没有新增，结果不一样，说明实现了。
优点：实现实例化对象的性；可以给实例化对象添加参数。
缺点：方法都在构造函数中定义，每次实例化对象都得创建一遍方法，无法实现函数复用；call方法仅仅调用了父级构造函数的属性及方法，无法调用父级构造函数原型对象的方法。
第三种：组合继承
利用原型链继承和构造函数继承的各自优势进行组合使用。创建一个叫做Parent的构造函数，通过其属性设置Say方法，创建子级构造函数Son，函数内部通过call方法调用父级构造函数Parent，实现继承。子构造函数Son继承了父构造函数Parent，此时Son也有2个属性和1个方法。分别创建构造函数Son的两个实例化对象son1、son2，传不同参数、给type属性新增不同元素、调用原型对象Say方法。
优点：利用原型链继承实现原型对象方法的继承；利用构造函数继承实现属性的继承，可以参数。
组合函数基本满足了JS的继承，比较常用。
缺点：无论什么情况下，都会调用两次父级构造函数：一次是在创建子级原型的时候，另一次是在子级构造函数内部。
第四种：原型式继承
创建一个函数，将参数作为一个对象的原型对象。通过创建一个函数fun，内部定义一个构造函数Son，将Son的原型对象设置为参数，完成继承。将Son实例化后返回，即返回的是一个实例化对象。优缺点：跟原型链类似。
第五种：寄生继承
在原型式继承的基础上，在函数内部丰富对象。在原型式继承的基础上，封装一个JiSheng函数，将fun函数返回的对象进行增强，新增Say方法，最后返回。调用JiSheng函数两次，分别赋值给变量parent1、parent2，对比parent1、parent2，结果为false，实现。优缺点：跟构造函数继承类似，调用一次函数就得创建一遍方法，无法实现函数复用，效率较低。
补充一个知识点，ES5有一个新的方法Object.create()，这个方法相当于封装了原型式继承。这个方法可以接收两个参数：第一个是新对象的原型对象（可选的），第二个是新对象新增属性，所以上面代码还可以这样实现。
第六种：寄生组合继承
利用组合继承和寄生继承各自优势。组合继承方法我们已经说了，它的缺点是两次调用父级构造函数，可以通过优化减少一次调用，正好利用寄生继承的特性，继承父级构造函数的原型来创建子级原型。封装一个函数JiSheng，两个参数，参数1为子级构造函数，参数2为父级构造函数。利用Object.create()，将父级构造函数原型克隆为副本clone，将该副本作为子级构造函数的原型，给该副本添加constructor属性，因为修改原型导致副本失去默认的属性。
组合继承优点、寄生继承的优点，目前JS继承中使用的都是这个继承方法。
