Так называемый режим прокси заключается в том, чтобы найти замещающий объект для объекта, чтобы получить доступ к исходному объекту.
Причина использования прокси заключается в том, что мы не хотим или не хотим напрямую работать с исходным объектом.Мы используем прокси, чтобы позволить ему выполнять ряд операций над исходным объектом, и мы можем сказать исходному объект после того, как эти вещи сделаны. Как помощники агентов звезд, в которых мы живем.
Давайте возьмем в качестве примера знаменитость, покупающую обувь.
1. Знаменитости сами ходят за обувью.
// 定义一个鞋子类
var Shoes = function(name){
this.name = name;
};
Shoes.prototype.getName = function() {
return this.name;
};
// 定义一个明星对象
var star = {
buyShoes: function(shoes) {
console.log('买到了一双' + shoes.getName());
}
}
star.buyShoes(new Shoes('皮鞋')); // "买到了一双皮鞋"
Конечно, если вы хотите купить обувь, вы обычно оставляете это помощнику.
2. Звезда попросила помощницу купить обувь от его имени.
// 定义一个鞋子类
var Shoes = function(name){
this.name = name;
};
Shoes.prototype.getName = function() {
return this.name;
};
// 定义一个助理对象
var assistant = {
buyShoes: function(shoes) {
star.buyShoes(shoes.getName())
}
};
// 定义一个明星对象
var star = {
buyShoes: function(name) {
console.log('买到了一双' + name);
}
};
assistant.buyShoes(new Shoes('高跟鞋')); // "买到了一双高跟鞋"
Ну, прокси настолько прост, что некоторые студенты могут быть здесь более запутанными, разве результат внедрения прокси не такой же, как и его неиспользование? Да, нужен тот же результат реализации, но прокси для стоимости не усложняет простых вещей, как мы это видим, он используется в особых случаях, а здесь просто для иллюстрации реализации прокси. Вот несколько сценариев использования.
Сценарии использования агента
Продолжая вопрос звезды о покупке обуви выше. В жизни мы будем сталкиваться с магазинами в рабочее время, а вы работаете в рабочее время.Поскольку вам нужно зарабатывать деньги и тратить деньги, вы найдете агента, так же, как приближается Праздник Весны, у вас нет времени или возможности. Чтобы купить билеты, это похоже на поиск дилеров по продаже билетов; как нынешний агент по закупкам, вы не можете поехать за границу, или вы мало знаете о зарубежных странах, поэтому вы можете найти людей, которые могут поехать за границу и знать о зарубежных странах, чтобы помогите купить вещи. Мы знаем, что у каждого магазина есть свои рабочие часы и часы закрытия, здесь мы используем (8:00~20:00) в качестве рабочих часов.
// 定义一个鞋子类
var Shoes = function(name){
this.name = name;
};
Shoes.prototype.getName = function() {
return this.name;
};
// 添加了一个business方法，通过当前的时间来判断是否能买到鞋子。
Shoes.prototype.business = function() {
var curTime = new Date().getHours();
return curTime >= 8 && curTime <= 20 ? that.getName() : '"非营业时间！"';
}
// 定义一个助理对象
var assistant = {
buyShoes: function(shoes) {
star.buyShoes(shoes.getName())
}
};
// 定义一个明星对象
var star = {
buyShoes: function(name) {
console.log('买到了一双' + name);
}
};
assistant.buyShoes(new Shoes('高跟鞋')); // "买到了一双高跟鞋"
агент защиты
Как агент звезды, помощник может не только помочь звезде купить вещи, но также несет ответственность за то, чтобы помочь звезде отфильтровать вещи.Например, если фанат хочет отправить звезде цветы (не все виды цветов), кто-то хочет найти звезду для рекламы (не все виды рекламы поддерживаются).
// 定义一个广告类
var Ad = function(price){
this.price = price;
};
Ad.prototype.getPrice = function() {
return this.price;
};
// 定义一个助理对象
var assistant = {
init: function(ad) {
var money = ad.getPrice();
if(money > 300) {
this.receiveAd(money);
} else {
this.rejectAd();
}
},
receiveAd: function(price) {
star.receiveAd(price);
},
rejectAd: function() {
star.rejectAd();
}
};
// 定义一个明星对象
var star = {
receiveAd: function(price) {
console.log('广告费' + price + '万元');
},
rejectAd: function() {
console.log('拒绝小制作！');
}
};
assistant.init(new Ad(5)); // "拒绝小制作！"
assistant.init(new Ad(500)); // "广告费500万元"
Типа такая звезда уполномочивает помощника, например: какую рекламу можно подобрать, какие цветы можно подобрать и так далее. Таким образом, обработка некоторых дел передается помощникам или агентам, а сам он находится за кадром, что, несомненно, снижает для него ненужные хлопоты, так что звезды находятся в состоянии защиты. В реальной жизни есть много примеров, и это также относительно распространено в нашей разработке языков программирования, особенно с точки зрения сети и процесса.Я думаю, что студенты, которые занимались разработкой nodjs, столкнутся с этим более или менее.
виртуальный агент
В процессе разработки мы частоnew Ad('5')Операция создания экземпляра этого объекта выполняется внутри функции, что уменьшит ненужные накладные расходы на создание экземпляра объекта и приведет к пустой трате ресурсов. В этом случае мы называем это виртуальным прокси.
Далее представлен общий виртуальный агент — предварительная загрузка образа.
Предварительная загрузка изображения — распространенная технология интерфейса.Поскольку изображение слишком большое или сеть плохая, мы не будем напрямую устанавливать атрибут src в узел тега img, а будем использовать загружаемое изображение в качестве заполнителя, а затем использовать асинхронный режим. Метод загрузки изображения.После того, как изображение загружено, мы заполним его в узле img.
var preImage = (function() {
var imgNode = document.createElement('img');
document.body.appendChild(imgNode);
var img = new Image;
img.onload = function() {
imgNode.src = img.src;
};
return {
setSrc: function(src) {
imgNode.src = '../loading.gif';
img.src = src;
}
}
})();
preImage.setSrc('https://cn.bing.com/az/hprichbg/rb/TadamiTrain_ZH-CN13495442975_1920x1080.jpg');
На данный момент реализована функция предварительной загрузки изображения, но она часто отражает, насколько лучше тот или иной фрагмент кода, зависит от того, легко ли поддерживать ваш код, особенно для объемного кода. Первый момент заключается в том, что этот код не соответствует единой ответственности, функцию, отвечающую за предварительную загрузку изображения и обработку элементов img, мы помещаем в тело функции, тем более не отделяя измененную часть кода от неизменной части; Дело в том, что в будущем скорость нашей сети будет очень хорошей, и нам больше не придется беспокоиться об эффекте отображения, вызванном плохой сетью, поэтому функция предварительной загрузки изображений будет удалена.
Мы можем попробовать использовать прокси для достижения, код выглядит следующим образом:
var myImage = (function() {
var imgNode = document.createElement('img');
document.body.appendChild(imgNode);
return {
setSrc: function(src) {
imgNode.src = src;
}
}
})();
var preImage = (function() {
var img = new Image;
img.onload = function() {
myImage.setSrc = img.src;
};
return {
setSrc: function(src) {
myImage.setSrc('../loading.gif');
img.src = src;
}
}
})();
preImage.setSrc('https://cn.bing.com/az/hprichbg/rb/TadamiTrain_ZH-CN13495442975_1920x1080.jpg');
Таким образом мы разделяем предварительную загрузку изображения и настройку src для узла элемента img.
Согласованность проксируемых и проксируемых объектов
Поскольку прокси должен достигать того же эффекта, что и фактическая обработка прокси-объекта, при реализации прокси-объекта исходный объект имеет те же методы, что и прокси-объект, что может гарантировать, что пользователь работает с прокси-объектом, как если бы он был работа с исходным объектом.
кеширующий прокси
Cache proxy — добавить прокси в кеш, ниже приведен пример суммирования:
var multAdd = function() {
var res = 0;
for (var i = 0, l = arguments.length; i < l; i++) {
res = res + arguments[i]
}
return res;
};
var proxyAdd = (function() {
var cache = {};
return function() {
var args = Array.prototype.join.call(arguments, ',');
if(args in cache) {
return cache[args];
}
return caches[args] = multAdd.apply(this, arguments);
}
})();
proxyAdd(1, 2, 3); // 6
proxyAdd(1, 2, 3); // 6
Конечно, мы можем реализовать суммирование кеша без прокси, но для достижения единой ответственности мы можем сделать так, чтобы multAdd реализовывал суммирование, а кеш реализовывался в прокси.
Конечно, есть и другие классифицированные агенты, такие как интеллектуальные агенты, удаленные агенты. Но в JavaScript мы используем больше всего, и самые распространенные из них — это виртуальные прокси и кеширующие прокси.