Heim > Web-Frontend > js-Tutorial > Hauptteil

Können JavaScript-Proxys dynamische Getter und Setter für undefinierte Eigenschaften erstellen?

Patricia Arquette
Freigeben: 2024-10-29 04:49:02
Original
972 Leute haben es durchsucht

 Can JavaScript Proxies Create Dynamic Getters and Setters for Undefined Properties?

Dynamische Getter und Setter in JavaScript

Einführung:

JavaScript bietet flexible Mechanismen für den Zugriff und die Änderung von Eigenschaften durch Getter und Setter. Obwohl bekannt ist, wie Getter und Setter für vordefinierte Eigenschaftsnamen definiert werden, stellt sich die Frage: Ist es möglich, dynamische Getter und Setter zu implementieren, die für undefinierte Eigenschaftsnamen gelten?

Dynamische Getter und Setter mit Proxys (ES6):

Seit ES2015 führt JavaScript Proxys ein, die die Erstellung von Objekten ermöglichen, die als „Fassaden“ für andere Objekte fungieren. Dies ermöglicht das Abfangen und Ändern von Eigenschaftsoperationen, einschließlich Gettern und Settern.

Beispiel:

Der folgende Codeausschnitt demonstriert dynamische Getter und Setter mithilfe von Proxys:

<code class="javascript">"use strict";
if (typeof Proxy == "undefined") {
    throw new Error("This browser doesn't support Proxy");
}
let original = {
    example: "value",
};
let proxy = new Proxy(original, {
    get(target, name, receiver) {
        if (Reflect.has(target, name)) {
            let rv = Reflect.get(target, name, receiver);
            if (typeof rv === "string") {
                rv = rv.toUpperCase();
            }
            return rv;
        }
        return "missing";
    }
});

console.log(`original.example = ${original.example}`); // "original.example = value"
console.log(`proxy.example = ${proxy.example}`);       // "proxy.example = VALUE"
console.log(`proxy.unknown = ${proxy.unknown}`);       // "proxy.unknown = missing"
original.example = "updated";
console.log(`original.example = ${original.example}`); // "original.example = updated"
console.log(`proxy.example = ${proxy.example}`);       // "proxy.example = UPDATED"</code>
Nach dem Login kopieren

In diesem Beispiel:

  • Das Originalobjekt enthält eine Eigenschaft example mit dem Wert „value“.
  • Der Proxy wird als Fassade für Original erstellt, mit der get()-Handler.
  • Der get()-Handler fängt den Eigenschaftszugriff ab. Wenn die Eigenschaft im Original vorhanden ist, wird ihr Wert zurückgegeben. Wenn die Eigenschaft nicht gefunden wird, wird „fehlt“ zurückgegeben.
  • Wenn der Wert der Eigenschaft, auf die zugegriffen wird, eine Zeichenfolge ist, wird sie in Großbuchstaben umgewandelt.
  • Eigenschaftsänderungen über Proxy werden im Original widergespiegelt.
  • Eigenschaften, die im Original nach der Proxy-Erstellung definiert wurden, sind auch über den Proxy zugänglich.

Das obige ist der detaillierte Inhalt vonKönnen JavaScript-Proxys dynamische Getter und Setter für undefinierte Eigenschaften erstellen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage