static 关键字

static

类（class）通过 static 关键字定义静态方法。不能在类的实例上调用静态方法，而应该通过类本身调用。

class ClassWithStaticMethod {
  static staticProperty = 'someValue';
  static staticMethod() {
    return 'static method has been called.';
  }
}
console.log(ClassWithStaticMethod.staticProperty);
// output: "someValue"
console.log(ClassWithStaticMethod.staticMethod());
// output: "static method has been called."
 

2 调用静态方法

2.1 从另一个静态方法调用

静态方法调用同一个类中的其他静态方法，可使用 this 关键字。

class StaticMethodCall {
    static staticMethod() {
        return 'Static method has been called';
    }
    static anotherStaticMethod() {
        return this.staticMethod() + ' from another static method';
    }
    static anotherStaticMethod1() {
        return StaticMethodCall.staticMethod() + ' StaticMethodCall'
    }
}
StaticMethodCall.staticMethod();
// 'Static method has been called'

StaticMethodCall.anotherStaticMethod();
// 'Static method has been called from another static method'

StaticMethodCall.anotherStaticMethod1();
// 'Static method has been called StaticMethodCall'
 

2.2 从类的构造函数和其他方法

非静态方法中，不能直接使用 this 关键字来访问静态方法。而是要用类名来调用：CLASSNAME.STATIC_METHOD_NAME() ，或者用构造函数的属性来调用该方法： this.constructor.STATIC_METHOD_NAME().

class StaticMethodCall {
    constructor() {
        console.log(StaticMethodCall.staticMethod());
        // 'static method has been called.'
        console.log(this.constructor.staticMethod());
        // 'static method has been called.'
    }
    static staticMethod() {
        return 'static method has been called.';
    }
    staticMethod1() {
        return this.constructor.staticMethod()
    }
 }
 

3 例子

例1

class Tripple {
  static tripple(n = 1) {
    return n * 3;
  }
}

class BiggerTripple extends Tripple {
  static tripple(n) {
    return super.tripple(n) * super.tripple(n);
  }
}

console.log(Tripple.tripple());// 3
console.log(Tripple.tripple(6));// 18
console.log(BiggerTripple.tripple(2));// 6
let tp = new Tripple();
console.log(BiggerTripple.tripple(3));// 81（不会受父类实例化的影响）
console.log(tp.tripple());// 'tp.tripple 不是一个函数'.
 

例2

class Tripple {
  static tripple(n = 1) {
    return n * 3;
  }
  getNumberValue() {
      return this.constructor.tripple()
  }
}

class BiggerTripple extends Tripple {
  static tripple(n) {
    return super.tripple(n) * super.tripple(n);
  }
}
let b1 = new BiggerTripple()
console.log(b1.getNumberValue()// 9
 

例3

class Tripple {
  static tripple(n = 1) {
    return n * 3;
  }
  getNumberValue() {
      return Tripple.tripple()
  }
}

class BiggerTripple extends Tripple {
  static tripple(n) {
    return super.tripple(n) * super.tripple(n);
  }
}
let b1 = new BiggerTripple()
console.log(b1.getNumberValue()// 3
 

例4

class Tripple {
  static tripple(n = 1) {
    return n * 3;
  }
  getNumberValue() {
      return Tripple.tripple()
  }
}

class BiggerTripple extends Tripple {
  static tripple(n) {
    return super.tripple(n) * super.tripple(n);
  }
}

console.log(Tripple.prototype.constructor === Tripple)
console.log(t1.__proto__ === Tripple.prototype )
console.log(BiggerTripple.prototype.__proto__ === Tripple.prototype)
console.log(t1 instanceof Tripple === true)
console.log(Tripple.prototype.__proto__ === Object.prototype)
console.log(Tripple.prototype.__proto__.__proto__ === null)