javascriptのステートメントとswitchステートメントの場合

Question

javascriptとそのスイッチとifステートメントをよく知っていると思っている人にとっては興味深いケースがあります。これは正常に動作する方法です：

var a = 1; 
if (a == 1) alert("true"); 

これは非常に単純化されています。 switch文で、それはこのように書きます：

var a = 1; 
switch (a) 
{ 
    case 1: alert("true"); 
} 

をしかし、私は文は、私は急に見えることはできません場合の多くを置き換えるために、私の知る限り正しく、switch文を行うにしようとすると、それを機能させる。 Offcourse、この質問は何度も尋ねられてきましたが、すべてのコードが異なり、一貫したパターンがないため、オンラインで自分自身を見つけることができませんでした。

次のコードは、主人公が正しい値を有することが確認されていないことを出力するようになっている：

<script type="text/javascript"> 
    Skilllevel = [0,20,80,150,300,800,1000,1200,1400,1600,2000,2250,2500,2750,3000,4000,4200,4400,4700,5000]; 
    Merclevel = [0,150]; 
    A = 0; 
    B = ""; 
    hero = ""; 
    heroesMain = [0,0,0,0,0,0,0,0,0,0,16,0,0,0,16,0,18,16,16,16,0,0,0,0,0,0,0]; 
    heroesCost = [0,0,0,0,0,0,1,0,2,1,1,0,0,1.5,1,1,2,1,1,1.5,0,0,0,0,0,0,0]; 
    function skillcalc() 
    { 
    var confirmed = ""; 
    var skillQ = document.getElementById("SkillQ").value; 
    var skillA = document.getElementById("SkillA").value; 
    if (skillQ == "max") skillQ = 20; 
    else if (skillQ == "min") skillQ = 1; 
    else if (skillQ < 0) skillQ = 0; 
    if (skillA > 20) skillA = 20; 
    else if (skillA == "tomin") 
    { 
     waarde = document.getElementById("heroes").value; 
     hero = document.getElementById("heroes"); 
     /*if (waarde == 1 || waarde == 2 || waarde == 3 || waarde == 4 || waarde == 5 || waarde == 6 || waarde == 7 || waarde == 8 || waarde == 9 || waarde == 10 || waarde == 11 || waarde == 12 || waarde == 13 || waarde == 14 || waarde == 15 || waarde == 16 || waarde == 17 || waarde == 18 || waarde == 19 || waarde == 20 || waarde == 22 || waarde == 22 || waarde == 23 || waarde == 24 || waarde == 25 || waarde == 26) confirmed = "NOT ";*/ 
//switch statement not working 
switch (waarde) 
{ 
case 1: confirmed = "NOT "; 
} 
     hero = hero.options[hero.selectedIndex].text; 
     skillA = heroesMain[waarde]; 
     if (heroesMain[waarde] == 0 || heroesCost[waarde] == 0) B+="I don\'t know some of it, but here it comes:<br />"; 
    // if (waarde == 1 || waarde == 2) confirmed = "NOT "; 
     B += "The " + hero + " costs " + heroesCost[waarde] + " rage at level " + heroesMain[waarde] + ". <br />WARNING! Everything is still being tested. <br /> This hero is " + confirmed + "confirmed to have correct values."; 
    } 
    else if (skillA < 0) skillA = 0; 
    while (skillA > skillQ) 
    { 
     A+=Skilllevel[skillQ]; 
     skillQ++; 
    } 
    WriteNew = document.getElementById("writeNew"); 
    if (WriteNew.checked) 
    { 
     document.getElementById("Answer").innerHTML+= "The # of rings required = " + A + "<br />"+ B; 
    } 
    else 
    { 
     document.getElementById("Answer").innerHTML= "The # of rings required = " + A + "<br />"+ B; 
    } 
    A=0; 
    B=""; 
    } 
</script> 
Your hero: 
<select id="heroes"> 
<option value="0" selected="selected">[Any epic hero]</option> 
<option value="1">Air Elite</option> 
<option value="2">Glory Priestress</option> 
<option value="3">Blockhead</option> 
<option value="4">Carol d'Belle</option> 
<option value="5">Blitz Bomber</option> 
<option value="6">Pounder</option> 
<option value="7">Hydrasaur</option> 
<option value="8">Renee Ven</option> 
<option value="9">Arctic Lord</option> 
<option value="10">Pan Goli</option> 
<option value="11">Sapphirix</option> 
<option value="12">Dark Rider</option> 
<option value="13">Great Sage</option> 
<option value="14">Abyss Demon</option> 
<option value="15">Landslide</option> 
<option value="16">Ambrosia</option> 
<option value="17">Skull Mage</option> 
<option value="18">Chiron</option> 
<option value="19">Djinni</option> 
<option value="20">Demon Slayer</option> 
<option value="21">Enchantress</option> 
<option value="22">The Berserker</option> 
<option value="23">Savage Chief</option> 
<option value="24">Won Ton</option> 
<option value="25">Arcane Caster</option> 
<option value="26">Toxic Shaman</option> 
</select> 
<br /> 
Your skilllevel: <input type="text" id="SkillQ"><br /> 
Required skilllevel: <input type="text" id="SkillA"><br /> 
<label for="writeNew">Write New?</label><input type="checkbox" id="writeNew" /><br /> 
<button onclick="skillcalc()">Calculate</button> 

<p id="Answer"></p> 

私はwaardeの値、これは約となっている値をバック警告するブラウザを要求しました。ここで

は、それがどのように見えるべきかのスクリーンショットです： http://i.imgur.com/Lu172nY.png

ここのように、それは実際にどのように見えるかです：私が応答して喜んで（それはその値が正しくないことを言っていない） http://i.imgur.com/oU1Vjxl.png

この面白い場面にたくさんの質問があります。たぶん私は何かを見落としているかもしれませんが、私はそれが何であるかはよく分かりません。

よろしく、パトリック

Answer 1

あなたは、スイッチ文で使用される値がテキストであるからです。

はコンソールでそれを試してみてください。

var a = '1'; 
switch(a) { 
    case 1: alert('Number'); 
    case '1': alert('Text'); 
} 

おそらくswitch(parseInt(a))を使用する必要があります。

Answer 2

何が起こっているのは、あなたが言うことではなく、あなたが意図しているものを比較することに慣れてきたことです。

この現象はtype coercionと呼ばれ、===（3x =）の代わりに==（2x =）演算子を使用すると発生します。この例では - -

あなたが値のいずれか（これはcoercionと呼ばれる）ので、他の型に変換され、'1' == 1、例えば、==使用すると、実際の比較はtrueもたらす'1' == '1'、です。あなたが比較すること===を使用する場合は

は、値はので'1' === 1がfalseになり、両方の値とタイプで同じでなければなりません。

switchこのcoercion行いませんので、あなたは（両方の値とタイプは同じでなければならない場合）===を使用して比較しているかのように動作します。

switchが正しく機能するためには、switch(value)に入力された値がcaseで使用されている値と同じタイプであることを確認する必要があります。

あなたのコードは、あなたがどちらかの場合では、文字列（例えばcase '1':）を使用するか、値を変換する必要がありますので、必ず、文字列型になります

waarde = document.getElementById("heroes").value 

を使用して、DOM（フォーム）からの値をとります、数にDOMから取得した（例えばwaarde = parseInt(..., 10)（the radix argument is important!））

read more on coercion