Tässä opetusohjelmassa opit JavaScript-välityspalvelimista esimerkkien avulla.
JavaScriptissä välityspalvelimia (välityspalvelinobjektia) käytetään objektin käärimiseen ja erilaisten toimintojen, kuten lukeminen, lisäys, vahvistus jne., Määrittelemiseen uudelleen välityspalvelimen avulla. Välityspalvelimen avulla voit lisätä mukautetun toiminnan objektiin tai toimintoon.
Välityspalvelinobjektin luominen
Välityspalvelimen syntakse on:
new Proxy(target, handler);
Tässä,
new Proxy()
- rakentaja.target
- kohde / toiminto, jonka haluat välittäähandler
- osaa määrittää objektin mukautetun käyttäytymisen uudelleen
Esimerkiksi,
let student1 = ( age: 24, name: "Felix" ) const handler = ( get: function(obj, prop) ( return obj(prop) ? obj(prop) : 'property does not exist'; ) ) const proxy = new Proxy(student1, handler); console.log(proxy.name); // Felix console.log(proxy.age); // 24 console.log(proxy.class); // property does not exist
Tässä get()
menetelmää käytetään objektin ominaisuusarvon käyttämiseen. Ja jos ominaisuutta ei ole käytettävissä objektissa, se palauttaa ominaisuutta ei ole.
Kuten näette, voit käyttää välityspalvelinta uusien toimintojen luomiseen objektille. Tapaus voi syntyä, kun haluat tarkistaa, onko objektilla tietty avain, ja suorittaa toiminto kyseisen avaimen perusteella. Tällaisissa tapauksissa voidaan käyttää valtakirjoja.
Voit ohittaa myös tyhjän ohjaajan. Kun tyhjä käsittelijä välitetään, välityspalvelin käyttäytyy alkuperäisenä objektina. Esimerkiksi,
let student = ( name: 'Jack', age: 24 ) const handler = ( ); // passing empty handler const proxy1 = new Proxy(student, ()); console.log(proxy1); // Proxy (name: "Jack", age: 24) console.log(proxy1.name); // Jack
Välityspalvelinkäsittelijät
Välityspalvelin tarjoaa kaksi käsittelijämenetelmää get()
ja set()
.
get () -käsittelijä
get()
Menetelmää, jota käytetään ominaisuuksia kohdeobjektin. Esimerkiksi,
let student = ( name: 'Jack', age: 24 ) const handler = ( // get the object key and value get(obj, prop) ( return obj(prop); ) ) const proxy = new Proxy(student, handler); console.log(proxy.name); // Jack
Tässä get()
menetelmä ottaa kohteen ja ominaisuuden parametreiksi.
set () -käsittelijä
set()
Menetelmää käytetään asettamaan objektin arvon. Esimerkiksi,
let student = ( name: 'John' ) let setNewValue = ( set: function(obj, prop, value) ( obj(prop) = value; return; ) ); // setting new proxy let person = new Proxy(student, setNewValue); // setting new key/value person.age = 25; console.log(person); // Proxy (name: "John", age: 25)
Tässä age
opiskelijaobjektiin lisätään uusi ominaisuus .
Välityspalvelimen käyttö
1. Vahvistamista varten
Vahvistamiseen voi käyttää välityspalvelinta. Voit tarkistaa avaimen arvon ja suorittaa toiminnon kyseisen arvon perusteella.
Esimerkiksi,
let student = ( name: 'Jack', age: 24 ) const handler = ( // get the object key and value get(obj, prop) ( // check condition if (prop == 'name') ( return obj(prop); ) else ( return 'Not allowed'; ) ) ) const proxy = new Proxy(student, handler); console.log(proxy.name); // Jack console.log(proxy.age); // Not allowed
Tässä vain opiskelijaobjektin nimiominaisuus on käytettävissä. Muuten se palauttaa Ei sallittu.
2. Objektin vain luku -näkymä
Saattaa olla aikoja, jolloin et halua antaa muiden tehdä muutoksia objektiin. Tällaisissa tapauksissa voit tehdä välityspalvelimen avulla objektin vain luettavaksi. Esimerkiksi,
let student = ( name: 'Jack', age: 23 ) const handler = ( set: function (obj, prop, value) ( if (obj(prop)) ( // cannot change the student value console.log('Read only') ) ) ); const proxy = new Proxy(student, handler); proxy.name = 'John'; // Read only proxy.age = 33; // Read only
Yllä olevassa ohjelmassa objektia ei voi mutatoida millään tavalla.
Jos yritetään muunnella kohdetta millään tavalla, saat vain merkkijonon, jossa lukee vain luku.
3. Sivuvaikutukset
Voit käyttää välityspalvelinta kutsumaan toisen toiminnon, kun ehto täyttyy. Esimerkiksi,
const myFunction = () => ( console.log("execute this function") ); const handler = ( set: function (target, prop, value) ( if (prop === 'name' && value === 'Jack') ( // calling another function myFunction(); ) else ( console.log('Can only access name property'); ) ) ); const proxy = new Proxy((), handler); proxy.name = 'Jack'; // execute this function proxy.age = 33; // Can only access name property
JavaScript-välityspalvelin otettiin käyttöön JavaScript ES6 -versiosta . Jotkin selaimet eivät välttämättä tue täysin sen käyttöä. Lisätietoja on JavaScript-välityspalvelimessa.