前言

本意不想用太長的篇幅，來闡述這個話題。但是有些概念和設計思路有必要講清楚，以便于搞清楚其深層次的內在邏輯。這是我一直遵從的“知其然，知其所以然”的原則。首先，本文將簡單的闡述一下概念；進而，舉例一起探討一下前端AOP實現方式，以及隨著前端語言ES5、ES6、Typescript的發展，實現方式的演變；最后，一起了解一下實際項目中AOP的應用場景、相關框架以及開發模式。

什么是AOP?

AOP為Aspect Oriented Programming的縮寫，意為：面向切面編程。主要意圖是將日志記錄，性能統計，安全控制，事務處理，異常處理等代碼從業務邏輯代碼中劃分出來，將它們獨立到非指導業務邏輯的方法中，進而改變這些行為的時候不影響業務邏輯的代碼。

簡而言之，就是“優雅”的把“輔助功能邏輯”從“業務邏輯”中分離解耦。

簡單說一下AOP中的一些概念

確切說是其實是AspectJ中的相關概念。AspectJ是一個擴展了Java語言的面向切面的框架。其優秀的設計思想值得我們參考學習。

AspectJ的主要相關概念有下面這些:

• 連接點（Joinpoint）：表示在程序中明確定義的點，典型的包括方法調用，對類成員的訪問以及異常處理程序塊的執行等等
• 切入點（Pointcut）：表示一組Joinpoint，這些Joinpoint或是通過邏輯關系組合起來，或是通過通配、正則表達式等方式集中起來，它定義了將要放置增強Advice的地方。比如"所有類的submit和reset方法調用執行”
• 切面（Aspect）：由切點和增強組成，既包含了增強邏輯的具體實現和連接點的定義
• 通知/增強（Advice）：具體的增強邏輯實現。通常依據放置的地方不同，可分為前置通知（Before）、后置返回通知（AfterReturning）、后置異常通知（AfterThrowing）、后置通知（After）與圍繞通知（Around）5種
• 織入（Weaving）：將切面應用到目標對象從而創建一個新的代理對象的過程

為了便于理解，我們可以把一個業務流程比作一個面包，那么面包切片就是一個業務模塊或者功能。類似于“某個切面的前面”，“某個切片的后面”這種描述叫做連接點（Joinpoint）；把花生醬、面包、生菜打包成一個獨立模塊進行邏輯處理，就是一個切面（Aspect）；切面可以定義通知（Advice）、切入點(Pointcut)也即放入通知的連接點；把切面跟面包結合，從而制成三明治這個過程叫做織入（Weaving）。

早期前端AOP的簡單實現

多數的前端的編程思想、設計模式、框架以及工具，都是參考服務端已經應用成熟的設計思路實現的，AOP也不例外。我們前面已經講過一些AspectJ的相關概念。很明顯，下面我們打算參照其用法，逐步實現前端AOP編程。

通過前面對AspectJ的概念的分析，可以得出一個簡略的總結：AOP編程就是在不破壞原有代碼的基礎上，在原執行動作之前或者之后，加入一段自定義的動作。這里的“原有動作”是函數，“增強的動作”也是函數，把他們打包成一個動作也是函數。顯然，基于javascript語言的特性，函數式編程是實現前端AOP編程的最佳方式。

看下面的簡單實現：

/**

調用執行：

function

執行結果

這里面通過傳參匹配到的"oldFn的調用執行"對應切入點(PointCut)；before和after對應通知/增強(Advice)；創造newFn的過程可以對應織入(Weaving)動作。另外，還可以參考AspectJ的用法，簡單模擬一下每個增強對應的連接點(JoinPoint)信息。

var

測試調用：

// ......省略

執行結果

至此，已經可以初見前端AOP編程的雛形。前面例子已經簡單實現過前置通知（Before）和后置終于通知（After）。還有后置返回通知（AfterReturning）、后置異常通知（AfterThrowing）、與圍繞通知（Around）的具體實現沒有討論。接下來，我們將簡單的模擬實現一個簡單完整的AspectJS。

• Before標識的方法為前置方法，在目標方法的執行之前執行，即在連接點之前進行執行。
• Around環繞通知方法可以包含上面四種通知方法，環繞通知的功能最全面。且環繞通知必須有返回值, 返回值即為目標方法的返回值。對應JoinPoint需要附帶可執行原執行動作的方法(invoke)

比如我們需要計算原函數的執行時間

function

• AfterThrowing異常通知方法只在連接點方法出現異常后才會執行，否則不執行。因此對應JoinPoint需要附帶異常參數(exception)

try

• AfterReturning當連接點方法成功執行后，返回通知方法才會執行，如果連接點方法出現異常，則返回通知方法不執行。返回通知方法在目標方法執行成功后才會執行，所以，返回通知方法可以拿到目標方法(連接點方法)執行后的結果。因此對應的JoinPoint需要附帶執行結果（result）

try

• After后置通知方法在連接點方法完成之后執行，無論連接點方法執行成功還是出現異常，都將執行后置方法

// brefore

下面完整的實現一下這個簡略版的AOP工具

/**

下面通過一個簡單的實例簡單說明。同樣的，我們打算在Person類的run方法的執行前后織入增強。按照前面的實現思路：

function

這是針對單獨類方法AOP的實現。顯然這里面存在以下幾個問題：

• 現實中不總是針對一個應用類的一個方法做AOP處理
• 應該如何如何定義切面Aspect,也就是上面定advices
• 一個應用類不總是對應一個切面Aspect
• 一個切面Aspect也不總是對應一個應用類

綜上所述，更合理的應用類織入切面Aspect應該是這樣的：

var

這里引發出另外一個問題，切面類Aspect應該是什么樣子？應該如何定義？

前面講過，切面包括切點(joinPoint)和通知(advice)，方法名稱對應切點joinPoint，相應的增強函數對應通知advice。那么一個簡單的Aspect應該是這樣子:

var

相應的我們創建一個織入Weaving函數

var

看一下完整的實例：

function

至此，一個簡略版的前端AOP工具已經完成了。但是這里依然存在一些問題。

比如：

• 上面討論過的應用類和Aspect多對多關系
• Aspect類的實現
• ES6和Typescript的出現與發展對前端AOP開發帶來哪些影響？
• AOP的應用以及遇到的問題及其解決辦法

由于篇幅所限我們將在下一篇文章繼續討論，繼續完善我們上面實現的AOP工具。

這僅僅是一個開始，我們需要討論的還有很多......

總結

以上是生活随笔為你收集整理的aop执行跳过某个方法_简谈前端开发中的AOP(一) -- 前端AOP的实现思路的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。