Propriedade computada JavaScript – Acervo Lima Tutorials

Resumo : neste tutorial, você aprenderá sobre as propriedades computadas do JavaScript introduzidas no ES6.

Introdução à propriedade computada em JavaScript

ES6 permite usar uma expressão entre colchetes []. Em seguida, usará o resultado da expressão como o nome da propriedade de um objeto. Por exemplo:

let propName = 'c';

const rank = {
  a: 1,
  b: 2,
  [propName]: 3,
};

console.log(rank.c); // 3
Linguagem de código:  JavaScript  ( javascript )

Neste exemplo, the [propName]é uma propriedade computada do rankobjeto. O nome da propriedade é derivado do valor da propNamevariável.

Ao acessar ca propriedade do rankobjeto, o JavaScript avalia propNamee retorna o valor da propriedade.

Assim como um objeto literal , você pode usar propriedades computadas para getters e setters de uma classe . Por exemplo:

let name = 'fullName';

class Person {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }
  get [name]() {
    return `${this.firstName} ${this.lastName}`;
  }
}

let person = new Person('John', 'Doe');
console.log(person.fullName);Linguagem de código:  JavaScript  ( javascript )

Saída:

John Doe

Como funciona:

The get[name]é um nome de propriedade computado de um getter da Personclasse. Em tempo de execução, ao acessar a fullNamepropriedade, o objeto person chama o getter e retorna o nome completo.