如果javascript中的语句与switch语句

时间:2016-05-02 21:47:43

标签: javascript if-statement switch-statement

我有一个有趣的案例,每个人都认为他们知道javascript及其切换以及if语句如此之好。这就是它应该正常工作的方式:

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

这非常简化。使用switch语句,它是这样的:

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

但是,当我尝试执行switch语句时,正如我所知,为了替换很多if语句,我突然似乎无法使其工作。当然,这个问题已被问过很多次,但所有代码都不同,并且没有一致的模式,所以我自己也无法在网上找到它。

下面的代码应该输出英雄未被确认具有正确的值:

<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

我愿意回答你对这个有趣场景的许多问题。也许我忽略了一些东西,但我不太确定它是什么。

问候,帕特里克

2 个答案:

答案 0 :(得分:3)

这是因为你在switch语句中使用的值是text。

在控制台中尝试:

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

您应该使用switch(parseInt(a))

答案 1 :(得分:1)

正在发生的事情是,您已经习惯了javascript来比较您的意图,而不是您所说的内容。

这种现象称为type coercion,当您使用==(2x =)运算符而不是===(3x =)时会发生此现象。

当您使用==时,例如在'1' == 1中,其中一个值会转换为另一个的类型(这称为coercion),因此 - 在此示例中 - 实际比较为'1' == '1',结果为true

如果您使用===进行比较,则类型的值必须相等,因此'1' === 1将导致{{ 1}}。

false不会执行此操作switch,因此它的行为就像您使用coercion进行比较一样(其中值类型必须是平等的。)

为了使===正常工作,您必须确保提供给switch的值与您在switch(value)中使用的值具有相同的类型。

您的代码使用

从DOM(表单)中获取值
case

哪个将始终是字符串类型,因此您必须在您的情况下使用字符串(例如waarde = document.getElementById("heroes").value )或将从DOM获得的值转换为数字(例如case '1':({{ 3}}))

the radix argument is important!