1、JS流程控制语句
(1)、if 判断
if 语句是基于条件成立时才执行相应的代码。
if...else 语句是在指定的条件成立时执行if后的代码，在条件不成立时执行else后的代码。
if...else 嵌套语句是在多种条件下选择相应的代码快之一来执行。
if 语句适用于任意类型的数据，可处理复杂的逻辑关系。
(2)、switch语句
当有很多种选择的时候，switch 比 if...else 使用更方便，结构简洁，专为多重选择设计，但是仅能处理多个枚举型逻辑关系。该语句使用 if 也可以完成，这个看个人喜好。
switch 语句的工作原理：首先创建一个表达式，通常为变量，之后表达式的值与 switch 语句中每个 case 的值做比较，如果匹配，则执行该 case 后的语句，若与所有 case 值都不匹配，则执行 default 后的语句。在使用 switch 语句时，每个 case 语句后必须使用 break 跳出循环，阻止运行下一个 case。
var d = new Date().getDay(); //如果今天不是周末，则提示默认消息
switch (d){
case 6:
alert("今天是星期六");
break;
case 0:
alert("今天是星期天");
break;
default:
alert("同志尚未努力，革命仍需成功。");
}Salin selepas log masuk
switch 语句在做比较时，使用的是全等，而不是相等，所以在字符串与数字匹配时，需要特别注意。
//使用switch语句将字符串与数字做比较
//返回：不等于，执行default语句
var n = '5'; switch(n){
case 5:
alert('等于，执行case语句');
break;
default:
alert('不等于，执行default语句'); }
//使用if语句将字符串与数字做比较
//返回：等于
var n = '2'; if(n == 2){
alert('等于');
}else{
alert('不等于');
}
//将case的值改为字符串再做比较
//返回：等于，执行case语句
var n = '2'; switch(n){
case '2':
alert('等于，执行case语句');
break;
default:
alert('不等于，执行default语句');
}
//使用全等再做比较
//返回：不等于
var n = '2';
if(n===2){
alert('等于'); }else{
alert('不等于'); }Salin selepas log masuk
(3)、for 循环
很多事情不只是做一次，需要重复做。比如打印 10 份文件，每次打印 1 份，重复这个动作，直到打印完成。这样的事情就用 for 循环来完成，循环就是重复执行一段代码，每次的值不同。
下面是一个 for 循环的小应用，假设有 1.2.3. ... 10 不同面值的 RMB，计算一共有多少 RMB。
var sum = 0; for(var rmb=1; rmb<=10; rmb++){
sum += rmb; } alert('一共有: ' + sum + '元'); //返回：一共有：55元Salin selepas log masuk
(4)、while 循环
while 循环和 for 循环具有相同的功能，只要指定条件为 ture，循环就可以一直执行，直到条件不再满足。
//使用while循环输出5个数字
var i = 0; //第一部分：初始化，给一个初始的值，让i从0循环
while(i < 5){ //第二部分：条件。成立继续循环，不成立退出
alert(i); //第三部分：语句
i++; //第四部分：自增
} //while循环使用比较复杂，使用for循环更简洁。
//for(初始化;条件;自增){语句}Salin selepas log masuk
(5)、do...while 循环
do...while 循环与 while 循环的原理结构是基本相同的，但是该循环会在检查条件是否为 ture 之前执行一次代码块，如果条件为 ture，则重复循环。该循环有一点小问题，因为他是先执行代码，后判断条件，如果条件不当，则进入死循环，导致浏览器崩溃。
/*
语法： do{ 执行语句 } while(条件); */
//操作有风险，尝试需谨慎
//若将循环条件改为：num <= 6 会导致浏览器崩溃
var num = 6; do{ document.write("数字:" + num + "<br>"); num -= 1; } while(num > 0);Salin selepas log masuk
(6)、JS 错误处理语句
try...catch 语句用于进行异常处理。try 语句用于检测代码块的错误，指明需要处理的代码段，catch 语句用于处理 try 语句中抛出的错误。try 语句首先被执行，如果运行中发生了错误，try 语句中的代码将被跳过执行 catch 中的语句。如果没有发生错误，则不执行 catch 中的语句。一般针对可预见性的错误，可使用 try...catch 语句进行处理。
try{
document.write("开始执行try语句" + '<br>');
document.write("还没抛出错误" + '<br>');
alert(x); //抛出错误
alert('123'); //没被执行
} catch(e){
document.write("捕捉到错误，开始执行catch语句" + '<br>');
document.write("错误类型: " + e.name + '<br>');
document.write("错误信息: " + e.message);
alert('x'); }Salin selepas log masuk
throw 语句可用于创建自定义错误。官方术语为：创建或抛出异常(exception)。语法：throw '异常对象'。
throw 语句可以配合 try...catch 语句一起使用，以达到控制程序流，生成精确的错误消息。
//输入0到10之间的数字，如果输入错误，会抛出一个错误，catch会捕捉到错误，并显示自定义的错误消息。
<body>
<input id="txt" type="text"/>
<span id="demo" style="font-weight:bold;"></span><br>
<input type="button" value="检测输入" onclick="error()">
<script> function error(){
try{
var x = document.getElementById("txt").value;
var y = document.getElementById("demo");
y.style.color = 'red';
if(x == '') throw '输入不能为空';
if(isNaN(x)) throw '请输入数字';
var num = [7,8,9];
for(var i=0; i<num.length; i++){
if(x == num[i]){
throw '该数字已经存在';
}
}
if(x == 0){
throw '输入不能为0';
}
else if(x > 10){
throw '数字太大了';
}
else if(x <= 3){
throw '数字太小了';
}
else{
y.style.color = 'green';
y.innerHTML = 'OK';
}
}
catch(e){
y.innerHTML = '错误提示：' + e + '！';
}
}
</script>
</body>Salin selepas log masuk
(7)、跳出循环
break 语句用于跳出当前循环，直接退出循环执行后面的代码，即终止整个循环，不再进行判断。continue 语句仅仅是跳出本次循环，继续执行后面的循环，即结束本次循环，接着去判断是否执行下次循环。return 可以终止函数体的运行，并返回一个值。
for(var i=0; i<6; i++){ if(i == 3) break; //当i=3时跳出整个循环，不再执行循环
alert(i); //返回：0,1,2
}
for(var i=0; i<6; i++){ if(i == 3) continue; //当i=3时跳出本次循环，继续执行后面循环
alert(i); 返回：0,1,2,4,5
}Salin selepas log masuk
2、JSON
JSON(JavaScript Object Notation)：JS 对象表示法。JSON 主要用于存储和交换数据信息，类似于 XML，但是相比 XML，JSON 易于阅读和编写，也易于解析。
JSON 语法是 JS 对象表示语法的子集：数据在键值对中，并由逗号分隔，花括号保存对象，方括号保存数组。
JSON 语法的书写格式："名称" : "值", "名称" : "值"
名称和值包含在双引号中，并用冒号分隔，每条数据用逗号分隔。这很容易理解，相对于 JS 中 名称 = "值"。
JSON 的值可以是：数字(包括整数和小数)，字符串(包含在双引号中)，布尔值(true 或 false)，对象(包含在花括号中)，数组(包含在方括号中)，或者为 null。
JSON 是纯文本，通常用于服务端向网页传递数据，从服务器上获取 JSON 数据，然后在网页中使用该数据。
(1)、JSON对象
var json = {"a": 12, "b": "abc", "c":[1,2,3]}; //返回第一项的值：
alert(json.a);
//修改第二项的值
alert(json.b = "xyz");
//返回第三项数组中第一项的值
alert(json.c[0]);Salin selepas log masuk
(2)、JSON 和数组
相同点：
都可以通过下标返回某项的值。都可以使用循环。虽然 JSON 没有 length 属性，不能使用 for 循环，但是可以使用 for...in 循环，完成与 for 循环相同的动作。
数组也可以使用 for...in 循环，但最好还是使用 for 循环。for...in 循环遍历的是对象的属性，而不是数组元素。
不同点：
JSON 的下标是字符串，数组的下标为数字。JSON 没有 length 属性，数组有该属性。
var arr = [12,5,7]; var json = {"a":12,"b":5,"c":7};
alert(arr[0]); //返回：12
alert(json["a"]); //返回：12
alert(arr.length); //返回：3
alert(json.length); //返回：undefined
//数组for循环
for(var i=0; i<arr.length; i++){ alert('第' + (i+1) + '个数据是：' + arr[i]); } alert(typeof i); //返回：number
//数组使用for...in循环
for(var i in arr){ alert('第' + (i+1) + '个数据是：' + arr[i]); } alert(typeof i); //返回：string
//JSON使用for...in循环
for(var i in json){ alert('第' + i + '个数据是：' + json[i]); }Salin selepas log masuk
(3)、JSON 数组对象
<body>
<p>
姓 名: <span id="fname"></span><br>
性 别: <span id="gender"></span><br>
员工号: <span id="num"></span><br>
修改姓名: <span id="lname"></span><br>
</p>
<script> var staff = [ {"name" : "小明", "sex" : "男", "id" : 1},
{"name" : "小白", "sex" : "男", "id" : 2},
{"name" : "小红", "sex" : "女", "id" : 3} ];
var x = document.getElementById("fname");
var y = document.getElementById("gender");
var z = document.getElementById("num");
var n = document.getElementById("lname"); //访问对象数组中第一项的值：
x.innerHTML = staff[0].name; y.innerHTML = staff[0].sex; z.innerHTML = staff[0].id;
//修改数据：
n.innerHTML = staff[1].name = '大白'; </script>
</body>Salin selepas log masuk
(4)、JSON 字符串对象
var str = '{"name":"小明", "sex":"男", "age":21}';
var toObj = JSON.parse(str); //JSON字符串转换为JSON对象alert(toObj.name);
alert(typeof toObj); //返回：object
var json = {"name":"小红", "sex":"女", "age":18};
var toStr = JSON.stringify(json); //JSON对象转换为JSON字符串
alert(toStr); //返回字符串alert(json.age);
alert(typeof toStr); //返回：stringSalin selepas log masuk
(5)、JSON 应用
当需要表示一组数据时，JSON 不但能够提高可读性，而且还可以减少复杂性。JSON 能够表示多个值，每个值又可包含多个值，例如要表示一个用户列表信息，就可以将所有信息存储在一个变量中，分成多项，每项中又可分成多个条目，每个条目中记录一个用户的信息。
var userName = {
"first": [{
"name": "路飞",
"sex": "男",
"tel": "aaa"
}, {
"name": "索罗",
"sex": "男",
"tel": "bbb"
}, {
"name": "娜美",
"sex": "女",
"tel": "ccc" }],
"second": [{
"name": "卡卡西",
"sex": "男",
"tel": "ddd"
}, {
"name": "鸣人",
"sex": "男",
"tel": "fff"
}, {
"name": "佐助",
"sex": "男",
"tel": "eee"
}, {
"name": "皱田",
"sex": "女",
"tel": "sss"
}],
"third": [{
"name": "小明",
"sex": "男",
"tel": "xxx"
},{
"name": "小红",
"sex": "女",
"tel": "zzz"
}]
};
//获取用户的信息：
alert(userName.first[1].name + ' \n ' + userName.first[1].sex + '\n '+ userName.first[1].tel);
alert(userName.second[3].name + ' \n ' + userName.second[3].sex +' \n '+ userName.second[3].tel);
alert(userName.third[0].name + ' \n ' + userName.third[0].sex + ' \n '+ userName.third[0].tel);Salin selepas log masuk
说到 JSON，就不得不提一下 JSONP。JSONP (JSON with Padding) 是 JSON 的一种 "使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。可用于解决主流浏览器的跨域数据访问的问题。为什么我们从不同的域（网站）访问数据需要一个特殊的技术 (JSONP) 呢？这是因为同源策略。同源策略，它是由 Netscape 提出的一个著名的安全策略，现在所有支持 JavaScript 的浏览器都会使用这个策略。由于该策略，一般来说位于 server1 的 demo.com 的网页无法与不是 server1 的 demo.com 的网页的服务器沟通，而 HTML 的
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
