資訊專欄INFORMATION COLUMN
摘要：面向?qū)ο笤O(shè)計(jì)里的設(shè)計(jì)模式之代理模式，相信很多朋友已經(jīng)很熟悉了。代表當(dāng)前執(zhí)行方法的實(shí)例，即方法調(diào)用者。代表具體的方法名稱?，F(xiàn)在我們?cè)俅握{(diào)用，傳入構(gòu)造器返回的代理對(duì)象打印輸出，代理邏輯生效了和的一樣優(yōu)雅地實(shí)現(xiàn)了代理設(shè)計(jì)模式。
面向?qū)ο笤O(shè)計(jì)里的設(shè)計(jì)模式之Proxy（代理）模式，相信很多朋友已經(jīng)很熟悉了。比如我之前寫過代理模式在Java中實(shí)現(xiàn)的兩篇文章：
Java代理設(shè)計(jì)模式(Proxy)的四種具體實(shí)現(xiàn)：靜態(tài)代理和動(dòng)態(tài)代理
Java動(dòng)態(tài)代理之InvocationHandler最簡單的入門教程
其實(shí)和Java一樣，JavaScript從語言層面來講，也提供了對(duì)代理這個(gè)設(shè)計(jì)模式的原生支持。我們用一個(gè)不到100行代碼的例子來看看吧。
下面的代碼創(chuàng)建了一個(gè)名叫Jerry的Employee對(duì)象，然后用函數(shù)hireEmployee雇用該Employee進(jìn)行JavaScript開發(fā)：
function Employee(name){
this.name = name;
};
Employee.prototype.work = function(language){
console.log(this.name + " is developing with: " + language);
}
let jerry = new Employee("Jerry");
function hireEmployee(employee, language){
employee.work(language);
}
hireEmployee(jerry, "JavaScript");
打印輸出：
Jerry is developing with: JavaScript
現(xiàn)在Jerry在他的業(yè)余時(shí)間里想學(xué)習(xí)一些其他的編程語言，但是不想影響自己的本職工作。用技術(shù)語言來講，就是希望Employee原型方法work執(zhí)行時(shí)，打印一行額外的信息，但是不允許修改Employee函數(shù)和Employee.prototype.work本身。這時(shí)Proxy這種代理模式就派上用場了。
我們?yōu)閣ork方法創(chuàng)建一個(gè)代理邏輯：
var proxyLogic = {
get: function(target, name) {
if( name == "work"){
var oriFun = target[name].bind(target);
return function(language){
oriFun(language);
console.log("and also study other language in spare time");
}
}
}
}
;
重點(diǎn)看第二行的get方法。兩個(gè)輸入?yún)?shù)，target和name。Target代表當(dāng)前執(zhí)行方法的實(shí)例，即方法調(diào)用者。Name代表具體的方法名稱。第4行我們把原始方法取出來，存放到變量oriFun里。第五行返回一個(gè)新的JavaScript函數(shù)，該函數(shù)體的實(shí)現(xiàn)邏輯為首先在第六行調(diào)用原始方法，然后在第七行執(zhí)行額外的邏輯。
大家在回憶我之前介紹Java InvocationHandler實(shí)現(xiàn)動(dòng)態(tài)代理的文章：
Java動(dòng)態(tài)代理之InvocationHandler最簡單的入門教程
是不是思路完全一樣？都是在代理邏輯里調(diào)用原始方法，然后再執(zhí)行額外的代碼。
這個(gè)proxyLogic生成后，怎么把它同我們?cè)嫉男枰淮淼拇a關(guān)聯(lián)起來呢？
只需要1行代碼：
var jerryProxy = new Proxy(jerry, proxyLogic );
Proxy函數(shù)是JavaScript提供的原生代理構(gòu)造器，需要兩個(gè)輸入?yún)?shù)：
第一個(gè)輸入?yún)?shù)是我們的Employee實(shí)例，即需要被代碼的對(duì)象實(shí)例，第二個(gè)輸入?yún)?shù)是我們開發(fā)好的代理邏輯。返回的即是裝配好的代理對(duì)象，該代理對(duì)象的work方法實(shí)現(xiàn)在第二個(gè)輸入?yún)?shù)里。
現(xiàn)在我們?cè)俅握{(diào)用hireEmployee，傳入Proxy構(gòu)造器返回的代理對(duì)象：
hireEmployee(jerryProxy, "JavaScript");
打印輸出，代理邏輯生效了：
和Java的Invocation一樣優(yōu)雅地實(shí)現(xiàn)了代理設(shè)計(jì)模式。
使用Proxy代理設(shè)計(jì)模式的一個(gè)實(shí)際例子，請(qǐng)參考我的文章：
巧用代理設(shè)計(jì)模式(Proxy Design Pattern)改善前端圖片加載體驗(yàn)
要獲取更多Jerry的原創(chuàng)技術(shù)文章，請(qǐng)關(guān)注公眾號(hào)"汪子熙"或者掃描下面二維碼:
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/98587.html
摘要：為了便于您更清晰的理解的體系架構(gòu)，在這里我將為您展示年開發(fā)者知識(shí)圖譜，它包含了所有開發(fā)過程中的關(guān)鍵部分。在數(shù)據(jù)展示前端導(dǎo)入導(dǎo)出圖表面板數(shù)據(jù)綁定等場景無需大量代碼開發(fā)和測(cè)試，可極大節(jié)省企業(yè)研發(fā)成本并降低交付風(fēng)險(xiǎn)。 作為 Vue 的初學(xué)者，您或許已經(jīng)聽過很多關(guān)于它的專業(yè)術(shù)語了，例如：單頁面應(yīng)用程序、異步組件、服務(wù)器端呈現(xiàn)等，您可能還聽過和Vue經(jīng)常一起被提到的工具和庫，如Vuex、Webp...
摘要：網(wǎng)上有很多前端的學(xué)習(xí)路徑文章，大多是知識(shí)點(diǎn)羅列為主或是資料的匯總，數(shù)據(jù)量讓新人望而卻步。天了解一個(gè)前端框架。也可以關(guān)注微信公眾號(hào)曉舟報(bào)告，發(fā)送獲取資料，就能收到下載密碼，網(wǎng)盤地址在最下方，獲取教程和案例的資料。 前言 好的學(xué)習(xí)方法可以事半功倍，好的學(xué)習(xí)路徑可以指明前進(jìn)方向。這篇文章不僅要寫學(xué)習(xí)路徑，還要寫學(xué)習(xí)方法，還要發(fā)資料，干貨滿滿，準(zhǔn)備接招。 網(wǎng)上有很多前端的學(xué)習(xí)路徑文章，大多是知...
摘要：用函數(shù)式編程對(duì)進(jìn)行斷舍離當(dāng)從業(yè)的老司機(jī)學(xué)會(huì)函數(shù)式編程時(shí)，他扔掉了的特性，也不用面向?qū)ο罅?，最后發(fā)現(xiàn)了真愛啊作用域和閉包作用域和閉包在里非常重要。旨在幫助非函數(shù)式編程的同學(xué)，能快速切入到函數(shù)式編程的理念。 1、用函數(shù)式編程對(duì)JavaScript進(jìn)行斷舍離 當(dāng)從業(yè)20的JavaScript老司機(jī)學(xué)會(huì)函數(shù)式編程時(shí)，他扔掉了90%的特性，也不用面向?qū)ο罅耍詈蟀l(fā)現(xiàn)了真愛?。。?！ https:/...
摘要：用函數(shù)式編程對(duì)進(jìn)行斷舍離當(dāng)從業(yè)的老司機(jī)學(xué)會(huì)函數(shù)式編程時(shí)，他扔掉了的特性，也不用面向?qū)ο罅?，最后發(fā)現(xiàn)了真愛啊作用域和閉包作用域和閉包在里非常重要。旨在幫助非函數(shù)式編程的同學(xué)，能快速切入到函數(shù)式編程的理念。 1、用函數(shù)式編程對(duì)JavaScript進(jìn)行斷舍離 當(dāng)從業(yè)20的JavaScript老司機(jī)學(xué)會(huì)函數(shù)式編程時(shí)，他扔掉了90%的特性，也不用面向?qū)ο罅?，最后發(fā)現(xiàn)了真愛啊！?。?https:/...
摘要：用函數(shù)式編程對(duì)進(jìn)行斷舍離當(dāng)從業(yè)的老司機(jī)學(xué)會(huì)函數(shù)式編程時(shí)，他扔掉了的特性，也不用面向?qū)ο罅?，最后發(fā)現(xiàn)了真愛啊作用域和閉包作用域和閉包在里非常重要。旨在幫助非函數(shù)式編程的同學(xué)，能快速切入到函數(shù)式編程的理念。 1、用函數(shù)式編程對(duì)JavaScript進(jìn)行斷舍離 當(dāng)從業(yè)20的JavaScript老司機(jī)學(xué)會(huì)函數(shù)式編程時(shí)，他扔掉了90%的特性，也不用面向?qū)ο罅?，最后發(fā)現(xiàn)了真愛?。。。?https:/...
閱讀 1686·2019-08-30 15:55
閱讀 997·2019-08-30 15:44
閱讀 892·2019-08-30 10:48
閱讀 2064·2019-08-29 13:42
閱讀 3205·2019-08-29 11:16
閱讀 1335·2019-08-29 11:09
閱讀 2079·2019-08-26 11:46
閱讀 635·2019-08-26 11:44
