下面的promisify中this指向什么,为什么要绑定this?
原文 https://zh.javascript.info/pr...f.call(this, ...args); 为什么要绑定this this指向什么
function promisify(f) {
return function (...args) { // 返回一个包装函数(wrapper-function) (*)
return new Promise((resolve, reject) => {
function callback(err, result) { // 我们对 f 的自定义的回调 (**)
if (err) {
reject(err);
} else {
resolve(result);
}
}
args.push(callback); // 将我们的自定义的回调附加到 f 参数(arguments)的末尾
f.call(this, ...args); // 调用原始的函数
});
};
}
// 用法:
let loadScriptPromise = promisify(loadScript);
loadScriptPromise(...).then(...);
回复
1个回答
test
2024-07-09
看了下,原文
这个实现中,答案写在代码中,请看解释1,2,3;
function loadScript(src, callback) {
let script = document.createElement('script');
script.src = src;
script.onload = () => callback(null, script);
script.onerror = () => callback(new Error(`Script load error for ${src}`));
document.head.append(script);
}
function promisify(f) {
return function (...args) { // 返回一个包装函数(wrapper-function) (*)
// 解释1: 这里对这个包装函数的参数列表进行了保存,为后续真正的调用点进行传入
return new Promise((resolve, reject) => {
function callback(err, result) { // 我们对 f 的自定义的回调 (**)
if (err) {
reject(err);
} else {
resolve(result);
}
}
args.push(callback); // 将我们的自定义的回调附加到 f 参数(arguments)的末尾
// 解释2:这里为了把调用包装函数的所有参数都传入f, 用了call的第二个参数...args把包装函数的参数原封不动的传给了f,this在这里的含义可以忽略,因为f(即loadScript)函数内部并不关心this是谁,所以这里传null也是可以的。
// 解释3:顺道指明一下:这里的this实际上就是你声明一个函数时,函数内部this的值window, node环境是undefined。
f.call(this, ...args); // 调用原始的函数
});
};
}
// 用法:
let loadScriptPromise = promisify(loadScript);
loadScriptPromise(...).then(...);
回复
适合作为回答的
- 经过验证的有效解决办法
- 自己的经验指引,对解决问题有帮助
- 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
- 询问内容细节或回复楼层
- 与题目无关的内容
- “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容