如何跨函數使用和重用JS變量

Question

我遇到一種情況，需要從jQuery AJAX調用的結果中初始化/分配變量，然后在腳本中進一步重復使用這些變量：

var shouldRedirect = ???

$.ajax({
    url: 'http://example.com',
    type: 'GET',
    data: 'blah',
    asynch: false,
    timeout: 1800,
    success: function(data) {
        shouldRedirect = data.rows[0].redirectFlag
    }
});

if(shouldRedirect)
    window.location = "...";

我遇到兩個問題：

• 假設結果JSON將包含一個redirectFlag布爾值， data.rows[0].redirectFlag是獲取我的變量值的正確方法嗎？ 和
• 在啟動AJAX之前，我應該如何初始化shouldRedirect到什么（我該怎么說“創建變量，但不給它一個值！”）？

提前致謝！

Answer 1

您只需執行以下操作即可聲明未初始化的變量：

var shouldRedirect;

如果您的邏輯需要它，您當然可以將其初始化為false：

var shouldRedirect = false;

但是，這可能不是您想要的。 您可以通過將變量與undefined嚴格比較來檢查變量是否已初始化：

if (shouldRedirect === undefined) // do something

但是請注意，您必須使用三重等於運算符（也稱為嚴格相等），否則結果將與預期不符。 另一方面，未定義的變量將產生錯誤的結果。 這意味着，當使用簡單的if (shouldRedirect)檢查變量並且該變量未定義時，它將產生false ，就像將其設置為false一樣。 對於JavaScript中的其他兩個值，例如空字符串""或null 。 您可以在此處查看虛假值的完整列表。 如果要顯式檢查true或false並忽略其他虛假或真實值，則應使用三重相等進行檢查，例如if (shouldRedirect === true) 。

另外，如果data.rows[0].redirectFlag是訪問值的正確方法，則高度取決於您從AJAX調用接收的數據結構的實際外觀。 如果類似於以下內容，則將是正確的：

{ rows: [ {redirectFlag: true}, {redirectFlag: false} ] }

如果您的JSON如下所示

{ redirectFlag: false }

那么您只需使用data.redirectFlag即可訪問redirectFlag。

Answer 2

• 在啟動AJAX之前，我應該如何初始化shouldRedirect到什么（我該怎么說“創建變量，但不給它一個值！”）？

  您可以這樣做： var shouldRedirect;

但是，我會做var shouldRedirect = false; 確保shouldRedirect沒有未定義

• data.rows [0] .redirectFlag是否是獲取變量值的正確方法？

取決於您從AJAX請求發回的內容。 通常，響應使用JSON格式，因此，如果您將JSON對象發送回值為true，則可以執行以下操作：

shouldRedirect = data.redirectFlag;

Answer 3

對於第1部分，要聲明一個具有值的變量，請使用：var shouldRedirect。 這樣，您就可以執行if（！shouldRedirect）{}。

對於第2部分。 如何從redirectFlag獲取值基於ajax調用返回的數據的形式。 數據...將是您獲得價值的起點。

Answer 4

如注釋部分所述，設置shouldRedirect標志不會有幫助，因為在$.ajax請求之后的if語句將在從服務器獲取結果之前進行評估-這是異步代碼執行中常見的問題。 盡管從理論上講，您可以通過sync參數將jQuery.ajax強制設為sync模式，但我不建議這樣做，因為它會在發出請求時鎖定瀏覽器UI。

您需要將重定向代碼移至$.ajax success函數中，如下所示：

$.ajax({
    url: 'http://example.com',
    // ... other options omitted for brevity

    success: function(data) {
        // This code block gets executed when the operation completes.
        var shouldRedirect = data.rows[0].redirectFlag
        if (shouldRedirect) {
            // Your redirection code goes here.
            window.location = "...";
        }
    }
});

如果您使用的是jQuery 1.7或更高版本，則可以通過defered object來使用其Promises / A實現。 延遲對象使您可以在操作完成后執行一個或多個功能，並使異步代碼更易於閱讀。

$.ajax({ url: 'http://example.com' })
    .done(function(data) { 
        // This code block gets executed when the operation completes.
    });

除了傳遞函數閉包到done ，還可以傳遞對成員函數的引用，例如：

$.ajax({ url: url }).done(onDataLoaded);

function onDataLoaded(data) {
    // This function gets called when the ajax operation completes.
}