试图从Browserify bundle中提取数据

Question

我是新的Browserify/Node.js和我一直试图使用npm拉数据。我的代码拉数据在一个js文件，main.js，是:

const { getChart } = require('billboard-top-100');
var artistArray = [];
getChart('artist-100', '', (err, chart) => {
if (err) console.log(err);
for (let i = 0; i < 100; i++) {
artistArray.push(chart.songs[i].artist)
}
console.log(artistArray);
return artistArray;
});

然后我将这个文件与Browserify捆绑在一起，以便能够在我的HTML代码中在单独的js文件bundle.js中访问它。

虽然我能够console.log artistArray变量并执行终端命令>node main.js，它成功地显示了artistArray，但我无法在主html文件中获得该变量。任何帮助吗?

我什么都试过了。对不起，如果这个问题很愚蠢，我是一个初学者。

Answer 1

const { getChart } = require('billboard-top-100');
var artistArray = [];
getChart('artist-100', '', (err, chart) => {
if (err) console.log(err);
for (let i = 0; i < 100; i++) {
artistArray.push(chart.songs[i].artist)
}
console.log(artistArray);
return artistArray;
});
console.log(artistArray) // <- this will print []

如果您在回调函数(err, chart) => {...}之外调用artistArray，那么您将获得与初始化相同的值。因为在那个时候，你还没有getChart的数据。所以你只能在回调函数中使用它。

总结:

• 在回调函数中返回artistArray在这里是无用的。
• 你只能使用回调函数中的数据

const { getChart } = require('billboard-top-100');
var artistArray = [];
getChart('artist-100', '', (err, chart) => {
if (err) console.log(err);
for (let i = 0; i < 100; i++) {
artistArray.push(chart.songs[i].artist)
}
// Using the artistArray direct here.
});

• 或者它有一个技巧，你可以使用setTimeout与delay，你认为这是足够安全的getChart完成的数据。

...
getChart(..., '' , (err, chart)=> {...})
setTimeout(() => {
console.log(artistArray) // <- data after updated
}, 3000) // <- waiting 3 second 

对我来说，处理这个。我通常建立一个函数，它的输入是一个我们想要处理的数组，然后把所有的逻辑都放在那里。然后把它放到回调中。

getChart('artist-100', '', (err, chart) => {
if (err) console.log(err);
for (let i = 0; i < 100; i++) {
artistArray.push(chart.songs[i].artist)
}
handleList(artistArray)
})
function handleList(arr) {
// your code logic with artistArray here
}