版权声明:个人笔记,不喜勿喷 https://blog.csdn.net/qq_39571197/article/details/88684406
<script>
const END = 'end';
class Chain { /* a factory */
// status
get END() {
return 'end';
}
constructor(options) {
let currentOptionName = null;
let proxy = new Proxy({}, {
get: (obj, key, proxyObj) => {
if (key === this.END) {
return function () {
console.log(options);
return proxy = currentOptionName = null;
};
}
return function () {
currentOptionName = key;
console.log('proxy->', key);
// methods
return {
add(...payloads) {
options[currentOptionName].push(payloads);
currentOptionName = null;
return proxy;
},
};
};
},
});
return proxy;
}
}
const defaultOpts = {
module: [],
plugins: [],
};
const webpack = new Chain(defaultOpts);
webpack
.module()
.add(123)
.plugins()
.add(234)
.end();
</script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
const proxyLog = function () {
const proxyLog = {
proxyNames: {},
};
const proxyNames = proxyLog.proxyNames;
proxyLog.register = function (namespace) {
proxyNames[namespace] = 1;
return new Proxy({}, {
get(obj, key, proxyObj) {
return proxyNames[namespace] ? console[key] : () => { };
},
});;
};
proxyLog.cancel = function (namespace) {
delete proxyNames[namespace];
};
return proxyLog;
}();
</script>
<script>
// 源码内调试
const vueLog = proxyLog.register('vue');
const ngLog = proxyLog.register('ng');
vueLog.log(1);
ngLog.log(1);
// 不看源码的调试
proxyLog.cancel('vue');
proxyLog.cancel('ng');
vueLog.log(1);
ngLog.log(1);
</script>
</body>
</html>