ES5 中的类与继承
js
// 创建类和实例化
function People(name, age) {
// this 指向实例化对象
this.name = name
this.age = age
People.count ++
}
People.prototype.run = function() {
console.log('run...')
}
// 静态属性 静态方法
People.count = 0
People.getCount = function() {
// 这里使用 this ,它指向构造函数
return People.count
}
let p1 = new People('he', 18)
p1.run()
console.log(People.count)
// ------------------------------------------ //
// 继承
function Animal(name) {
this.name = name
Animal.count ++
}
Animal.prototype.showName = function() {
console.log(this.name)
}
// 静态属性 静态方法
Animal.count = 0
Animal.getCount = function() {
// 这里使用 this ,它指向构造函数
return Animal.count
}
function Dog(name, age) {
Animal.call(this, name) // 继承父类属性
this.age = age
}
Dog.prototype = new Animal() // 继承父类方法
Dog.prototype.constructor = Dog // 还原构造函数
// 下面一行是另外一种继承父类方法的写法
// Dog.prototype = Object.create(Animal.prototype)
Dog.prototype.run = function() {
console.log('run...')
}
let d1 = new Dog('wa', 2)
console.log(d1)
d1.showName()
d1.run()
问题:上面代码无法继承父类静态属性和静态方法,怎么办?
ES6 中的类与继承
js
class People {
constructor(name, age) {
this.name = name
this.age = age
this._sex = 'male'
People.count ++
}
get sex() {
return this._sex
}
set sex(value) {
this._sex = value
}
showName() {
console.log(this.name)
}
static count = 0
static getCount() { // 静态方法
return People.count
}
}
let p1 = new People('he', 21)
console.log(p1)
console.log(p1.sex)
p1.sex = 'female'
console.log(p1.sex)
console.log(People.getCount())
class Farmer extends People {
constructor(name, age, weight) {
super(name, age)
this.weight = weight
}
showWeight() {
console.log(this.weight)
}
}
let f1 = new Farmer('llo', 33, 140)
console.log(f1)
f1.showName()
f1.showWeight()
console.log(Farmer.getCount()) // 2 可以继承父类静态方法