在前端开发中,我们经常会遇到需要进行函数调用的情况。如果遇到一些异步的调用,代码可能会变得很冗长,难以维护。这时候,我们就可以使用一个叫做 polite-call
的 npm 包来简化函数调用。
什么是 polite-call
polite-call
是一个针对 JavaScript 函数调用场景的 npm 包。它可以让我们在调用函数的时候,代码更清晰简洁。
这个包的核心理念在于:将函数调用变成面向对象的形式,让代码更加易懂,并且可以在异步调用过程中避免一些问题。
如何安装
我们可以用 npm 命令行来安装这个包:
npm install polite-call
或者在项目的 package.json
中添加依赖:
{ "dependencies": { "polite-call": "^1.0.0" } }
怎么使用
使用 polite-call
的方式很简单,首先我们需要导入这个 npm 包:
const PoliteCall = require('polite-call');
然后,我们可以创建一个 PoliteCall
实例:
const polite = new PoliteCall();
现在,我们可以通过这个 polite
实例来调用我们的函数。
假如我们有一个 foo
函数,它接受两个参数并且返回一个 Promise 对象。
-- -------------------- ---- ------- -------- ------ -- - ------ --- --------------- -- - ------------- -- - --------- - --- -- ------ --- - ------ -------------- -- - -------------------- -- -- - ---
使用 polite-call
的方式是:
polite.call(foo, [1, 2]).then(result => { console.log(result); // 输出 3 });
这里 polite.call
接受两个参数,第一个是要调用的函数 foo
,第二个是一个数组,表示这个函数的参数。
如果我们的函数不是 Promise 形式的,我们也可以使用 polite.call
方法,只需要在函数中添加一个回调函数就可以了:
function sum(a, b, callback) { const result = a + b; callback(result); } polite.call(sum, [1, 2], result => { console.log(result); // 输出 3 });
API
polite-call
提供了几个方法,我们可以根据实际的场景来选择使用。
call(fn, args) => Promise
通过 call
方法,我们可以调用一个普通的函数,并返回一个 Promise 对象。参数 fn
代表要调用的函数,args
是一个数组,表示这个函数的参数。
polite.call(foo, [1, 2]).then(result => { console.log(result); // 输出 3 });
apply(fn, args) => Promise
类似于 call
方法,只不过它的 args
参数是一个数组,表示要调用的函数的参数。
polite.apply(foo, [1, 2]).then(result => { console.log(result); // 输出 3 });
bind(fn, ...presetArgs) => Function
通过 bind
方法,我们可以将一个函数和一些预设的参数绑定在一起,返回一个新的函数。
const sum = (a, b, c) => a + b + c; const addOne = polite.bind(sum, 1); const addTwo = polite.bind(addOne, 2); console.log(addTwo(3)) // 输出 6
wait(ms) => Promise
通过 wait
方法,我们可以创建一个 Promise,表示等待指定时间后的某个动作。
polite.wait(1000).then(() => { console.log('1 秒之后执行'); });
delay(fn, ms) => Promise
类似于 wait
方法,不过 delay
可以在执行函数之前等待一段时间。它的 ms
参数表示要等待的时间,fn
表示要调用的函数。
polite.delay(foo, 1000, [1, 2]).then(result => { console.log(result); // 输出 3 });
现实应用场景
polite-call
虽然看起来很小众,但实际上它适用于很多实际项目的场景。
一个常见的场景是:每个函数都需要在执行前判断一些条件是否满足,如果条件不满足,就不能执行这个函数。
使用 polite-call
就可以实现这个功能:
-- -------------------- ---- ------- ----- ------ - --- ------------- -------- ----- - ------ --- --------------- -- - ------------- -- - ---------------- -- ------ --- - ----- -------- ----- - -- ----------- - ---- - ----- - - -- -- -- --- -- - ------ ----------------- - - ----------------- -- - -------------------- -- -- ---- ---
这里,我们需要检查 a
是否等于 1,如果不等于,就不能执行 foo
函数。我们可以使用 polite.call
将函数 foo
封装成一个对象,然后使用对象来调用函数。当条件不满足的时候,我们只需要不执行这个对象的 call
方法即可。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/600672693660cf7123b3671c