js的继承有那些,并说出原理! 携带关键字:原型继承 借用构造函数继承 class继承
时间: 2024-05-30 14:12:48 浏览: 108
可以,关于继承的问题,目前有三种方式:原型继承、借用构造函数继承和class继承。 原型继承是通过原型链来实现的,每个对象都有一个原型对象,通过原型链可以访问到其原型对象的属性和方法。借用构造函数继承是通过在子类构造函数中调用父类的构造函数来实现的,从而继承父类的属性和方法。class继承是ES6新增的一种继承方式,通过class关键字来定义类,并使用extends关键字来继承父类的属性和方法。
相关问题
js的继承有那些,并说出原理! 关键字:原型继承 借用构造函数继承 class继承
可以通过原型继承、借用构造函数继承和 class 继承实现 JavaScript 的继承。其中原型继承是通过将一个对象的原型指向另一个对象来实现继承。借用构造函数继承则是通过在子类的构造函数中调用父类的构造函数来实现。而 class 继承是 ES6 中新增的一种继承方式,通过使用 extends 关键字来实现继承。在 class 继承中,子类会继承父类的方法和属性,并且可以通过 super 关键字来调用父类的构造函数和方法。
原型链继承2.借用构造函数继承3.组合式继承4.ES6的class类继承
原型链继承(Prototype Inheritance)在JavaScript中是通过创建一个新对象并让它引用另一个对象的原型来实现的。例如:
```javascript
function Parent() {}
Parent.prototype.method = function() {
console.log('Parent method');
};
let child = new Parent();
child.method(); // 输出: "Parent method"
```
**借用构造函数继承**(Constructo r Chaining)利用已有构造函数作为父类,通过`new`关键字传递给子类实例化过程,间接实现了继承:
```javascript
function Parent() {
this.parentProp = 'parent';
}
function Child() {
Parent.call(this); // 借用父类构造函数
this.childProp = 'child';
}
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;
let childInstance = new Child();
console.log(childInstance.parentProp); // 输出: "parent"
console.log(childInstance.childProp); // 输出: "child"
```
**组合式继承**(Mix-in or Prototype Mixing)结合原型链和构造函数继承,允许从多个源继承属性和方法:
```javascript
function Mixin(target) {
for (let prop in Mixin.prototype) {
target[prop] = Mixin.prototype[prop];
}
}
function Parent() {
this.parentProp = 'parent';
}
Mixin(Parent.prototype);
let child = new Parent();
console.log(child.parentProp); // 输出: "parent"
```
**ES6的class类继承**(Class-based Inheritance)使用`extends`关键字实现:
```javascript
class Parent {
constructor() {
this.parentProp = 'parent';
}
parentMethod() {
console.log('Parent method');
}
}
class Child extends Parent {
constructor() {
super();
this.childProp = 'child';
}
childMethod() {
console.log('Child method');
}
}
let childInstance = new Child();
childInstance.parentMethod(); // 输出: "Parent method"
childInstance.childMethod(); // 输出: "Child method"
```
阅读全文