Propriedades estáticas de JavaScript

Resumo : neste tutorial, você aprenderá sobre as propriedades estáticas JavaScript de uma classe e como acessar as propriedades estáticas em um método estático, construtor de classe e outros métodos de instância.

Introdução às propriedades estáticas do JavaScript

Assim como um método estático , uma propriedade estática é compartilhada por todas as instâncias de uma classe . Para definir uma propriedade estática, você usa a staticpalavra-chave seguida pelo nome da propriedade assim:

class Item {
  static count = 0;
}
Linguagem de código:  JavaScript  ( javascript )

Para acessar uma propriedade estática, você usa o nome da classe seguido do .operador e do nome da propriedade estática. Por exemplo:

console.log(Item.count); // 0Linguagem de código:  JavaScript  ( javascript )

Para acessar a propriedade estática em um método estático, você usa o nome da classe seguido do .operador e do nome da propriedade estática. Por exemplo:

class Item {
  static count = 0;
  static getCount() {
    return Item.count;
  }
}

console.log(Item.getCount()); // 0Linguagem de código:  JavaScript  ( javascript )

Para acessar uma propriedade estática em um construtor de classe ou método de instância, use a seguinte sintaxe:

className.staticPropertyName;Linguagem de código:  CSS  ( css )

Ou

this.constructor.staticPropertyName;Linguagem de código:  CSS  ( css )

O exemplo a seguir aumenta a countpropriedade estática no construtor da classe:

class Item {
  constructor(name, quantity) {
    this.name = name;
    this.quantity = quantity;
    this.constructor.count++;
  }
  static count = 0;
  static getCount() {
    return Item.count;
  }
}
Linguagem de código:  JavaScript  ( javascript )

Ao criar uma nova instância da Itemclasse, a instrução a seguir aumenta a countpropriedade estática em um:

this.constructor.count++;Linguagem de código:  CSS  ( css )

Por exemplo:

// Item class ...

let pen = new Item("Pen", 5);
let notebook = new Item("notebook", 10);

console.log(Item.getCount()); // 2Linguagem de código:  JavaScript  ( javascript )

Este exemplo cria duas instâncias da Itemclasse, que chama o construtor da classe. Como o construtor da classe aumenta a countpropriedade em um cada vez que é chamado, o valor de the counté dois.

Junte tudo.

class Item {
  constructor(name, quantity) {
    this.name = name;
    this.quantity = quantity;
    this.constructor.count++;
  }
  static count = 0;
  static getCount() {
    return Item.count;
  }
}

let pen = new Item('Pen', 5);
let notebook = new Item('notebook', 10);

console.log(Item.getCount()); // 2Linguagem de código:  JavaScript  ( javascript )

Resumo

• Uma propriedade estática de uma classe é compartilhada por todas as instâncias dessa classe.
• Use a staticpalavra-chave para definir uma propriedade estática.
• Use o className.staticPropertyNamepara acessar a propriedade estática em um método estático.
• Use this.constructor.staticPropertyNameou className.staticPropertyNamepara acessar a propriedade estática em um construtor.