簡體   English   中英

一個案例中的多個案例,一個得到元音但另一個字母不明白為什么

[英]multiple case in one case, a get vowel but other letter not get why

<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<meta charset="utf-8">
</head>
<body>
<h1>Find Vowel or Constant</h1>
<form>
<input type="text" id="user" />
<button id="btn">click</button>
</form>
<p id="result"></p>


        <script>
        var user_btn = document.getElementById("btn");
        user_btn.onclick=function(){
var user_input = document.getElementById("user").value;
var user_result = document.getElementById("result");

    switch(user_input){
        case 'a'||'e'||'i'||'o'||'u': {user_result.innerHTML="Vowel"; return false;}
        break;

        default: {user_result.innerHTML="Consonant"; return false;}
        break;
}
}
</script>
</body>
</html>

case 表達式首先得到完全評估。 非空字符串是真實的,鏈式|| 將評估找到的第一個真實表達式。 所以

case 'a'||'e'||'i'||'o'||'u':

等效於第一個真實的交替表達式, 'a'

case 'a':

所以a s 會被檢測為元音。

您可以為每個字母單獨設置一個大小寫:

 var user_btn = document.getElementById("btn"); user_btn.onclick = function() { var user_input = document.getElementById("user").value; var user_result = document.getElementById("result"); switch (user_input) { case 'a': case 'e': case 'i': case 'o': case 'u': user_result.innerHTML = "Vowel"; return false; default: user_result.innerHTML = "Consonant"; return false; } }
 <h1>Find Vowel or Constant</h1> <form> <input type="text" id="user" /> <button id="btn">click</button> </form> <p id="result"></p>

但是switch非常冗長並且容易出錯。 請考慮使用正則表達式:

 var user_btn = document.getElementById("btn"); user_btn.onclick = function() { var user_input = document.getElementById("user").value; var user_result = document.getElementById("result"); user_result.innerHTML = /[aeiou]/i.test(user_input)? "Vowel": 'Consonant'; return false; }
 <h1>Find Vowel or Constant</h1> <form> <input type="text" id="user" /> <button id="btn">click</button> </form> <p id="result"></p>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM