如何利用Proxy更優雅地處理異常詳解

2022-03-04 13:00:02

程式碼不會全部按照我們的預期執行，可能會有意料之外的情況，為了保證程式的健壯性，要進行例外處理。

比如一個物件的所有方法，都應該做例外處理，但是，如果每個方法都加 try catch 又太麻煩：

const obj = {
    aaa() {
        try {
            // aaa
        } catch(e) {
            // xxxx
        } 
    },
    bbb() {
        try {
            // bbb
        } catch(e) {
            // xxxx
        } 
    },
    ccc() {
        try {
            // ccc
        } catch(e) {
            // xxxx
        } 
    }
}

有沒有一種方式既能對所有方法做例外處理，又不用重複寫這麼多次呢？

有，就是代理模式。

代理模式是通過對目標物件做一層包裝，提供和目標物件同名的方法，最終的功能實現還是呼叫目標物件的方法，但可以額外新增一些職責，比如紀錄檔、許可權等，透明地對目標物件做一些擴充。

比如 React 裡的高階元件就是代理模式的實現，可以透明的擴充套件被包裝的元件的功能。

很明顯，這裡的例外處理，也可以用代理的方式來做。但不用完全自己實現，ES6 提供了 Proxy，可以基於它來實現。

定義 createProxy 方法來實現代理，建立一個 Proxy 物件，對目標物件 target 做一層包裝，定義 get、set 時的處理：

function createProxy(target) {
    const proxy = createExceptionProxy();
    return new Proxy(target, {
        get: proxy,
        set: proxy
    });
}

function createExceptionProxy() {
    return (target, prop) => {
        if (!(prop in target)) {
            return;
        }

        if (typeof target[prop] === 'function') {
            return createExceptionZone(target, prop);
        }

        return target[prop];
    }
}

如果 target 不包含 prop，就返回空，否則返回對應的屬性值 target[prop]。

如果屬性值是函數，則做一層包裝:

function createExceptionZone(target, prop) {
    return (...args) => {
        let result;
        ExceptionsZone.run(() => {
          result = target[prop](...args);
        });
        return result;
    };
}

最終的功能實現還是呼叫 target，傳入引數，把呼叫結果作為代理方法的結果返回。

包裝這一層的目的是為了做例外處理，也就是 ExceptionsZone.run 做的事情：

class ExceptionsZone {
    static exceptionHandler = new ExceptionHandler();

    static run(callback) {
      try {
        callback();
      } catch (e) {
        this.exceptionHandler.handle(e);
      }
    }
}

呼叫目標方法，並做 try catch，當出現異常的時候，用 ExceptionHandler 來處理。

這裡的例外處理我們就簡單列印下紀錄檔：

class ExceptionHandler {
    handle(exception) {
        console.log('記錄錯誤：',exception.message, exception.stack);
    }
}

這樣就實現了給目標物件的所有方法新增例外處理的目的。

測試下：

const obj = {
    name: 'guang',
    say() {
        console.log('Hi, I'm ' + this.name);
    },
    coding() {
        //xxx
        throw new Error('bug');
    }
    coding2() {
        //xxx
        throw new Error('bug2');
    }
}

const proxy = createProxy(obj);

proxy.say();
proxy.coding();

這裡的 coding、coding2 方法都會丟擲異常，但並沒有做例外處理，我們用代理給它加上：

我們成功地通過代理模式給物件方法新增了例外處理！

但是現在這樣還是有問題的，比如我把 coding 方法改為 async 的就不行了：

那怎麼辦呢？能不能統一對非同步和同步方法做代理呢？

確實沒辦法，因為沒法區分方法是同步還是非同步，而且這兩種方法的呼叫方式也不同，但我們可以單獨提供一個 runner 方法來執行這些非同步邏輯：

class ExceptionsZone {
    static exceptionHandler = new ExceptionHandler();

    static async asyncRun(callback) {
      try {
        await callback();
      } catch (e) {
        this.exceptionHandler.handle(e);
      }
    }
}

然後這樣執行：

(async function() {
    await ExceptionsZone.asyncRun(proxy.coding2);
})();

這樣就能處理非同步邏輯中的異常了：

我們通過代理的方式給物件的所有同步方法新增了例外處理，然後又提供了執行非同步方法的 runner 函數，對非同步的異常做了處理，結合這兩種方式，優雅地給目標物件的所有方法加上了例外處理。

可能你會說，代理就代理，你定義這麼多 class 幹啥？

因為這段邏輯是我從 Nest.js 原始碼裡摘出來的，它原始碼裡就是這樣來給物件新增例外處理的：

非同步邏輯也是單獨提供了個方法來執行：

我覺得這個透明給物件新增例外處理的方式很優雅，就把它從 Nest.js 原始碼裡抽了出來。

完整程式碼如下：

function createProxy(target) {
    const proxy = createExceptionProxy();
    return new Proxy(target, {
        get: proxy,
        set: proxy
    });
}

function createExceptionProxy() {
    return (receiver, prop) => {
        if (!(prop in receiver)) {
            return;
        }

        if (typeof receiver[prop] === 'function') {
            return createExceptionZone(receiver, prop);
        }

        return receiver[prop];
    }
}

function createExceptionZone(receiver, prop) {
    return (...args) => {
        let result;
        ExceptionsZone.run(() => {
          result = receiver[prop](...args);
        });
        return result;
    };
}

class ExceptionHandler {
    handle(exception) {
        console.log('記錄錯誤：',exception.message, exception.stack);
    }
}

class ExceptionsZone {
    static exceptionHandler = new ExceptionHandler();
  
    static run(callback) {
      try {
        callback();
      } catch (e) {
        this.exceptionHandler.handle(e);
      }
    }
  
    static async asyncRun(callback) {
      try {
        await callback();
      } catch (e) {
        this.exceptionHandler.handle(e);
      }
    }
}

const obj = {
    name: 'guang',
    say() {
        console.log('Hi, I'm ' + this.name);
    },
    coding() {
        //xxx
        throw new Error('bug');
    },
    async coding2() {
        //xxx
        throw new Error('bug2');
    }
}

const proxy = createProxy(obj);

proxy.say();
proxy.coding();

(async function() {
    await ExceptionsZone.asyncRun(proxy.coding2);
})();

總結

為了保證健壯性，我們要對所有可能報錯的程式碼新增例外處理，但是每個方法都新增 try catch 又太麻煩，所以我們利用 Proxy 實現了代理，透明的給物件的所有方法都新增上了例外處理。

但是，代理新增的只是同步的例外處理，並沒有捕獲非同步邏輯的異常，我們可以單獨定義一個函數來執行非同步方法。

結合代理 + 提供執行非同步方法的 runner 這兩種方式，就能給一個沒有做任何例外處理的物件加上例外處理。是不是很優雅～

到此這篇關於如何利用Proxy更優雅地處理異常的文章就介紹到這了,更多相關Proxy更優雅處理異常內容請搜尋it145.com以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援it145.com！

如何利用Proxy更優雅地處理異常詳解

熱門文章