JS类和继承

类

JS中的class其实就是一个函数，class是关键字，后面是类名，一般以大写开头，然后是大括号

1： constructor就是构造函数，里面的this.name中的this指向new出来的实例（当前实例），如3中的xialuo就是new出来的一个实例，执行了3后，this就等于xialuo这个实例对象了。括号里的name，number就是形参，而3中括号里的'夏洛'和2017102就是实参，new一个实例的时候需要把实参传进去，这样这个xialuo就变成真实的对象了，它有自己独立的name属性，值为夏洛，它也有自己独立的number属性，值为2017102。所谓类的对象，就是根据什么Student这一个类（图纸）所制造出来的实例。

2：sayHi是类中的方法，可以通过this.（属性名）获取实例对象（当前实例）的这个属性，this就是对象本身，为什么这里的this就是实例对象本身呢，因为4表示xialuo这个实例对象调用了sayHi这个方法，根据this指向一条规则，谁调用了这个方法，this就指向谁，所以这时候sayHi方法里的this.name能拿到xialuo的name属性。

3：new一个实例出来，将Student这一个类（图纸）实例化（将一个Student大类变成一个真实的xialuo这个具体的学生了），执行这句代码后，xialuo相当于这样一个具体对象

xialuo = {
  name:'夏洛',
  number:'2017102',
  classroom:401
}

4：因为xialuo是Student类的实例对象，所以可以调用Student类里的方法sayHi，可以通过方法实现一些“动作”。

继承

//父类
class People{
	constructor(name) {
		this.name = name
	}
	eat(){
		console.log(`${this.name} eat something`)
	}
}
//子类Student
class Student extends People{
	constructor(name,number) {
		super(name)
		this.number = number
	}
	sayHi(){
		console.log(`姓名：${this.name},学号：${this.number}`)
		//console.log('姓名：' + this.name + ',学号：' + this.number)
	}
}

//子类Teacher
class Teacher extends People{
	constructor(name,major) {
		super(name)
		this.major = major
	}
	teach(){
		console.log(`${this.name} 教授 ${this.major}`)
	}
}
//Student实例
var xialuo = new Student('夏洛',2017102)
console.log(xialuo.name)
console.log(xialuo.number)
xialuo.sayHi()
xialuo.eat()
//Teacher实例
var wang = new Teacher('王老师','语文')
console.log(wang.name)
console.log(wang.major)
console.log(wang.number)//undefined
wang.teach()
wang.eat()
wang.sayHi()//报错

类的构造函数中有个super，它类似于ES5语法中的call继承，当做函数使用的时候,代表的是父类的构造函数，ES6要求，子类的构造函数必须执行一些super

super()代表的是父类的构造函数但是返回的是子类的实列，内部的this指向的是子类的实列 // 相当于People(父类).prototype.constructor.call(this);

不是这个类的属性，这个类的实例去使用它，会打印undefined，不是这个类的方法，这个类的实例去调用它，会报错。

类

继承

猜你喜欢