Proxyji JavaScript

V tej vadnici boste s pomočjo primerov spoznali proxyje JavaScript.

V JavaScript se proxyji (objekt proxy) uporabljajo za zavijanje predmeta in ponovno definiranje različnih operacij v objekt, kot so branje, vstavljanje, preverjanje itd. Proxy vam omogoča, da predmetu ali funkciji dodate vedenje po meri.

Ustvarjanje objekta proxy

Sintaksa proxy je:

 new Proxy(target, handler);

Tukaj,

  • new Proxy() - konstruktor.
  • target - objekt / funkcijo, ki jo želite zastopiti
  • handler - lahko na novo opredeli vedenje predmeta po meri

Na primer

 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

Tu se get()metoda uporablja za dostop do vrednosti lastnosti predmeta. Če lastnost v objektu ni na voljo, vrne lastnost, ki ne obstaja.

Kot lahko vidite, lahko s pomočjo posrednika ustvarite nove operacije za objekt. Lahko se pojavi primer, ko želite preveriti, ali ima predmet določen ključ, in na podlagi tega ključa izvesti dejanje. V takih primerih se lahko uporabijo pooblaščenci.

Podate lahko tudi prazen vodnik. Ko se posreduje prazen obdelovalec, se proxy obnaša kot izvirni objekt. Na primer

 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

Proxy upravljavci

Proxy ponuja dva načina obdelave get()in set().

get () vodnik

get()Metoda se uporablja za dostop do lastnosti ciljnega objekta. Na primer

 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

Tu get()metoda za svoje parametre vzame objekt in lastnost.

set () obdelovalec

set()Metoda se uporablja za določitev vrednosti predmeta. Na primer

 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)

Tu ageje predmetu študenta dodana nova lastnost .

Uporaba pooblastila

1. Za potrditev

Za preverjanje veljavnosti lahko uporabite proxy. Na tej vrednosti lahko preverite vrednost ključa in izvedete dejanje.

Na primer

 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

Tu je dostopna samo lastnost imena študentskega predmeta. V nasprotnem primeru se vrne Ni dovoljeno.

2. Pogled predmeta samo za branje

Včasih se zgodi, da drugim ne želite dovoliti spreminjanja predmeta. V takih primerih lahko s strežnikom proxy naredite predmet samo berljiv. Na primer

 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

V zgornjem programu ni mogoče na noben način mutirati predmeta.

Če nekdo poskuša mutirati objekt na kakršen koli način, boste prejeli samo niz z besedilom Samo za branje.

3. Neželeni učinki

Če je pogoj izpolnjen, lahko s pomočjo posrednika pokličete drugo funkcijo. Na primer

 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

Proxy JavaScript je bil predstavljen iz različice JavaScript ES6 . Nekateri brskalniki morda ne podpirajo v celoti njegove uporabe. Če želite izvedeti več, obiščite proxy JavaScript.

Zanimive Članki...