Такие читатели, как вы, помогают поддерживать MUO. Когда вы совершаете покупку по ссылкам на нашем сайте, мы можем получать партнерскую комиссию. Читать далее.

Прокси-объект JavaScript позволяет перехватывать и настраивать поведение другого объекта, не изменяя оригинал.

Используя прокси-объекты, вы можете проверять данные, предоставлять дополнительные функции и управлять доступом к свойствам и функциям.

Узнайте все об использовании прокси-объектов и о том, как их создавать в JavaScript.

Создание прокси-объекта

В JavaScript вы можете создавать прокси-объекты, используя Проксиконструктор. Этот конструктор принимает два аргумента: цель объект, чтобы обернуть прокси вокруг и обработчик объект, свойства которого определяют поведение прокси при выполнении операций.

Он принимает эти аргументы и создает объект, который можно использовать вместо целевого объекта. Этот созданный объект может переопределить основные операции, такие как получение, установка и определение свойств. Вы также можете использовать эти прокси-объекты для регистрации доступа к свойствам и проверки, форматирования или очистки входных данных.

instagram viewer

Например:

константа оригинальныйОбъект = {
фу: "бар"
}

константа обработчик = {
получать: функция(цель, свойство){
возвращаться цель [свойство];
},
набор: функция(цель, свойство, значение){
цель[свойство] = значение;
}
};

константа прокси = новыйПрокси(исходный объект, обработчик)

Этот код создает целевой объект, оригинальныйОбъект, с одним свойством, фуи объект обработчика, обработчик. Объект обработчика содержит два свойства: получать и набор. Эти свойства известны как ловушки.

Ловушка прокси-объекта — это функция, вызываемая всякий раз, когда вы выполняете указанное действие над прокси-объектом. Ловушки позволяют перехватывать и настраивать поведение прокси-объекта. Доступ к свойству из прокси-объекта вызывает получать trap, а изменение свойства или управление им из прокси-объекта вызывает набор ловушка.

Наконец, код создает прокси-объект с Прокси конструктор. Он проходит оригинальныйОбъект и обработчик как целевой объект и обработчик соответственно.

Использование прокси-объектов

Прокси-объекты имеют несколько применений в JavaScript, некоторые из которых перечислены ниже.

Добавление функциональности к объекту

Вы можете использовать прокси-объект, чтобы обернуть существующий объект и добавить новые функции, такие как ведение журнала или обработка ошибок, без изменения исходного объекта.

Чтобы добавить новый функционал, вам нужно использовать Прокси конструктор и определите одну или несколько ловушек для действий, которые вы хотите перехватить.

Например:

константа пользовательский объект = {
имя: "Кеннеди",
фамилия: "Мартинс",
возраст: 20,
};

константа обработчик = {
получать: функция(цель, свойство){
консоль.бревно(«Получение имущества»${свойство}"`);
возвращаться цель [свойство];
},
набор: функция(цель, свойство, значение){
консоль.бревно("Установка свойства"${свойство}" оценивать "${значение}"`);
цель[свойство] = значение;
},
};

константа прокси = новыйПрокси(пользовательский объект, обработчик);

консоль.log(proxy.firstName); // Получение свойства "firstName" Кеннеди
консоль.log (прокси.фамилия); // Получение свойства "lastName" Мартинс
прокси.возраст = 23; // Установка свойства "возраст" оценивать "23"

Этот блок кода добавляет функциональность через прокси-ловушки, получать и набор. Теперь, когда вы пытаетесь получить доступ или изменить свойство пользовательский объект, прокси-объект сначала запишет вашу операцию в консоль, прежде чем получить доступ к свойству или изменить его.

Проверка данных перед установкой их на объект

Вы можете использовать прокси-объекты для проверки данных и обеспечения их соответствия определенным критериям, прежде чем устанавливать их для объекта. Вы можете сделать это, определив логику проверки в набор ловушка в обработчик объект.

Например:

константа пользовательский объект = {
имя: "Кеннеди",
фамилия: "Мартинс",
возраст: 20,
};

константа обработчик = {
получать: функция(цель, свойство){
консоль.бревно(«Получение имущества»${свойство}"`);
возвращаться цель [свойство];
},
набор: функция(цель, свойство, значение){
если (
свойство "возраст" &&
тип значение == "число" &&
значение > 0 &&
значение < 120
) {
консоль.бревно("Установка свойства"${свойство}" оценивать "${значение}"`);
цель[свойство] = значение;
} еще {
бросатьновыйОшибка("Неверный параметр. Пожалуйста, проверьте и исправьте».);
}
},
};

константа прокси = новыйПрокси(пользовательский объект, обработчик);
прокси.возраст = 21;

Этот блок кода добавляет правила проверки в набор ловушка. Вы можете присвоить любое значение возраст собственность на пользовательский объект пример. Но с добавленными правилами проверки вы можете присвоить новое значение свойству age только в том случае, если это число больше 0 и меньше 120. Любое значение, которое вы пытаетесь установить на возраст свойство, которое не соответствует требуемым критериям, вызовет ошибку и напечатает сообщение об ошибке.

Управление доступом к свойствам объекта

Вы можете использовать прокси-объекты, чтобы скрыть определенные свойства объекта. Сделайте это, определив логику ограничения в получать ловушки для свойств, доступ к которым вы хотите контролировать.

Например:

константа пользовательский объект = {
имя: "Кеннеди",
фамилия: "Мартинс",
возраст: 20,
телефон: 1234567890,
электронная почта: "[email protected]",
};

константа обработчик = {
получать: функция(цель, свойство){
если (свойство "телефон" || свойство "электронная почта") {
бросатьновыйОшибка("Доступ к информации запрещен");
} еще {
консоль.бревно(«Получение имущества»${свойство}"`);
возвращаться цель [свойство];
}
},
набор: функция(цель, свойство, значение){
консоль.бревно("Установка свойства"${свойство}" оценивать "${значение}"`);
цель[свойство] = значение;
},
};

константа прокси = новыйПрокси(пользовательский объект, обработчик);

консоль.log(proxy.firstName); // Получение свойства "firstName" Кеннеди
консоль.log (прокси.электронная почта); // Выдает ошибку

Приведенный выше блок кода добавляет определенные ограничения к получать ловушка. Первоначально вы можете получить доступ ко всем доступным свойствам на пользовательский объект. Добавленные правила предотвращают доступ к конфиденциальной информации, такой как электронная почта или телефон пользователя. Попытка получить доступ к любому из этих свойств вызовет ошибку.

Другие прокси-ловушки

получать и набор ловушки являются наиболее распространенными и полезными, но есть еще 11 ловушек JavaScript-прокси. Они есть:

  • применять: применять trap запускается, когда вы вызываете функцию для прокси-объекта.
  • построить: построить trap запускается, когда вы используете новый оператор для создания объекта из прокси-объекта.
  • удалить свойство: удалить свойство ловушка срабатывает, когда вы используете удалить оператор для удаления свойства из прокси-объекта.
  • имеет - имеет ловушка срабатывает, когда вы используете в оператор, чтобы проверить, существует ли свойство в прокси-объекте.
  • собственные ключи - собственные ключи trap запускается, когда вы вызываете либо Object.getOwnPropertyNames или Object.getOwnPropertySymbols функция на прокси-объекте.
  • жетовнпропертидескриптор - жетовнпропертидескриптор trap запускается, когда вы вызываете Object.getOwnPropertyDescriptor функция на прокси-объекте.
  • определить свойство - определить свойство trap запускается, когда вы вызываете Объект.defineProperty функция на прокси-объекте.
  • предотвратитьРасширения - предотвратитьРасширения trap запускается, когда вы вызываете Object.preventExtensions функция на прокси-объекте.
  • isExtensible - isExtensible trap запускается, когда вы вызываете Объект.isExtensible функция на прокси-объекте.
  • getPrototypeOf - getPrototypeOf trap запускается, когда вы вызываете Object.getPrototypeOf функция на прокси-объекте.
  • setPrototypeOf - setPrototypeOf trap запускается, когда вы вызываете Object.setPrototypeOf функция на прокси-объекте.

Как набор и получать ловушки, вы можете использовать эти ловушки, чтобы добавить новые уровни функциональности, проверки и контроля к вашему объекту, не изменяя оригинал.

Минусы прокси-объектов

Прокси-объекты могут быть мощным инструментом для добавления пользовательских функций или проверки объекта. Но они также имеют некоторые потенциальные недостатки. Одним из таких недостатков является сложность отладки, поскольку бывает трудно увидеть, что происходит за кулисами.

Прокси-объекты также могут быть сложны в использовании, особенно если вы с ними не знакомы. Вы должны внимательно рассмотреть эти недостатки, прежде чем использовать прокси-объекты в своем коде.