如果下面稱為 getData 的函式被定義為異步函式,則稍后在主體中呼叫時會找到它。但是,如果在定義它時只洗掉了 'async',那么我們會收到錯誤“ReferenceError: getData is not defined”。為什么會這樣?函式被定義為異步或不影響它何時在全域范圍內注冊?
在 head 標簽中定義一個函式:
<script>
async function getData() {
const x =[]
const y =[]
const response=await fetch('data.csv');
console.log('response revieved');
const data = await response.text();
console.log(data);
split=data.split('\n').slice(1);
split.forEach(row => {
columns=row.split(',')
x.push(columns[0])
y.push(columns[1])
});
return{x,y}
}
</script>
然后稍后這在 body 標簽中被稱為
const data = getData()
uj5u.com熱心網友回復:
函式被定義為
async或不定義如何影響它在全域范圍內注冊的時間?
它沒有,但是,消除async來自該功能使得在一個語法錯誤await。您應該在瀏覽器控制臺和/或構建工具輸出中看到它。你不能有await一個非async函式。因此,由于它會導致語法錯誤,因此不會創建該函式,該腳本中也不會創建任何其他內容。
例子:
顯示代碼片段
function getData() {
const x =[]
const y =[]
const response=await fetch('data.csv');
console.log('response revieved');
const data = await response.text();
console.log(data);
split=data.split('\n').slice(1);
split.forEach(row => {
columns=row.split(',')
x.push(columns[0])
y.push(columns[1])
});
return{x,y}
}
如果你想讓它成為一個非async函式,你必須將 轉換await為 promise 回呼,像這樣(另見一些其他注釋):
function getData() {
return fetch("data.csv")
.then(response => {
// *** Side note: This check was missing
// More in my blog post: http://blog.niftysnippets.org/2018/06/common-fetch-errors.html
if (!response.ok) {
throw new Error(`HTTP error ${response.status}`);
}
return response.text();
})
.then(data => {
const x = [];
const y = [];
// *** Side note: Was missing `const` (or `let`)
const split = data.split('\n').slice(1);
// *** Side note: This could be a `for-of` loop, which might be clearer
split.forEach(row => {
// *** Side note: Was missing `const` (or `let`)
const columns = row.split(',');
x.push(columns[0]);
y.push(columns[1]);
});
return {x, y}
});
}
但請注意,它仍然異步完成大部分作業。由于 的性質,它必須這樣做fetch。
我會把它作為一個async函式。它們在所有現代環境中都受支持。
uj5u.com熱心網友回復:
因為await 需要一個async 函式,async 將函式轉換為promise 然后你可以使用await 看看這個以了解更多資訊:https : //learnjsx.com/category/2/posts/es6-promise
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/351575.html
標籤:javascript html
上一篇:使用上一個/下一個按鈕導航div
下一篇:反應切換復選框不切換
