JavaScript Promise报错：BBhistory is not a function问题排查与解决

咱们直接戳破问题根源：你在BBhistory函数内部不小心把函数本身给覆盖了！

看你这段关键代码：

Promise.all([fetch_1, fetch_2]).then(function(result_array){
 //do some stuff with results
 BBhistory = result; // 这里就是坑！
 BBtransactions = result;
 BBobject={0:BBhistory,1:BBtransactions};
 resolve(BBobject);
})

第一次点击按钮时，BBhistory()正常执行，但在这个then回调里，你把全局的BBhistory变量（也就是这个函数本身）赋值成了result的值。等第二次点击按钮想调用BBhistory()时，这个变量已经变成了一个普通值（不再是函数），浏览器自然就抛出Uncaught TypeError: BBhistory is not a function了。

修复方案 #

1. 给内部结果变量换个名字：绝对不要用和函数名相同的变量来存结果，比如改成bbHistoryData这类不会冲突的名字。
2. 避免隐式全局变量：原来的BBobject没有声明就直接赋值，会变成全局变量，这是不良编码习惯，直接创建局部对象返回即可。

修正后的BBhistory函数示例：

function BBhistory(){
 return new Promise(function(resolve,reject){
 const fetch_1 = new Promise(function(resolve,reject){
 // 你的异步逻辑
 resolve(some_strings);
 });
 const fetch_2 = new Promise(function(resolve,reject){
 // 你的异步逻辑
 resolve(some_strings);
 });

 Promise.all([fetch_1, fetch_2]).then(function(result_array){
 // 用局部变量存储处理后的结果
 const bbHistoryData = result_array; // 根据你的实际处理逻辑调整
 const bbTransactionsData = result_array;
 const resultObject = {0: bbHistoryData, 1: bbTransactionsData};
 resolve(resultObject);
 })
 })
}

额外优化建议 #

• 按钮事件里的Promise.all([bbhistory_object])其实没必要，因为bbhistory_object本身就是Promise，直接调用.then即可。如果后续需要等待多个Promise，再把它们放进数组用Promise.all：

$("#hist-testu").on("click",function(){
 const bbHistoryPromise = BBhistory();
 // 单个Promise直接then
 bbHistoryPromise.then(function(result){
 // 处理返回的结果
 })
 // 后续扩展多个Promise的场景：
 // const anotherPromise = someOtherAsyncFunc();
 // Promise.all([bbHistoryPromise, anotherPromise]).then(results => { ... })
})

• 尽量用const/let声明变量，避免全局变量污染，减少类似的变量覆盖问题。

内容的提问来源于stack exchange，提问作者darth0s