suchen

Heim  >  Artikel  >  Web-Frontend  >  Machen Sie sich in drei Minuten mit der Methode Object.defineProperty() vertraut

Machen Sie sich in drei Minuten mit der Methode Object.defineProperty() vertraut

醉折花枝作酒筹
醉折花枝作酒筹nach vorne
2021-04-23 09:11:311925Durchsuche

Dieser Artikel gibt Ihnen eine detaillierte Einführung in die Methode Object.defineProperty(). Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Machen Sie sich in drei Minuten mit der Methode Object.defineProperty() vertraut

Syntax

Object.defineProperty(obj, prop, descriptor)

Definition

Definieren Sie eine neue Eigenschaft für das Objekt. Sie können die ursprüngliche Eigenschaft ändern!

Parameter

obj Zielobjekt.

prop Der Name der definierten oder geänderten Eigenschaft.

descriptor Eigenschaftsdeskriptor definiert oder geändert. (Die Werte von value, beschreibbar, get und set können nicht gleichzeitig festgelegt werden

Eigenschaftsdeskriptor

konfigurierbar: Boolean –> Ob es konfigurierbar ist

aufzählbar: Boolean – > Ob es aufzählbar ist

Wert: Standardwert

beschreibbar: Boolean --> Ob es umgeschrieben werden kann

/Zugriffs-(Zugriffs-)Deskriptor

get //Die Rückruffunktion berechnet dynamisch den Wert des aktuelles Attribut basierend auf anderen Attributen

set / /Die Rückruffunktion überwacht, ob sich der aktuelle Attributwert geändert hat, und aktualisiert dann andere verwandte Attribute

Rückgabewert

Gibt das bearbeitete Objekt zurück, dh den obj-Parameter

Der folgende Code ist eine einfache Implementierung der bidirektionalen Datenbindung:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <input type="text" id="ipt" />
    <p id="lc"></p>
  </body>
</html>
<script>
  //获取页面元素
  var ipt = document.getElementById("ipt");
  var ps = document.getElementById("lc");

  var obj = { name: "" };

  Object.defineProperty(obj, "name", {
    get() {
      return ipt.value;
    },
    set(newval) {
      ipt.value = newval;
      ps.innerHTML = newval;
    },
  });

  ipt.addEventListener("keyup", function() {
    ps.innerHTML = ipt.value; //数据赋值
  });
</script>

Rendering-Diagrammanzeige:

[Empfohlenes Lernen:

Javascript-Tutorial für Fortgeschrittene]

Das obige ist der detaillierte Inhalt vonMachen Sie sich in drei Minuten mit der Methode Object.defineProperty() vertraut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

JavaScript Object 回调函数 对象
Stellungnahme：
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel：So verwenden Sie die Summenfunktion in Javascript zum SummierenNächster Artikel：So verwenden Sie die Summenfunktion in Javascript zum Summieren

In Verbindung stehende Artikel

Mehr sehen