Classes6
Basic Syntax —— 怎么声明一个类?函数
Setters & Getters —— 如何读写属性?学习
ES6this
Static Methods —— 如何操做一个方法?spa
Sub Classes —— 怎么继承另外一个类?prototype
let Animal = function (type) { this.type = type this.eat = function () { console.log('i am eat food') } } let dog = new Animal('dog') let monkey = new Animal('monkey') console.log(dog.eat()) //i am eat food console.log(monkey.eat()) //i am eat food monkey.eat = function () { console.log('error') } console.log(dog.eat()) //i am eat food console.log(monkey.eat()) //error // eat若是实例化以后进行修改,修改了dog的,那么monkey的不会改变,这样就失去了继承的概念。若是是公共方法那么不要写在类的私有方法里面。
因此要把公共方法放在原型对象上面code
let Animal = function (type) { this.type = type } Animal.prototype.eat = function () { console.log('i am eat food') } let dog = new Animal('dog') let monkey = new Animal('monkey') console.log(dog.eat()) //i am eat food console.log(monkey.eat()) //i am eat food monkey.constructor.prototype.eat = function () { console.log('error') } console.log(dog.eat()) //error console.log(monkey.eat()) //error
class Animal { constructor (type) { this.type = type } eat() { console.log('i am eat food') } } let dog = new Animal('dog') let monkey = new Animal('monkey') console.log(dog.eat()) console.log(monkey.eat())
没有区别,class只是ES5用原型链声明构造函数的 语法糖
console.log(typeof Animal) //function
没法实现读写属性的拦截操做,只读属性等很差实现对象
读属性blog
class Animal { constructor (type) { this.type = type } //age 前面加一个get / set,就变成了属性,es6支持属性提高到函数体最顶层,能够不所有写到constructor里面 //get是只读属性 get age () { return 4 } eat () { console.log('i am eat food') } } let dog = new Animal('dog') console.log(dog.age) // 4 dog.age = 5 console.log(dog.age) // 4 对age的赋值并无生效
写属性继承
let _age = 4 class Animal { constructor (type) { this.type = type } // 读取 get age () { return _age //返回值和属性名age不要同样 } // 写入 set age (val) { if (val < 7 && val > 4) { _age = val //返回值和属性名age不要同样 } } eat () { console.log('i am eat food') } } let dog = new Animal('dog') console.log(dog.age) // 4 dog.age = 5 // 符合条件,修改了age属性的值 console.log(dog.age) // 5 dog.age = 8 // 不符合条件,没有修改age属性的值 console.log(dog.age) // 5
let Animal = function (type) { this.type = type } // 对象实例方法 Animal.prototype.eat = function () { Animal.walk() //这里不用this,是由于这里的this,指的是实例对象,而walk方法是在构造函数上,不在实例对象上 console.log('i am eat food') } // 添加静态方法,经过类是能够访问的,可是没法经过实例对象访问 Animal.walk = function () { console.log('i am walking') } let dog = new Animal('dog') dog.eat() //i am walking //i am eat food dog.walk() // dog.walk is not a function 报错
static标识符能够实现
class Animal { constructor (type) { this.type = type } // 对象实例方法,类中直接定义方法就是实例对象的方法 eat () { Animal.walk() console.log(this) // 这里的类指的是Animal,不能在这里使用this.type,由于Animal上面没有type属性,其原型对象上有type属性 console.log('i am eat food') } // 添加静态方法,是经过static标识符进行区分的 static walk () { console.log('i am walking') } } let dog = new Animal('dog') dog.eat() //i am walking //i am eat food
若是此函数内部有要使用实例对象的属性和方法的时候,那么必须定义为 类的实例对象方法。
若是此函数内部不须要实例对象的内容,就使用 类的静态方法。
面向对象之因此强大,就是由于继承。
let Animal = function (type) { this.type = type } Animal.prototype.eat = function () { Animal.walk() console.log('i am eat food') } Animal.walk = function () { console.log('i am walking') } // 声明一个Dog构造函数,其继承Animal构造函数的,将Animal构造函数运行一下,并将其this指向Dog构造函数 let Dog = function () { // 1.初始化父类的构造函数,使用call是改变this的指向Dog的实例,后面是传入的参数,有多少依此日后排便可 // 这里只能继承Animal构造函数内部的属性和方法 Animal.call(this, 'dog') } // 2.剩下一部分挂载在原型链上的继承,须要把Dog的原型链指向Animal的原型链--引用类型 Dog.prototype = Animal.prototype let dog = new Dog('dog') dog.eat() //i am walking //i am eat food
extends能够实现
class Animal { constructor (type) { this.type = type } eat () { Animal.walk() console.log(this.type + ' eat food') } static walk () { console.log('i am walking') } } // 用extends实现了继承,用其来表示Dog是Animal的子类 class Monkey extends Animal { // 默认执行了下面的语句,若是构造函数没有新增属性这样写,那么能够不用写 // constructor (type) { // super(type) //继承父类要执行父类的构造函数,专用方法 // } } class Dog extends Animal { constructor (type) { // super必须在构造函数第一行,不然报错,并且必须传参数 super(type) this.age = 2 } hello () { // super对象始终指向父类,调用它就是调用了父类的构造函数 super.eat() console.log('and say hello') } } let dog = new Dog('dog') let monkey = new Monkey('monkey') dog.eat() monkey.eat() // i am walking // dog eat food // i am walking // monkey eat food dog.hello() // i am walking // dog eat food // and say hello