JavaScript Object.defineProperty()

Definition och användning

Object.defineProperty() Metoden används för att lägga till eller ändra egenskaper på objektet.

Object.defineProperty() Metoden tillåter dig att ändra metadata för egenskaper.

Object.defineProperty() Metoden tillåter dig att lägga till getter och setter.

Relaterade metoder:

Object.defineProperty() Lägg till eller ändra egenskaper.

Object.defineProperties() Lägg till eller ändra flera egenskaper.

Object.getOwnPropertyNames() Returnerar alla egenskapsnamn på objektet.

Object.getOwnPropertyDescriptor() Returnerar beskrivningen av egenskapen.

Object.getOwnPropertyDescriptors() Returnerar beskrivningar av alla egenskaper på objektet.

Exempel

Exempel 1

Lägg till egenskap:

// 创建一个对象
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "EN"
};
// Lägg till en ny egenskap
Object.defineProperty(person, "year", {value:"2008"});

Prova själv

Exempel 2

Ändra egenskap:

// 创建一个对象
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "EN"
};
// 修改一个属性
Object.defineProperty(person, "language", {value:"NO"});

Prova själv

Exempel 3

// 创建一个对象
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "NO"
};
// 修改一个属性
Object.defineProperty(person, "language", {
  value: "EN"
  writable: true,
  enumerable: true,
  configurable: true
});
// 枚举属性
let txt = "";
for (let x in person) {
  txt += person[x] + "<br>";
}
// Visa egenskap
document.getElementById("demo").innerHTML = txt;

Prova själv

Exempel 4

Nästa exempel är lika med föregående exempel kod, men döljer egenskapen 'language', så att den inte är enumerable:

// 创建一个对象
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "NO"
};
// 修改一个属性
Object.defineProperty(person, "language", {
  value: "EN"
  writable: true,
  enumerable: false,
  configurable: true
});
// 枚举属性
let txt = "";
for (let x in person) {
  txt += person[x] + "<br>";
}
document.getElementById("demo").innerHTML = txt;

Prova själv

例子 5

此例创建了一个 setter 和 getter,以确保 language 属性的更新为大写:

// 创建一个对象
const person = {
  firstName: "Bill",
  lastName: "Gates"
  language: "NO"
};
// 修改一个属性
Object.defineProperty(person, "language", {
  get: function() { return language },
  set: function(value) { language = value.toUpperCase() }
});
// 修改 language
person.language = "en";
// 显示 language
document.getElementById("demo").innerHTML = person.language;

Prova själv

例子 6

此例使用 getter 将 firstName 和 lastName 连接起来:

// 创建一个对象
const person = {
  firstName: "Bill",
  lastName: "Gates"
};
// 定义一个 Getter
Object.defineProperty(person, "fullName", {
  get: function () { return this.firstName + " " + this.lastName; }
});

Prova själv

例子 7

JavaScript 的 Getter 和 Setter 非常适合创建计数器:

// 定义 Setter 和 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; }
});

Prova själv

Syntaks

Object.defineProperty(objekt, egenskap, beskrivare)

Parameter

Parameter Beskrivning
objekt Obligatorisk. Målobjekt.
egenskap Obligatorisk. Egenskapsnamn.
beskrivare

Obligatorisk. Beskrivning av egenskapsattribut att lägga till eller ändra:

  • value: value
  • writable : true|false
  • enumerable : true|false
  • configurable : true|false
  • get : function
  • set : function

Returvärde

Typ Beskrivning
Object Ändrad objekt.

Webbläsarstöd

Object.defineProperty() Det är egenskaper för ECMAScript5 (ES5).

Från och med juli 2013 stöder alla moderna webbläsare fullt ut ES5 (JavaScript 2009):

Chrome Edge Firefox Safari Opera
Chrome 23 IE/Edge 11 Firefox 21 Safari 6 Opera 15
September 2012 September 2012 April 2013 Juli 2012 Juli 2013