类 class
在 ES6 中新增加了类的概念，可以使用 class 关键字声明一个类，之后以这个类来实例化对象。
类抽象了对象的公共部分，它泛指某一大类（class）
对象特指某一个，通过类实例化一个具体的对象
创建类
语法：
class name {
// class body
}
创建实例：
var xx = new name();
注意： 类必须使用 new 实例化对象
类 constructor 构造函数
constructor() 方法是类的构造函数(默认方法)，用于传递参数,返回实例对象
通过 new 命令生成对象实例时，自动调用该方法。如果没有显示定义, 类内部会自动给我们创建一个constructor()
语法：
class Person {
constructor(name,age) {
// constructor 构造方法或者构造函数
this.name = name;
this.age = age;
}
}
创建实例：
var ldh = new Person('刘德华', 18);
console.log(ldh.name)
类中添加方法
<script>
class Star {
constructor(name,age) {
this.name = name;
this.age = age;
}
sing(song) {
console.log(this.name + song);
}
}
var ldh = new Star('刘德华',18);
var zxy = new Star('张学友',19);
ldh.sing('冰雨')
</script>
注：
1、类中创建函数不需要function
2、函数之间不需要逗号
类的继承
extends 关键字可以实现子类继承父类
<script>
class Father {
constructor() {
}
money() {
console.log("我有100元");
}
}
class Son extends Father {
}
var son = new Son();
son.money();
</script>
super可以实现子类继承父类的方法和构造函数
<script>
class Father {
constructor(x,y) {
this.x = x;
this.y = y;
}
sum() {
console.log(this.x+this.y);
}
}
class Son extends Father {
constructor(x,y) {
this.x = x;
this.y = y;
}
}
var son = new Son();
son.sum();
</script>
·这样是不行的，因为父类的this指向的是父类，子类的this指向子类，所以子类无法调用父类的构造方法
这时就需要super关键字
<script>
class Father {
constructor(x,y) {
this.x = x;
this.y = y;
}
sum() {
console.log(this.x+this.y);
}
}
class Son extends Father {
constructor(x,y) {
super(x,y)
}
}
var son = new Son(55,11);
son.sum();
</script>
这时打印结果就会是55+11=66
在继承中，实例化子类输出一个方法，如果子类有这个方法，就先执行子类的，如果没有就去父类中查找，如果有就执行父类的（就近原则）
但是可以用super关键字类改变，因为super不仅可以调用父类的构造函数，也可以调用普通函数。
举例：
<script>
class Father {
say() {
console.log("我是爸爸");
}
}
class Son extends Father {
say() {
console.log("我是儿子");
}
}
var son = new Son(55,11);
son.say();
</script
此时就会输出子类的方法 即：我是儿子
通过super改变：
<script>
class Father {
say() {
console.log("我是爸爸");
}
}
class Son extends Father {
say() {
console.log(super.say()); //super.say() 就是调用父类的普通方法
}
}
var son = new Son(55,11);
son.say();
</script>
此时输出结果为：我是爸爸
子类继承父类方法同时扩展自己的方法
<script>
class Father {
constructor(x,y) {
this.x = x;
this.y = y;
}
sum() {
console.log(this.x+this.y);
}
}
class Son extends Father {
constructor(x,y) {
//利用super调用构造方法
//super必须写在this前面
super(x,y)
this.x = x;
this.y = y;
}
//子类自己的方法
subtract() {
console.log(this.x-this.y);
}
}
var son = new Son(55,11);
son.subtract();
son.sum();
</script>
>
注意事项
1、ES6中没有变量提升，必须先定义类，才能实例化对象
2、类里面的共有的属性和方法一定要加this使用
<body>
<button></button>
<script>
class Star {
constructor(name,age) {
this.name = name;
this.age = age;
this.btn = document.querySelector('button')
this.btn.onclick = this.sing;
}
sing() {
console.log(this.name);
}
}
var ldh = new Star('刘德华',18);
</script>
</body>
3、this指向问题：
（1）constructor函数里面的this指向实例对象
（2）方法里面的this指向方法的调用者（巧妙使用var that = this）