ES6之class

2018-08-28  本文已影响0人  zzzZink

class介绍

ES6之前,我们只能通过构造函数来生成实例对象。

function Person(name, age){
  this.name = name
  this.age = age
}
Person.prototype.eat = ()=>console.log('我在吃饭呢')
let p1 = new Person('zink', 20)
p1.eat()  //我在吃饭呢

这种写法个人认为有些麻烦,新手不太能理解(尤其是java这类面向对象语言)。

引用阮一峰老师对class介绍就是:

ES6 的class可以看作只是一个语法糖,它的绝大部分功能,ES5 都可以做到,新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。

//定义类
class Person{
  constructor(name, age){
    this.name = name
    this.age = age
  }

  setAge(age){
    this.age = age
  }
}
typeof Person //function
let p1 = new Person('zink', 20)
let p2 = new Person('jack', 18)
p1.__proto__ === p2.__proto__  //true

上面的代码使用ES6的class定义了一个类,constructor方法就是构造方法,this指向对象实例,setAge方法实际就是ES5中定义在构造函数的prototype里面的方法,ES6 的类,完全可以看作构造函数的另一种写法。
跟ES5相同,类的所有实例共享一个原型对象。
类不能重复声明

如果类的方法中有this,默认指向类的实例。


constructor方法

ES6规定constructor方式是一个类必须的,即使在定义类时没有写,JS引擎也会默认为它添加一个空的constructor方法,constructor方法在通过new命令生成实例对象时自动调用。

使用类生成示例对象必须使用new命令,普通的构造函数不使用new命令也可以执行。


不存在变量提升

类不存在变量提升(所有的变量的声明语句,都会被提升到代码的头部)

new Test()  //Uncaught ReferenceError: Test is not defined
class test{}

class的静态方法

类相当与实例的原型,类中定义的所有方法都会被实例继承,但只要在方法前加上static关键字,那么该方法就不会被实例继承,只能通过直接调用类来使用,并且如果静态方法内含有this,这个this指向类而非实例。

class Person{
    static fn(){
        this.test()
    }
    static test(){
        console.log('test')
    }
    test(){
        console.log('我不是静态方法')
    }
}
Person.fn()  //test
let test = new Person()
test.fn()  //Uncaught TypeError: test.fn is not a function
上一篇 下一篇

猜你喜欢

热点阅读