80. Reflect

JavaScript: Мозги. Урок: Reflect

Reflect — это встроенный объект в JavaScript, предоставляющий методы для перехвата и настройки базовых операций языка. Он позволяет нам более гибко управлять поведением объектов и функций.

Что такое Reflect?

Представьте, что вы хотите не просто вызывать методы объекта, а перехватывать вызовы, проверять аргументы или даже изменять результат. Reflect дает вам эту возможность. Он предоставляет статические методы, которые соответствуют операторам языка (например, delete, get, set) и позволяют контролировать их поведение.

Основные методы Reflect

Вот некоторые из наиболее полезных методов Reflect:

• Reflect.get(target, propertyKey[, receiver]): Получает значение свойства объекта.
• Reflect.set(target, propertyKey, value[, receiver]): Устанавливает значение свойства объекта.
• Reflect.has(target, propertyKey): Проверяет, существует ли свойство в объекте.
• Reflect.deleteProperty(target, propertyKey): Удаляет свойство из объекта.
• Reflect.construct(target, argumentsList[, newTarget]): Создает новый объект, используя конструктор.
• Reflect.apply(target, thisArgument, argumentsList): Вызывает функцию с заданным this и аргументами.
• Reflect.defineProperty(target, propertyKey, attributes): Определяет новое свойство или изменяет существующее.

Примеры кода

Reflect.get

const person = { name: 'Alice', age: 30 };
const name = Reflect.get(person, 'name');
console.log(name); // Вывод: Alice

// Reflect.set
const obj = {};
Reflect.set(obj, 'property', 'value');
console.log(obj.property); // Вывод: value

// Reflect.has
const data = { key1: 'value1' };
const hasKey1 = Reflect.has(data, 'key1');
const hasKey2 = Reflect.has(data, 'key2');
console.log(hasKey1); // Вывод: true
console.log(hasKey2); // Вывод: false

// Reflect.deleteProperty
const myObj = { a: 1, b: 2 };
Reflect.deleteProperty(myObj, 'a');
console.log(myObj); // Вывод: { b: 2 }

// Reflect.construct
class MyClass {
  constructor(name) {
    this.name = name;
  }
}
const instance = Reflect.construct(MyClass, ['Bob']);
console.log(instance.name); // Вывод: Bob

// Reflect.apply
function greet(greeting) {
  return `${greeting}, ${this.name}!`;
}
const person2 = { name: 'Charlie' };
const message = Reflect.apply(greet, person2, ['Hello']);
console.log(message); // Вывод: Hello, Charlie!

// Reflect.defineProperty
const empty = {};
Reflect.defineProperty(empty, 'age', {
  value: 40,
  writable: false,
  enumerable: true,
  configurable: false
});
console.log(empty.age); // Вывод: 40
//empty.age = 41; // TypeError: Cannot assign to read only property 'age' of object '#<Object>'

Жизненный пример

Reflect часто используется в прокси-объектах (Proxy). Proxy позволяют перехватывать и настраивать основные операции с объектами. Reflect предоставляет стандартные реализации этих операций, которые можно использовать внутри обработчиков Proxy.

Например, фреймворки, такие как Vue.js и MobX, активно используют Proxy и Reflect для отслеживания изменений в данных и автоматического обновления пользовательского интерфейса. Proxy позволяют перехватывать операции чтения и записи свойств, а Reflect используется для выполнения этих операций по умолчанию или с дополнительной логикой.

Представьте, что вам нужно логировать каждое изменение свойства объекта:

const target = {
    message1: "hello",
    message2: "everyone"
};

const handler = {
    set(target, key, value) {
        console.log(`Setting property "${key}" to "${value}"`);
        return Reflect.set(target, key, value); // Используем Reflect для стандартной операции
    }
};

const proxy = new Proxy(target, handler);

proxy.message1 = "hi"; // Вывод: Setting property "message1" to "hi"
console.log(target.message1); // Вывод: hi

Ключевые моменты

• Reflect предоставляет методы для перехвата и настройки базовых операций языка.
• Он часто используется вместе с Proxy.
• Методы Reflect соответствуют операторам языка.
• Reflect может быть использован для валидации, логирования и других целей.
• Фреймворки, такие как Vue.js и MobX, используют Reflect для реализации реактивности.

Интерактивный пример