0x000 概述

es6真正的引入的面相对象的类，以前我们总是通过其他手段来模拟类这种形式，现在终于有了，我有点开心，又有点难过，因为在我看来，js并不是所谓的面相对象的语言，反而更偏向函数式，原型继承是他真正的面目。面相对象不过是人们在思考问题时总结出一套有效的、大家都认同的解决问题的思路。在其他语言、各种领域取得成功之后，又将这种思想带入js中，为的是将已有的经验可以复用到js，从而更有效的解决js中的问题。

的确，面相对象是一个很有用的思考模块，在分解真实世界、大型项目的维护上有很大的好处，但是却缺少了函数式的灵巧。曾经想用完全面向对象的方式写一个redux，却发现无法用这种方式写出compose这种神奇的东西。

或许是我还没能在面相对象和函数式之间取得一种平衡，以取得面相对象和函数式共同的优点。

0x001 类

• 普通的类

  class Person{}

• 类表达式

  // 匿名类let Person=class{}// 具名类let Person=class Person{}

0x001 初始化类和构造函数

• 实例化类

  可以使用new来调用一个类，从而实例化一个类实例

  class Person{}new Person() // Person{}

• 构造函数

  使用new实例化一个类实例之后，将会自动调用该类的构造函数constructor，并且可以传递参数

  class Person{    constructor(name, age){        console.log(name, age)    }}new Person("jack", 23) // 'jack', 23

• 类变量

  类中可以保存一些变量，在类中，可以通过this.variable_name来访问，在类外，可以通过instance_name.variable_name只有类实例可以访问他们，并且每个类实例的变量都是属于每个类实例的。

  class Person {   constructor(nickname, age){       this.nickname = nickname       this.age = age   }}console.log(Person.nickname) // undefinedconsole.log(Person.age) // undefinedlet person=new Person("jack",23) console.log(person.nickname) // 'jack'console.log(person.age) // 23let person2=new Person("maria",11) console.log(person2.nickname) // 'maria'console.log(person2.age) // 11

• 类方法

  类方法是定义在类内部的函数，可以在类内部调用：this.function_name(params)，也可以在实例上调用：instance_name.function_name(params)

  class Person{    constructor(nickname, age){        this.nickname = nickname        this.age =age    }    getNickname(){        return this.nickname    }    getAge(){        return this.age    }    summary(){        return  `${this.nickname}:${this.age}`    }}let person=new Person('jack', 23)console.log(person.getNickname()) // ''jackconsole.log(person.getAge()) // 23console.log(person.summary()) // 'jack:23'

• 静态方法

  静态方法是可以通过类直接调用的方法，不需要实例化

  class Person{    static sayHello(){        console.log('hello')    }}Person.sayHello() // 'hello'

继承

继承就是将父类所有的方法和都继承下来，包括构造函数

class Person{        constructor(nickname, age){            this.nickname = nickname            this.age =age        }        getNickname(){            return this.nickname        }        getAge(){            return this.age        }        summary(){            return  'this is Person'        }}class Male extends Person {}let  male=new Male('jack',23)console.log(male.nickname) // 'jack'console.log(male.age) // 23console.log(male.getNickname()) // 'jack'console.log(male.getAge()) // 23console.log(male.summary()) // 'this is Person'

0x003 重写

有时候我们不希望一个函数的作用和父类一致，比如在上面的栗子中，male.summary()返回this is Person，不符合我们的逾期，我们希望返回this is Male，这个时候就可以用到重写，只要写一个和父类相同名字和函数就行了，甚至参数个数不一致也不影响

class Person{        constructor(nickname, age){            this.nickname = nickname            this.age =age        }        getNickname(){            return this.nickname        }        getAge(){            return this.age        }        summary(){            return  'this is Person'        }}class Male extends Person {    summary(){        return  'this is Male'    }}let male=new Male()console.log(male.summary()) // this is Male

0x004 调用超类

有时候我们希望在父类的流程基础上添加一些自己的逻辑，这个时候就可以用到调用超类。要注意的是，如果要重写构造函数，必须要在构造函数的第一行调用父类的构造函数super(...params)，在而在其他地方，则可以通过super.variable_name或者super.function_name(params)调用父级的变量或者方法

class Person{        constructor(nickname, age){            this.nickname = nickname            this.age =age        }        getNickname(){            return this.nickname        }        getAge(){            return this.age        }        summary(){            return  'this is Person'        }}class Male extends Person {    constructor(nickname, age){        super(nickname, age)        this.sex='male'    }    getSex(){        return this.sex    }    summary(){        return  super.summary()+', and this is Male'    }}let male=new Male()console.log(male.sex) // maleconsole.log(male.summary) //this is Person, and this is Male