ES6-class类

106 阅读2分钟
(1)概述
  • 在ES6中,class (类)作为对象的模板被引入,可以通过 class 关键字定义类
  • class 的本质是 function。
  • 它可以看作一个语法糖,让对象原型的写法更加清晰、更像面向对象编程的语法。
  • 类不可重复声明
  • 类定义不会被提升,这意味着必须在访问前对类进行定义,否则就会报错
  • 类和模块的内部,默认就是严格模式,所以不需要使用 use strict 指定运行模式
(2)类定义
// 命名类
class Example {
    constructor(a) {
        this.a = a;
    }
}
​
// 匿名类
let Example = class {
    constructor(a) {
        this.a = a;
    }
}
​
(3)类的主体
  • 属性:ES6的类中不可以直接定义变量,变量定义在constructor中。
class People {      
    //var a; //SyntaxError: Unexpected token =
    constructor() {
        this.a = 100; //定义变量
    }
} 
let p = new People();
console.log(p.b); //10
  • 方法

    • constructor 方法是类的默认方法,创建类的对象时被调用。也被称为类的构造方法(构造函数、构造器)。一个类中有且仅有一个构造方法。
    class People {
        constructor() {
            console.log("我是构造方法,使用new创建对象时调用");
        }
    } 
    new People(); //将执行constructor方法
    
    • 原型方法:不需要使用function关键字,通过“对象.原型方法”调用。
    class People {
        say(world) {
            console.log(`say ${world}`);
        }
        add(a, b) {
            console.log(a + b);
        }
    }
    let p = new People();
    p.say("hello"); //say hello
    p.add(1, 2); //3
    
    • 静态方法:使用static修饰,调用时不需要创建对象,直接通过“类名.静态方法”调用
    class People {
        static sum(a, b) {
            console.log(a + b);
        }
    }
    People.sum(1, 2);
    
(4)类的继承
  • 解决代码的复用
  • 使用extends关键字实现继承
  • 子类可以继承父类中所有的方法和属性
  • 子类只能继承一个父类(单继承),一个父类可以有多个子类
  • 子类的构造方法中必须有super() 来指定调用父类的构造方法,并且位于子类构造方法中的第一行
  • 子类中如果有与父类相同的方法和属性,将会优先使用子类的(覆盖)
class People {
    //父类构造方法
    constructor() {
        this.a = 100; //父类中定义的变量
        console.log("People constructor");
    }
    //原型方法
    eat() {
        console.log("eat...")
    }
    //静态方法
    static play() {
        console.log("play...")
    }
}
            
class Student extends People {
    //子类构造方法
    constructor() {
        super(); //调用父类构造器,必须存在,且位于子类构造器第一行的位置
        this.b = 200; //子类定义的变量
        console.log("Student constructor");
    }
    study() {
        console.log("study...");
    }
}
            
let stu = new Student();
console.log(stu.a, stu.b);
stu.eat();
stu.study();
Student.play();

内部类:属于外部类的成员,必须通过“外部类.内部类”访问

// 外部类
class Outer {
    constructor() {
         console.log("outer");
    }
}
// 内部类
Outer.Inner = class {
    constructor() {
         console.log("Inner");
    }
}     
new Outer.Inner();