javaScript 基础知识汇总 （十三）

1、Class

　　在JavaScript中 calss即类是一种函数

　　基本语法

　　class Myclass{

　　　　constructor(){}

　　　　method1(){}

　　　　method2(){}

　　　　method3(){}

　　}

　　示例：

　　class User{

　　　　constructor(name){//构造函数

　　　　　　this.name = name;

　　　　}

　　　　sayHI(){//属性方法

　　　　　　alert(name);

　　　　}

　　}

　　//使用方法

　　let user = new User("XiaoMing");

　　user.sayHi();

　　类表达式

　　let User = class{

　　　　sayHi(){

　　　　　　alert('Hello');

　　　　}

　　};

2、类继承

　　在JavaScript中类继承通过　extends关键字实现。示例：

class Animal {
  constructor(name) {
    this.speed = 0;
    this.name = name;
  }
  run(speed) {
    this.speed += speed;
    alert(`${this.name} runs with speed ${this.speed}.`);
  }
  stop() {
    this.speed = 0;
    alert(`${this.name} stopped.`);
  }
}

// 通过指定“extends Animal”让 Rabbit 继承自 Animal
class Rabbit extends Animal {
  hide() {
    alert(`${this.name} hides!`);
  }
}

let rabbit = new Rabbit("White Rabbit");

rabbit.run(5); // White Rabbit runs with speed 5.
rabbit.hide(); // White Rabbit hides!

　　重写方法

　　直接重新定义，从新写相同名字的就可以

class Rabbit extends Animal {
  stop() {
    // ...这将用于 rabbit.stop()
  }
}

　　如果想在字类中仍使用父类的方法，又不直接重写，则可以 通过 super 来实现

　　

class Animal {

  constructor(name) {
    this.speed = 0;
    this.name = name;
  }

  run(speed) {
    this.speed += speed;
    alert(`${this.name} runs with speed ${this.speed}.`);
  }

  stop() {
    this.speed = 0;
    alert(`${this.name} stopped.`);
  }

}

class Rabbit extends Animal {
  hide() {
    alert(`${this.name} hides!`);
  }

  stop() {
    super.stop(); // 调用父类的 stop 函数
    this.hide(); // 然后隐藏
  }
}

let rabbit = new Rabbit("White Rabbit");

rabbit.run(5); // White Rabbit runs with speed 5.
rabbit.stop(); // White Rabbit stopped. White rabbit hides!

　　重写构造函数

　　不能直接重新写，要先执行super 之后才可以

　　原因：1） 当一个普通构造函数执行时，它会创建一个空对象作为this，并继续执行

　　　　　2）但是当继承的构造函数执行时，它并不会做这件事情，而是运行符类中的构造函数来完成这项工作。

　　用法示例;

　　class Animal{

　　　　constructor(name){

　　　　　　this.speed = 0;

　　　　　　this.name = name;

　　　　}

　　}

　　class Rabbit extends Animal{

　　　　constructor(name,earLength){

　　　　　　super(name);

　　　　　　this.earLength = earLength;

　　　　}

　　　}

　　let rabbit = new Rabbit("White Rabbit",10)

　　alert(rabbit.name);

　　alert（rabbit.earLength);

　　箭头函数没有自己的this或super，所以它们能融入到就近的上下文。

3、静态属性和方法

　　通过关键字static 设置静态方法或者静态属性

　　静态方法:

　　class User{

　　　　static staticMethod(){

　　　　　　alert(this === user);

　　　　}

　　}

　　User.staticMethod();//true

　　静态属性：

　　class Article{

　　　　static name = "xiaoming";

　　}

　　alert(Article.name);

　　静态属性和方法是被继承的

　　对于 class B extends A，类 B 的 prototype 指向了 A：B.[[Prototype]] = A。因此，如果一个字段在 B 中没有找到，会继续在 A 中查找。　　

4、私有的和受保护的属性和方法

　　受保护的属性通常以下划线_作为前缀

　　class CoffeeMachine{

　　　　_waterAmount = 0;

　　　　set waterAmount(value){

　　　　　　if(value<0) throw new error("Negative water");

　　　　　　this._waterAmount = value;

　　　　}

　　　　get waterAmount(){

　　　　　　return this._waterAmount;

　　　　}

　　}

　　let cofMachine = new CoffeeMachine();

　　cofMachine.waterAmount = 10;

　　alert(cofMachine.waterAmount);//10

　　设置只读

　　只有get 方法没有set 方法

　　初始化可以给默认值或者通过构造函数赋值

　　class CoffeeMachine{

　　　　constructor(power){

　　　　　　this._power = power;

　　　　}

　　　　get power(){

　　　　　　return this._power;

　　　　}

　　}

5、类型监测 “instanceof”

　　用法：obj instanceof Class

　　　如果 obj隶属于Class 或者是Class 衍生的类，表达式返沪true

　　类型监测图表