基本的 JavaScript，為什么這個函數不傳遞參數

Question

我正在嘗試學習來自 C# 的 JavaScript。 我寫了這個簡單的代碼，但由於某種原因，參數沒有傳遞給 setTimeout 函數。

function displayName(name) {
    console.log(`Name is ${ name }`);
}

function login(name) {
    // The argument 'name' is not being passed from the login function to the setTimeout !!
    setTimeout(name =>{
        displayName(name)
    }, 2000);
}

login("Satoshi")

我希望輸出是： Name is Satoshi
相反，我得到： Name is undefined

我哪里錯了？ 很明顯，我對 JavaScript 參數和范圍有一些不了解。

Answer 1

參數“名稱”沒有從登錄函數傳遞給 setTimeout ！！

那是因為您使用箭頭函數的參數隱藏了login name參數。 函數參數列表中的參數名稱類似於函數體內的變量聲明，因此您的原始代碼具有外部name （在login ）和單獨的內部name （在箭頭函數中）。 最里面的一個是當您使用參數（或變量）的名稱時使用的那個。

將箭頭函數中的name替換name () ，這樣它就不會聲明自己的name參數； 然后它將關閉login的name參數：

function login(name) {
    setTimeout(() =>{
// −−−−−−−−−−−−^^
        displayName(name);
    }, 2000);
}

默認情況下，瀏覽器上的setTimeout不會使用任何參數調用您提供的函數，因此原始代碼中箭頭函數中的name參數將始終具有值undefined 。

在某些情況下，您可能希望setTimeout在調用時將一個或多個參數傳遞給計時器回調，您可以通過在超時間隔之后傳遞這些參數來實現，如下所示：

function login(name) {
    setTimeout(innerName =>{
//             ^^^^^^^^^−−−−−−−− the arrow function's parameter
        displayName(innerName);
//                  ^^^^^^^^^−−− using the arrow function's parameter's value
    }, 2000, name);
//           ^^^^−−−−−−−−−−−−−−− `login`'s `name`
}

但是在您的示例中不需要這樣做。