如何等待数据从获取json文件，然后继续

Question

我是JavaScript新手，遇到了一个问题：

我做fetch('path')，然后赋值并返回。后来我在其他函数中调用了这个函数，但它首先以空值运行，而不等待赋值。我该如何解决这个问题？我想我应该使用async和await，但不知道具体如何使用。

function loadLocalJson(path) {
let users = [];
fetch(path)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok :(');
}
return response.json();
})
.then(results => {
users = results
console.log(users);
}) 
.catch(err => console.log('Error', err));
return users;
}
function getFilteredAndSortedArray(users, price) {
console.log(users, price);
return users.filter(user => {
return user.salary && user.salary > price;
})
.sort(user => user.name);
}
users = loadLocalJson('users.json');
usersB= getFilteredAndSortedArray(users, 1000);
console.log(usersB, usersA);
// PrefixedUsersArray(users)    
// ...

Answer 1

您需要了解异步代码是如何工作的。获取请求返回promise，因此必须返回promise并使用.then():访问值

function loadLocalJson(path) {
return fetch(path)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok :(');
}
return response.json();
})
.catch(err => console.log('Error', err))
}
function getFilteredAndSortedArray(users, price) {
console.log(users, price);
return users.filter(user => {
return user.salary && user.salary > price;
}).sort(user => user.name);
}
loadLocalJson('users.json').then(users => {
usersB = getFilteredAndSortedArray(users, 1000);
console.log(usersB, users);
})

您不必分配用户，只需返回promise即可，因为您已经调用了response.json()。此外，您的排序功能很可能无法工作，请尝试以下操作：

users.sort((a, b) => a.name.localeCompare(b.name))