API Reflect
Proszę przekazywać operacje dalej za pomocą metod Reflect.
API Reflect to bezpłatna lekcja JavaScript Academy na CoddyKit. To lekcja 3 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej JavaScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs JavaScript Academy zawiera 4 lekcji w sumie.
Czym jest Reflect?
Reflect to wbudowany obiekt zawierający metody wykonujące domyślne niskopoziomowe operacje na obiektach: pobieranie, ustawianie, usuwanie i inne.
Jego metody odwzorowują pułapki proxy jeden do jednego, dzięki czemu jest idealnym uzupełnieniem przy tworzeniu poprawnych proxy.
Reflect.get
Reflect.get(target, prop) odczytuje właściwość tak samo jak target[prop], ale w postaci przejrzystego wywołania funkcji.
const obj = { name: 'Ada', age: 36 };
console.log(Reflect.get(obj, 'name'));
console.log(Reflect.get(obj, 'age'));Reflect.set
Reflect.set(target, prop, value) zapisuje właściwość i zwraca true lub false, wskazując, czy operacja się powiodła — dokładnie tak, jak oczekuje tego pułapka set.
const obj = {};
const ok = Reflect.set(obj, 'score', 42);
console.log(ok);
console.log(obj.score);Reflect.has i deleteProperty
Reflect.has odwzorowuje operator in, a Reflect.deleteProperty odwzorowuje operator delete; oba działają jako funkcje zwracające wartości logiczne.
const obj = { a: 1, b: 2 };
console.log(Reflect.has(obj, 'a'));
console.log(Reflect.deleteProperty(obj, 'b'));
console.log(Reflect.has(obj, 'b'));Reflect.ownKeys
Reflect.ownKeys zwraca wszystkie klucze własnych właściwości, w tym symbole i właściwości niewyliczalne, więc jest bardziej kompletne niż Object.keys.
const obj = { a: 1, b: 2 };
Object.defineProperty(obj, 'hidden', { value: 3, enumerable: false });
console.log(Object.keys(obj));
console.log(Reflect.ownKeys(obj));Przekazywanie w proxy
Prawdziwa siła tego rozwiązania polega na tym, że wewnątrz pułapki wywołujesz odpowiadającą jej metodę Reflect, aby wykonać domyślne zachowanie, a następnie dodajesz wokół niego własną logikę.
const proxy = new Proxy({ v: 1 }, {
get(target, prop, receiver) {
console.log('reading ' + prop);
return Reflect.get(target, prop, receiver);
}
});
console.log(proxy.v);Poprawne przekazywanie set
Użycie Reflect.set wewnątrz pułapki set automatycznie zwraca właściwą wartość logiczną, więc nie musisz pamiętać o samodzielnym zwróceniu true.
const proxy = new Proxy({}, {
set(target, prop, value, receiver) {
console.log('writing ' + prop);
return Reflect.set(target, prop, value, receiver);
}
});
proxy.x = 10;
console.log(proxy.x);Dlaczego receiver ma znaczenie
Przekazanie receiver do Reflect.get i Reflect.set gwarantuje, że gettery i settery zostaną uruchomione z właściwym this. Ma to znaczenie, gdy obiekty dziedziczą po sobie.
const base = { get label() { return 'id-' + this.id; } };
const proxy = new Proxy(base, {
get(target, prop, receiver) {
return Reflect.get(target, prop, receiver);
}
});
const child = Object.create(proxy);
child.id = 7;
console.log(child.label);Reflect.apply
Reflect.apply(fn, thisArg, argsArray) wywołuje funkcję z określonym this i tablicą argumentów, stanowiąc przejrzystą alternatywę dla fn.apply.
function greet(greeting, name) {
return greeting + ', ' + name;
}
console.log(Reflect.apply(greet, null, ['Hello', 'Ada']));Reflect.construct
Reflect.construct(Cls, argsArray) tworzy instancję, równoważnie do new Cls(...args), ale przyjmuje tablicę argumentów.
class Point {
constructor(x, y) { this.x = x; this.y = y; }
}
const p = Reflect.construct(Point, [3, 4]);
console.log(p.x, p.y);Dlaczego Reflect ma znaczenie
Reflect udostępnia przewidywalne wersje operacji wewnętrznych obiektów w postaci funkcji i doskonale współpracuje z proxy: każda pułapka przekazuje obsługę do odpowiadającej jej metody Reflect. Rezultatem jest poprawny, minimalny kod proxy. Następnie zastosujesz to wszystko w praktycznych przypadkach użycia.
const audited = new Proxy({ balance: 100 }, {
set(t, p, v, r) {
console.log(p + ': ' + t[p] + ' -> ' + v);
return Reflect.set(t, p, v, r);
}
});
audited.balance = 150;
console.log(audited.balance);Szybkie sprawdzenie
Dlaczego wewnątrz pułapki get należy wywołać Reflect.get(target, prop, receiver) zamiast target[prop]?
Podsumowanie: API Reflect
Poznałeś odpowiednik Proxy:
Reflectudostępnia domyślne operacje w postaci funkcji:get,set,has,deleteProperty,ownKeys.- Jego metody odwzorowują pułapki proxy jeden do jednego.
- Przekazywanie operacji przez
Reflectwraz zreceiverzapewnia poprawne dziedziczenie. Reflect.applyiReflect.constructprzejrzyście wywołują funkcje i tworzą instancje.
Często zadawane pytania
Czy lekcja „API Reflect” jest bezpłatna?
Tak — pełny tekst „API Reflect” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu JavaScript Academy, przejdź na CoddyKit PRO. Kurs JavaScript Academy zawiera 4 lekcji w sumie.
Co nauczysz się w „API Reflect”?
Proszę przekazywać operacje dalej za pomocą metod Reflect. Ćwiczysz JavaScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć JavaScript Academy?
Nie wymagamy żadnego doświadczenia. JavaScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 3 z 4.
Ile czasu zajmuje lekcja „API Reflect”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji JavaScript Academy?
Tak. Każda lekcja JavaScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.