js function hook.
劫持函数的钩子方法
- 代理函数执行前 withBefore(originalFn, hookFn)
- 代理函数执行后 withAfter(originalFn, hookFn)
- 代理函数参数 hookArgs(originalFn, argsGetter)
- 代理函数 return 结果 hookOutput(originalFn, valueGetter)
实现方式参考 store2 实现方式:https://github.com/nbubna/store/blob/master/src/store2.js
// 函数事件劫持,在函数前执行hook,若hook返回false则不再执行原始函数
var log = console.log; // 暂存原始方法
console.log = FnHook.withBefore(console.log, function () {
log("你即将调用log方法");
});
// 函数事件劫持,事件监听
EventTarget.prototype.addEventListener = FnHook.withBefore(
EventTarget.prototype.addEventListener,
function () {
log("你执行了绑定事件");
}
);
// 函数事件劫持,在函数后执行hook
console.log = FnHook.withAfter(console.log, function () {
log("你调用了log方法");
});
// 劫持函数参数
console.log = FnHook.hookArgs(console.log, function () {
log("你的传参为", ...arguments);
});
// 全局事件监控
EventTarget.prototype.addEventListener = FnHook.hookArgs(
EventTarget.prototype.addEventListener,
function (type, listener, options) {
console.log("事件已监控:", type);
const hookedListener = FnHook.withBefore(listener, () => {
console.log("事件已执行:", type);
});
return [type, hookedListener, options];
}
);
// 劫持函数返回参数
function getSum(a, b) {
return a + b;
}
getSum = FnHook.hookOutput(getSum, function (output) {
console.log("执行函数的 return 为:", output);
});
getSum(100, 20);