JavaScript Object.defineProperty()

Definição e uso

Object.defineProperty() Método usado para adicionar ou modificar propriedades do objeto.

Object.defineProperty() Método permite alterar os metadados da propriedade.

Object.defineProperty() Método permite adicionar getter e setter.

Métodos relacionados:

Object.defineProperty() Adicionar ou modificar propriedades.

Object.defineProperties() Adicionar ou modificar várias propriedades.

Object.getOwnPropertyNames() Retorna todos os nomes de propriedades do objeto.

Object.getOwnPropertyDescriptor() Retorna a descrição da propriedade.

Object.getOwnPropertyDescriptors() Retorna a descrição de todas as propriedades do objeto.

Instância

Exemplo 1

Adicionar propriedade:

// Criando um objeto
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "EN"
};
// Adicionar uma nova propriedade
Object.defineProperty(person, "year", {value:"2008"});

Experimente você mesmo

Exemplo 2

Modificar propriedade:

// Criando um objeto
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "EN"
};
// Modificando um atributo
Object.defineProperty(person, "language", {value:"NO"});

Experimente você mesmo

Exemplo 3

// Criando um objeto
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "NO"
};
// Modificando um atributo
Object.defineProperty(person, "language", {
  value: "EN"
  writable: true,
  enumerable: true,
  configurable: true
});
// Enumerando atributos
let txt = "";
for (let x in person) {
  txt += person[x] + "<br>";
}
// Exibir propriedade
document.getElementById("demo").innerHTML = txt;

Experimente você mesmo

Exemplo 4

O próximo exemplo é idêntico ao anterior, mas oculta a propriedade language, tornando-a não enumerável:

// Criando um objeto
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "NO"
};
// Modificando um atributo
Object.defineProperty(person, "language", {
  value: "EN"
  writable: true,
  enumerable: false,
  configurable: true
});
// Enumerando atributos
let txt = "";
for (let x in person) {
  txt += person[x] + "<br>";
}
document.getElementById("demo").innerHTML = txt;

Experimente você mesmo

Exemplo 5

Neste exemplo, um setter e getter são criados para garantir que o atributo language seja atualizado em maiúsculas:

// Criando um objeto
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "NO"
};
// Modificando um atributo
Object.defineProperty(person, "language", {
  get: function() { return language },
  set: function(value) { language = value.toUpperCase() }
});
// Modificando language
person.language = "en";
// Mostrando language
document.getElementById("demo").innerHTML = person.language;

Experimente você mesmo

Exemplo 6

Neste exemplo, o getter é usado para conectar firstName e lastName:

// Criando um objeto
const person = {
  firstName: "Bill",
  lastName: "Gates"
};
// Definindo um Getter
Object.defineProperty(person, "fullName", {
  get: function () { return this.firstName + " " + this.lastName; }
});

Experimente você mesmo

Exemplo 7

Os Getter e Setter do JavaScript são muito adequados para criar contadores:

// Definindo Setter e Getter
Object.defineProperty(obj, "reset", {
  get: function () { this.counter = 0; }
});
Object.defineProperty(obj, "increment", {
  get: function () { this.counter++; }
});
Object.defineProperty(obj, "decrement", {
  get: function () { this.counter--; }
});
Object.defineProperty(obj, "add", {
  set: function (value) { this.counter += value; }
});
Object.defineProperty(obj, "subtract", {
  set: function (value) { this.counter -= value; }
});

Experimente você mesmo

Sintaxe

Object.defineProperty(object, property, descriptor)

parâmetros

Retorno

Suporte do navegador

Object.defineProperty() É uma característica do ECMAScript5 (ES5).

Desde julho de 2013, todos os navegadores modernos suportam completamente o ES5 (JavaScript 2009):