定义
类是构造函数、原型链的语法糖。
定义类有两种形式
class Student {
}
var Student = class {
}某些浏览器可能无奈解析es6及以上的语法，这时候须要通过babel将代码解析成浏览器可辨认的语法，定义类的语法通过babel编译之后就是通过function定义的构造函数。
类和构造函数是一样的，通过new关键字创立，具备prototype属性
class Student{}
var student = new Student()
console.log(Student.prototype)
console.log(Student.prototype.constructor)
console.log(student.__proto__ === Student.prototype)
console.log(student instanceof Student)
console.log(typeof Student)执行后果如下
类的办法
构造方法
通过constructor来定义类的构造方法，通过new关键字来创立类的实例时会执行构造方法中的代码
class Student {
constructor(name, age) {
this.name = name
this.age = age
}
}
var student = new Student('alice', 18)
console.log(student)执行后果如下，创立了一个Student的实例对象
babel解析后果如下
实例办法
实例办法就是挂载在类（构造函数）原型上的办法，能够供所有的实例对象应用，不会在每个实例对象上保留一份
class Student {
constructor(name, age) {
this.name = name
this.age = age
}
studying() {
console.log(`${this.name} likes studing~`)
}
}
var student = new Student('kiki', 16)
console.log(student)
student.studying()执行后果如下
拜访器办法
拜访器办法能够用于获取/批改类中的属性
class Student {
constructor(){
this.mainSubject = 'Chinese'
}
get subject(){
console.log('获取主修课')
return this.mainSubject
}
set subject(value){
console.log('批改主修课')
this.mainSubject = value
}
}
var student = new Student()
console.log(student)
student.mainSubject = 'Math'
console.log(student)执行后果如下
静态方法
定义在类（构造函数）上，且仅供类（构造函数）本身可应用
class Student {
static showInfo(){
console.log('我是一个Student类')
}
}
Student.showInfo()执行后果如下
继承
类中实现继承要比构造函数中更为简略，通过extends关键字就能够实现两个类的继承关系。
class Person{
eating(){
console.log('person eating')
}
}
class Student extends Person{
}
var student = new Student()
console.log(student)
student.eating()执行后果如下
如果要共享构造方法中的数据，则须要通过super来实现
class Person{
constructor(name, age){
this.name = name
this.age = age
}
eating(){
console.log('person eating')
}
}
class Student extends Person{
constructor(name, age, stuNo){
super(name, age)
this.stuNo = stuNo
}
eating(){
super.eating()
console.log('student eating')
}
}
var student = new Student('kiki', 16, 1)
console.log(student)
student.eating()执行后果如下
继承内置类
当咱们须要对javascript内置的函数做一些裁减的时候，能够继承自内置的函数。比方对数组进行补充，新增一个返回数组中第一个元素的办法。
class iArray extends Array {
firstItem(){
return this[0]
}
}
let arr = new iArray(1, 2, 3)
console.log(arr)
console.log(arr.firstItem())执行后果如下
混入
javascript中只能单继承，不反对多个父类，当子类心愿获取多个父类的属性和办法时，能够自定义mixin的形式来实现继承关系
function mixinRunner(BaseClass) {
return class extends BaseClass {
running() {
console.log('running')
}
}
}
function mixinEater(BaseClass){
return class extends BaseClass {
eating() {
console.log('eating')
}
}
}
class Person {
}
const Student = mixinEater(mixinRunner(Person))
const student = new Student()
student.running()
student.eating()执行后果如下
多态
不同的数据类型操作执行同一个操作时，体现进去的行为不统一，就称为多态。
function calcArea(foo) {
console.log(foo.getArea())
}
var circle = {
radius: 6,
getArea() {
return this.radius * 3.14
}
}
function Person() {
this.getArea = function(){
return 20
}
}
calcArea(circle)
calcArea(new Person())执行后果如下
以上执行两次calcArea函数，传入的参数别离为一般对象和实例对象，执行他们各自的getArea办法，最初获取的后果也不一样
以上就是ES6之类（class）应用的具体介绍，对于js高级，还有很多须要开发者把握的中央，能够看看我写的其余博文，继续更新中~
发表回复