问答题760/1593ES5怎么实现继承

难度:
2022-03-27 创建

参考答案:

在 ES5 中,实现继承主要有以下几种方式:

  1. 原型链继承: 通过将一个对象的 __proto__ 属性指向另一个对象的 prototype 属性,可以实现继承。
    1function Parent() { 2 this.parentProperty = true; 3} 4Parent.prototype.getParentProperty = function() { 5 return this.parentProperty; 6}; 7function Child() { 8 this.childProperty = false; 9} 10// 继承 Parent 11Child.prototype = new Parent(); 12Child.prototype.getChildProperty = function() { 13 return this.childProperty; 14}; 15var child = new Child(); 16console.log(child.getParentProperty()); // true 17console.log(child.getChildProperty()); // false
  2. 借用构造函数继承: 通过复制一个对象的属性和方法到另一个对象,实现继承。
    1function Parent(name) { 2 this.name = name; 3 this.colors = ['red', 'blue', 'green']; 4} 5Parent.prototype.sayName = function() { 6 console.log(this.name); 7}; 8function Child(name, age) { 9 Parent.call(this, name); // 借用构造函数 10 this.age = age; 11} 12var child = new Child('Nicholas', 29); 13console.log(child.colors); // ['red', 'blue', 'green'] 14console.log(child.age); // 29
  3. 组合继承: 结合原型链继承和借用构造函数继承的优点。
    1function Parent(name) { 2 this.name = name; 3 this.colors = ['red', 'blue', 'green']; 4} 5Parent.prototype.sayName = function() { 6 console.log(this.name); 7}; 8function Child(name, age) { 9 Parent.call(this, name); // 借用构造函数 10 this.age = age; 11} 12Child.prototype = new Parent(); // 原型链继承 13Child.prototype.sayAge = function() { 14 console.log(this.age); 15}; 16var child = new Child('Nicholas', 29); 17console.log(child.colors); // ['red', 'blue', 'green'] 18console.log(child.age); // 29 19console.log(child.sayName()); // Nicholas 20console.log(child.sayAge()); // 29
  4. 原型式继承Object.create()): 使用 Object.create() 方法创建一个新对象,该对象继承自另一个对象。
    1var parent = { 2 colors: ['red', 'blue', 'green'] 3}; 4var child = Object.create(parent); 5child.name = 'Nicholas'; 6console.log(child.colors); // ['red', 'blue', 'green']
  5. 寄生式继承: 通过创建一个继承自原型的对象,然后扩展这个对象,最后返回这个扩展后的对象。
    1function createAnother(original) { 2 var clone = Object.create(original); 3 clone.sayHi = function() { 4 console.log('hi'); 5 }; 6 return clone; 7} 8var person = { 9 name: 'Nicholas' 10}; 11var anotherPerson = createAnother(person); 12anotherPerson.sayHi(); // hi
  6. 寄生组合式继承: 结合原型链继承和寄生式继承的优点,通过调用超类型的构造函数来继承属性,然后通过原型链继承方法。
    1function inheritPrototype(subType, superType) { 2 var prototype = Object.create(superType.prototype); 3 prototype.constructor = subType; 4 subType.prototype = prototype; 5} 6function Parent(name) { 7 this.name = name; 8 this.colors = ['red', 'blue', 'green']; 9} 10Parent.prototype.sayName

最近更新时间:2024-08-10

赞赏支持

预览

题库维护不易,您的支持就是我们最大的动力!