上回寫到：
沒看上回的同學，在這裡：在微信小程式中使用
async/await
function wxPromisify(fn) {
return async function(args) {
return new Promise((resolve, reject) => {
fn({
...(args || {}),
success: res => resolve(res),
fail: err => reject(err)
});
});
};
}
export function toAsync(names) {
return (names || [])
.map(name => (
{
name,
member: wx[name]
}
))
.filter(t => typeof t.member === "function")
.reduce((r, t) => {
r[t.name] = wxPromisify(wx[t.name]);
return r;
}, {});
}// pages/somepage/somepage.jsimport { toAsync } = require("../../utils/async");
// ...const awx = toAsync(["login", "request"]);await awx.login();await awx.request({...});這不已經封裝過了嗎？
這回寫的是不一樣的封裝。因為，一個小程式裡要寫好多個 toAsync 調用，真的很煩吶！
能不能一次封裝，到處呼叫？能！把所有用到的方法都在初始化的時候就封裝起來。可是，難免會有遺漏。
能不能一次封裝，到處調用，還不需要初始化？
能！祭出Proxy 大神：
// utils/asyncjsfunction wxPromisify(fn) { ... }
// 前面已经定义过了export function asyncProxy(target) {
return new Proxy(target, {
cache: {},
get(it, prop) {
const aFn = this.cache[prop];
if (aFn) { return aFn; }
const v = it[prop];
if (typeof v !== "function") {
return v;
}
return this.cache[prop] = wxPromisify(v);
}
});
}// app.jsimport { asyncProxy } from "./utils/async";
App({ onLaunch: function() {
wx.awx = asyncProxy(wx); // ....
}
})// pages/somepage/somepage// ...const { awx } = wx;await awx.login();await awx.request({...});解釋：
因為 awx 是代理的 wx 對象，調用 awx.login() 的時候，實際是先調用代理的 get(wx, "login" )，找出用來代替 wx.login 的東西。
根據上述程式碼裡的邏輯，先從 cache 裡找使用 wxPromisify() 封裝的結果，若有，直接回傳；若沒有，先封裝成 Promise 網路的函數，存入 cache，再回傳。
直覺一點描述，大概是這樣：
awx.login(); ^^^^^^ get(wx, "login")
推薦教學：《微信公眾號》
以上是Proxy封裝小程式的非同步調用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
