js中的继承

2023-06-04 22:16:53 浏览数 (1)

​

方式一：原型链继承

特点：实例可继承的属性有：实例的构造函数的属性，父类构造函数属性，父类原型的属性。（新实例不会继承父类实例的属性！） 缺点：新实例无法向父类构造函数传参

代码语言：javascript复制
function Parent() {
	this.name = 'zs'
}
Parent.prototype.say = function() {
	console.log('hello')
}
function Child() {
	this.age = 20
}
Child.prototype = new Parent()
const c = new Child();
console.log(c) // Child { name: 'zs', age: 20 }

方式二：借用构造函数继承

特点：可以向父类构造函数传参 缺点：不能继承父类构造函数的原型

代码语言：javascript复制
function Parent(name) {
	this.name = name
}
function Child() {
	Parent.call(this, 'lisi')
	this.age = 20
}
const c = new Child();
console.log(c) // Child { name: 'lisi', age: 20 }

方式三：组合式继承：原型链继承 构造函数继承

代码语言：javascript复制
function Parent(name) {
	this.name = name
}
function Child(name) {
	Parent.call(this, name)
	this.age = 20
}
Child.prototype = new Parent()
const c = new Child('lisi');
console.log(c) // Parent { name: 'lisi', age: 20 }

方式四：通过 extends 关键字

代码语言：javascript复制
class Parent {
	name = 'zs'
}
class Child extends Parent {
	age = 20
}
const c = new Child();
console.log(c) // Child { name: 'zs', age: 20 }

​

继承 javascript前端

0 人点赞