JavaScript:AOP實現

来源:https://www.cnblogs.com/f1194361820/archive/2017/12/29/8144558.html
-Advertisement-
Play Games

AOP的概念,使用過Spring的人應該都不陌生了。Dojo中,也是支持AOP的。對於JavaScript的其他框架、庫不知道有沒有AOP的支持。相信即便沒有支持,也不會太遠了。下麵就介紹一下使用JavaScript實現AOP。 AOP的思想就是在目標方法前後加入代碼: var result=nul ...


AOP的概念,使用過Spring的人應該都不陌生了。Dojo中,也是支持AOP的。對於JavaScript的其他框架、庫不知道有沒有AOP的支持。相信即便沒有支持,也不會太遠了。下麵就介紹一下使用JavaScript實現AOP

 

       AOP的思想就是在目標方法前後加入代碼:

var result=null;

try{

before();

result = targetMethod(params);

}(catch e){

error();

}finlly{

    after();

}

return result;

 

 

JavaScript中要達到AOP的效果可以利用apply(ctx,arguments)來達到目的,請看下麵demo

這是一個原始的代碼:

            function Person(options){
                options = options ? options : {};
                this.id = options.id;
                this.age = options.age>0 ? options.age:0;
            }
            Person.prototype.show=function(){
                console.log("id: "+this.id + " age: "+ this.age);
            };
            var p = new Person({
                id:'test1',
                age:1
            });
            p.show();

 

  

現在想要對show方法植入代碼,利用apply這樣寫就OK了:

        var targetFunc = Person.prototype.show;
            var proxyFunc  = function(){
                var ctx = this;
                console.log("before ...");
                targetFunc.apply(ctx, arguments);
                console.log("after ...");
            }
            Person.prototype.show = proxyFunc;
            p = new Person({
                id:"test2",
                age:2
            });
            p.show();

 

 

如果要對各種方法植入,這樣寫肯定是不方便了,所以呢,將這個代碼織入的過程提成一個通用的工具:

            function Interceptor(){
            }
            Interceptor.prototype.before = function(callContext, params){
                console.log("before... ", callContext, params);
            }
            Interceptor.prototype.after = function(callContext, params){
                console.log("after... ", callContext, params);
            }
            Interceptor.prototype.error = function(callContext, params){
                console.log("error... ", callContext, params);
            }
            
            var InjectUtil = (function(){
                function inject(obj, methodName, interceptor){
                    var targetFun = obj[methodName];
                    if(typeof targetFun == "function"){
                        var proxyFun = genProxyFun(targetFun, interceptor);
                        obj[methodName] = proxyFun;
                    }
                }
                
                function genProxyFun(targetFun, interceptor){
                    var proxyFunc = function(){
                        var ctx = this;
                        var result = null;
                        interceptor.before(ctx, arguments);
                        try{
                             result= targetFunc.apply(ctx, arguments);
                        }catch(e){
                            interceptor.error(ctx, arguments);
                        }finally{
                            interceptor.after(ctx, arguments);
                        }
                        return result;
                    };
                    return proxyFunc;
                };
                
                return {
                    inject:inject
                }
            })();
            
        

 


 

 

測試:

 

           Person.prototype.show=function(){
                console.log("id: "+this.id + " age: "+ this.age);
            };
            InjectUtil.inject(Person.prototype,"show",new Interceptor());
            
            var p = new Person({
                id:"test3",
                age:3
            });
            p.show();

 

  

 

 

 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 類選擇器相容性 getbyclass()類選擇器,在IE8及以下均不可用。 // 類選擇器的相容性 function getbyclass(parentName,Name){ var parentName=document.getElementById(parentName); // 通過標簽名通配... ...
  • 無聊弄了這個東西,還是發表出來吧 導入包 實體類 資料庫連接 資料庫操作 service層數據操作 網頁對service層可視化實現 model package com.ij34.model; public class article { private int id; private String ...
  • 作者網站原文:http://hawkzz.com/blog/blog/1514542087911 簡介 我們開發不可能只寫一個頁面,每次都要寫很多頁面,這時為了開發效率,我們使用前端自動化工具webpack,那麼webpack是如何打包頁面的呢?又是如何打包多頁面的呢? 單頁面打包 我們知道要打包單 ...
  • 前言 經過2個多月的艱苦奮鬥,app的第一個版本已經快完工了,期間遇到了太多的坑,作為一個喜歡分享的人,我當然不會吝嗇分享這爬坑歷程。不要問我有多坑,我會告訴你很多,很多..... 過去一直從事.net web開發工作,直到幾個月前,公司需要開發一個h5+,於是我這樣的全能型選手自然而然就被派去搞w ...
  • 這個需求場景很常見,但好像到目前還沒有一個正統的做法,以至於一搜這個問題,出來的招數五花八門,典型的包括: 給body上overflow:hidden,fixed什麼的。問題在於:手機端可能沒用,或者會讓頁面回到頂部~影響體驗 簡單粗暴的屏蔽touchmove。問題在於:彈出層內部需要滾動就不行 張 ...
  • 1:concat 2:join 3:pop 4:push 5:reverse 6:shift 7:slice 8:unshift 9:splice ...
  • 還是老樣子,先啰嗦一點前言。 最近各種事務纏身,所以也就隔了比較長的時間才開始碼這篇文。希望不會這麼快就過氣。 好了,接下來就開始碼代碼。(寫到中途,突然感覺到的。本篇設計大量初中物理知識,請懷念的往下看) 這次不像之前,是已經寫好的文件,拿出來解析一波,就糊弄出來了一篇隨筆。總之,我就一邊的編代碼 ...
  • 不廢話,直接看代碼,需要的根據需求完善。 例:getKeyCode('a') 返回:65 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...