編寫if else語句的更好方法

Question

第一次編寫Javascript。 我只是想知道是否有一種較短的書寫方式：

<p id="demo"></p>

<script>
    function myFunction() {
    var letter = document.getElementById("myInput").value;
    var text;

    if (letter === "5544") {
        text = "Abar, Marlon 1,800";

    } else if (letter === "5545") {
        text = "Pia, Darla 1,800";  

    } else if (letter === "5546") {
        text = "Salazar, Alex 1,500";   

//etc...

    } else {
        text = "Incorrect Account Number";
    }
document.getElementById("demo").innerHTML = text;
}
</script>

嘗試過地圖，但我無法正常工作。

Answer 1

確實沒有一種更短的方法來編寫if語句（我將假設這是您要的內容）。 但是，根據要檢查的內容，可能有幾種不同的編寫方法。

使用Switch語句

處理多個letter可能存在的情況時，有一種更簡潔的方法。

這將是一個switch語句，如下所示：

var text;

switch (letter) {
    case "5544":
        text = "Abar, Marlon 1,800";
    break;
    case "5545":
        text = "Pia, Darla 1,800"; 
    break;

    // more cases

    default:
        text = "Incorrect Account Number";
    break;
}

在某些情況下，這比if else語句更好。 此處的default關鍵字在if else語句中充當else子句。 如果您願意，該case充當您不同的if語句。

本質上，上面的switch語句將遍歷它定義的每種情況，直到找到與letter匹配的情況（例如"5544" ）為止。 如果沒有匹配項，它將達到default大小寫。 一旦找到匹配項，每種case結尾處的break關鍵字case阻止事情陷入下一個定義的case 。

超過6或7個案例，此方法可能很麻煩。

創建一個對象並查找值

現在， 獲得所需值的更短方法是定義一個對象並根據輸入的內容獲得值，如下所示：

var letter = document.getElementById('selector').value;
var obj = {
    '5544': 'Abar, Marlon 1,800'
};

if (letter in obj) {
   // do something if found
}
else {
   // do something if not found
}

如果要檢查的值很多，這可能是獲取值的簡單方法。

其他想法

作為一個側面說明這一切，還有手短if語句稱為三元語句，你可以在這里找到： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator 。 ..但是，我不建議嵌套它們，因為它變得非常復雜且不易讀。

結論

因此，要重申您的問題的答案： 不，實際上沒有一種編寫帶有許多值的if else語句的較短方法。 您可以使用switch語句使它更整潔。 如果您有許多要檢查的值，請使用對象查找方法。

Answer 2

JavaScript具有對象（地圖）文字。 將它們用於簡潔的代碼。 在最終應用程序中，您將從其他地方獲取地圖數據，而不是直接將其編碼到您的網站中，但是如果這樣做，它將看起來像這樣：

document.getElementById( "demo" ).innerHTML = {
    "5544" : "Abar, Marlon 1,800",
    "5445" : "Pia, Darla 1,800",
    ...
}[ document.getElementById( "myInput" ).value ];

Answer 3

您可以長時間使用switch-if-else -if梯形圖：

switch(expression) {
case n:
    code block
    break;
case n:
    code block
    break;
default:
    default code block
}

它是這樣工作的：
1）開關表達式被求值一次。
2）將表達式的值與每種情況的值進行比較。
3）如果匹配，則執行相關的代碼塊。

如果您需要Java腳本中的基本教程，則應該嘗試W3學校。