class类的使用

ES6

我们都知道PHP和Java是有类的，而JavaScript是没有类的，现在ES6就增加了类的使用。

类的作用：我们在ES5中经常使用方法或者对象去模拟类的使用，虽然可以实现功能，但是代码并不优雅，ES6为我们提供了类的使用。需要注意的是我们在写类的时候和ES5中的对象和构造函数要区分开来，不要混了。

类的声明

先声明一个最简单的coder类，类里只有一个name方法，方法中打印出传递的参数。

class coder{
    name(val){  // val是函数的参数，不是类的参数
        console.log(val);
    }
}

类的使用

我们已经声明了一个类，并在类里声明了name方法，现在要实例化类，并使用类中的方法。

class coder{
    name(val){  // val是函数的参数，不是类的参数
        console.log(val);
    }
}
let www = new coder;
www.name('123');        // 123

类的多方法声明

class coder{
    name(val){  // val是函数的参数，不是类的参数
        console.log(val);
        return val;         // 如果不return值，那么在skill中拿到的是undefined
    }
    // 注意：两个方法中间不要写逗号了
    skill(val){
        // this指类本身
        console.log(`${this.name('www')} 的技能是 ${val}`);
    }
}
let www = new coder;
www.skill('web');        // www 的技能是 web

注意：
1、两个方法中间不要写逗号了
2、这里的this指类本身
3、注意return

类的传参 constructor()

在类的参数传递中我们用constructor()进行传参。传递参数后可以直接使用this.xxx进行调用。

class coder{
    constructor(a, b){
        this.a = a;
        this.b = b;
    }
    add(){
        return this.a + this.b
    }
}
let www = new coder(1, 2);
console.log(www.add());        // 3

我们用constructor来约定了传递参数，然后用作了一个add方法，把参数相加。这和以前我们的传递方法有些不一样，所以需要多注意下

class的继承

如果你学过java，一定知道类的一大特点就是继承。ES6中也就继承，在这里我们简单的看看继承的用法。

class coder{
    name(val){  // val是函数的参数，不是类的参数
        console.log(val);
    }
    constructor(a, b){
        this.a = a;
        this.b = b;
    }
    add(){
        return this.a + this.b
    }
}
class aa extends coder{};   // coder1继承coder的类
let www1 = new aa(1, 2);
www1.name('abc');               // abc
console.log(www1.add());        // 3

声明一个aa的新类并继承Coder类，aa新类里边为空，这时候我们实例化新类，并调用里边的name方法。结果也是可以调用到的。