JavaScript的流程控制和迭代语句
in Note with 0 comment
笔记 JavaScript 复习回顾 流程控制 迭代语句
JavaScript的流程控制和迭代语句
in Note with 0 comment

笔记 JavaScript 复习回顾 流程控制 迭代语句

语句块

{
   statement_1;   statement_2;
   statement_3;
   ...
   statement_n;
}

这里 { ...; } 就是语句块。

var x = 1;
{
  var x = 2;
}
alert(x); // 输出的结果为 2

var 定义的变量是声明局部和全局的
let 定义的变量是块作用域的

条件判断语句

if...else

一种条件判断

if (condition) {
  statement_1;
}
[else {
  statement_2;
}] //推荐使用严格的语句块模式，语句else可选

多种条件判断

if (condition_1) {
  statement_1;
}
[else if (condition_2) {
  statement_2;
}]
...
[else if (condition_n_1) {
  statement_n_1;
}]
[else {
  statement_n;
}]

下面这些值将被计算出 false

例子

function checkData() {
  if (document.form1.threeChar.value.length == 3) {
    return true;
  } else {
    alert("Enter exactly three characters. " +
      document.form1.threeChar.value + " is not valid.");
    return false;
  }
}

switch 语句

switch (expression) {
   case label_1:
      statements_1
      [break;]
   case label_2:
      statements_2
      [break;]
   ...
   default:
      statements_def
      [break;]
}

查找一个与 expression 匹配的 case 语句，如果找到了，就跳到该子句，然后执行相关的语句，然后跳出 switch

例子

switch (fruittype) {
   case "Oranges":
      document.write("Oranges are $0.59 a pound.<br>");
      break;
   case "Apples":
      document.write("Apples are $0.32 a pound.<br>");
      break;
   case "Bananas":
      document.write("Bananas are $0.48 a pound.<br>");
      break;
   case "Cherries":
      document.write("Cherries are $3.00 a pound.<br>");
      break;
   case "Mangoes":
   case "Papayas":
      document.write("Mangoes and papayas are $2.79 a pound.<br>");
      break;
   default:
      document.write("Sorry, we are out of " + fruittype + ".<br>");
}
document.write("Is there anything else you'd like?<br>");

循环语句

循环流程控制语句有：

for语句

for ([initialExpression]; [condition]; [incrementExpression])
   statement

例子

<script type="text/javascript">
function howMany(selectObject) {
   var numberSelected = 0;
   for (var i = 0; i < selectObject.options.length; i++) {
      if (selectObject.options[i].selected)
         numberSelected++;
   }
   return numberSelected;
}
</script>
<form name="selectForm">
   <p>
      <strong>Choose some music types, then click the button below:</strong>
      <br/>
      <select name="musicTypes" multiple="multiple">
         <option selected="selected">R&B</option>
         <option>Jazz</option>
         <option>Blues</option>
         <option>New Age</option>
         <option>Classical</option>
         <option>Opera</option>
      </select>
   </p>
   <p>
      <input type="button" value="How many are selected?"
         onclick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))"/>
   </p>
</form>

do...while 语句

do
   statement
while (condition);

语句（statement）会在条件判断前执行一次

while 语句

while (condition)
   statement

例子

n = 0;
x = 0;
while (n < 3) {
   n++;
   x += n;
}

使用 while 语句需要确保避免死循环，也就是确保循环里的条件最终会变为false

标签语句

label 提供了一个可以让你引用到您程序别的位置的标识符

label :
   statement

例子,标记 markLoop 标识了一个 while 循环

markLoop:
while (theMark == true) {
   doSomething();
}

中断语句

使用 break 语句来终止循环 switch， 或者是链接到 label 语句

break;
break label;

普通例子

for (i = 0; i < a.length; i++) {
   if (a[i] == theValue)
      break;
}

中断跳到标签语句的例子

var x = 0;
var z = 0
labelCancelLoops: while (true) {
    console.log("Outer loops: " + x);
    x += 1;
    z = 1;
    while (true) {
        console.log("Inner loops: " + z);
        z += 1;
        if (z === 10 && x === 10) {
            break labelCancelLoops;
        } else if (z === 10) {
            break;
        }
    }
}

连续语句

使用 continue 语句可以用来重新开始一个 while， do-while， for， 或者 label 语句

continue;
continue label;

普通例子

var i = 0;
var n = 0;
while (i < 5) {
  i++;
  if (i == 3) {
    continue;
  }
  n += i;
}

连续到标签语句的例子

checkiandj:
  while (i < 4) {
    console.log(i);
    i += 1;
    checkj:
      while (j > 4) {
        console.log(j);
        j -= 1;
        if ((j % 2) == 0) {
          continue checkj;
        }
        console.log(j + " is odd.");
      }
      console.log("i = " + i);
      console.log("j = " + j);
  }

对象操作语句

for...in 语句

for...in 语句循环一个指定的变量来循环一个对象所有可枚举的属性

for (variable in object) {
   statements
}

例子，如下的函数中传递了两个参数：一个对象和这个对象的名称，然后循环了这个对象的属性，最后得到一个列出了这个对象所有的属性名称和值的字符串

function dump_props(obj, obj_name) {
   var result = "";
   for (var i in obj) {
      result += obj_name + "." + i + " = " + obj[i] + "<br>";
   }
   result += "<hr>";
   return result;
}

for each...in 语句

和for...in相似，但是让对象属性的值递回取得，而不是作用于它们的名字

var sum = 0;
var obj = {prop1: 5, prop2: 13, prop3: 8};
for each (var item in obj) {
  sum += item;
}
print(sum); // prints "26", which is 5+13+8

for...of 语句

for...of语句在可迭代的对象上创建了一个循环(包括Array, Map, Set, 参数对象（arguments）等等)，对值的每一个独特的属性调用一个将被执行的自定义的和语句挂钩的迭代

for (variable of object) {
  statement
}

for...in 循环遍历的结果是数组元素的下标，而for...of 遍历的结果是元素的值

let arr = [3, 5, 7];
arr.foo = "hello";
for (let i in arr) {
   console.log(i); // logs "0", "1", "2", "foo"
}
for (let i of arr) {
   console.log(i); // logs "3", "5", "7" // 注意这里没有 hello
}

阅读资料：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide

复习方式：实践(代码写一次、跑一次、测试一次)，不懂的地方谷歌，阅读和做笔记

底线原则：宁可重写一次，也不复制粘贴

本次复习内容有：流程控制、迭代语句

复习耗时：大概3小时···我也不知道为什么这么久···

本文由 Chakhsu Lau 创作，采用 知识共享署名4.0 国际许可协议进行许可。
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名。

← → ↓ ↑
Responses