初識AOP面向切面編程 (前端)

前言

想必你們對面向對象OOP (Object Oriented Programming)應該都不陌生，它是一種編程思想。而AOP(Aspect Oriented Programming)在編程歷史上能夠說是里程碑式的，顯然它並非OOP的替代品，而是對OOP的一種十分有益的補充。

那麼AOP究竟是個啥東西呢？

咱們都知道OOP的特色是繼承、多態和封裝。而封裝就是把一個功能的代碼封裝到一個函數中(或一個類中)，之後再想實現這個功能，只須要執行函數方法便可，不須要再重複的編寫代碼。但這樣會有一個問題，假如說我封裝了一個選項卡的功能，項目中多處都在使用此功能。忽然有一天接到一個需求說但願選項卡切換的時候請求某個接口，這樣的話，項目中的每一個選項卡都要處理一次這個東西，寫一堆代碼，是否是就很差了？若是說我只想某幾個頁面選項卡切換的時候去請求某個接口，那你的業務代碼又一堆。因此這個時候就須要切面處理，也就是AOP。

換句大白話，就是說你在家切西瓜，剛切了一刀，忽然家裏來客人了。。。你就想在西瓜上裱個花，因而就作了一個裱花的函數，但西瓜下面的那些地方，該怎麼樣仍是怎麼樣。換到代碼層面，就是不影響原有的業務邏輯，而又在原有的業務邏輯上作 了一些別的事情。

示例

Function.prototype.before = function(callback) {
  let self = this
  return function() { 
    callback()
    self.apply(self, arguments)
  }
}

function fn(...val) {
  console.log('原有功能,' + val)
}

let newFn = fn.before(function() { // 原有功能以前執行
  console.log('在原有功能函數以前執行') 
})

newFn('準備', '執行')  // 爲原有功能傳參
複製代碼