JavaScript学习笔记（九）——语句
语句
1、定义：
表达式-----最简单的语句，
单语句：只有一条语句，每一个单语句结尾都要加分号；
复合语句：多条单语句组成 ； 语句组成程序。
空语句：啥都不写 ；
2、if语句：
js的执行引擎：如果执行体只有一条语句，可以省略执行体。
if-else if -else 语句 不是js的标准语法，是程序员利用js引擎的纠错功能实现的。
var a = 20;
if (a < 18) {
alert('未成年');
} else if (a > 22) {
alert('可以喝酒结婚')
} else {
alert('可以喝酒');
}
3、switch语句
switch 语句用于基于不同的条件来执行不同的动作。
使用 switch 语句来选择要执行的多个代码块之一。
语法如下：
switch(n) {
case 10: 执行代码块 1
break;
case 20: 执行代码块 2
break;
default: 与 case 1 和 case 2 不同时执行的代码
}工作原理：首先设置表达式 n（通常是一个变量）。随后表达式的值会与结构中的每个 case 的值做比较。如果存在匹配，则与该 case 关联的代码块会被执行。请使用 break 来阻止代码自动地向下一个 case 运行。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>switch语法</title>
</head>
<body>
<p>点击下面的按钮来显示今天是周几：</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
var x;
var d=new Date().getDay();
switch (d){
case 0:x="今天是星期日";
break;
case 1:x="今天是星期一";
break;
case 2:x="今天是星期二";
break;
case 3:x="今天是星期三";
break;
case 4:x="今天是星期四";
break;
case 5:x="今天是星期五";
break;
case 6:x="今天是星期六";
break;
}
document.querySelector("demo").innerHTML=x;
}
</script>
</body>
</html>·使用 default 关键词来规定匹配不存在时做的事情
switch 和 if 语句区别：
switch 更具有业务性
if语句 更具有逻辑性
4、 for语句（重要）
循环可以将代码块执行指定的次数。
如果希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的。
我们可以这样输出数组的值：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>for循环</title>
</head>
<body>
<script>
cars=["BMW","Volvo","Saab","Ford"];
for (var i=0;i<cars.length;i++){
document.write(cars[i] + "<br>");
}
console.log(i)
</script>
</body>
</html>不同类型的循环
JavaScript 支持不同类型的循环：
-
for - 循环代码块一定的次数
-
for/in - 循环遍历对象的属性
-
while - 当指定的条件为 true 时循环指定的代码块
-
do/while - 同样当指定的条件为 true 时循环指定的代码块
for循环
for 循环是在希望创建循环时常会用到的工具。
语法如下：
for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}
for (语句 1; 语句 2;)
{
被执行的代码块;
语句 3;
}-
语句 1 （代码块）循环开始前执行 starts.
-
语句 2 定义运行循环（代码块）的条件
-
语句 3 在每次循环（代码块）已被执行之后执行
考点：
//分析下面的结果 ？
//第一题
var i = 0;
for (; i++, i < 5;) {
console.log(i);
} //1 2 3 4
//第二题：闭包的作用域
var arr = [];
for (var i = 0; i < 4; i++) {
arr[i] = function () {
console.log(i)
};
}
arr[0]() //结果：4
arr[1]() //结果：4
/* 原因：
var arr=[]{
var i=0; //变成1,2,3
if(i<4){
arr[0] = function() {console.log(i)}
//不取值 函数没有调用
i=i+1;
if(1<4){
arr[1] = function() {console.log(i)}
i=i+1;
...
if(4<4){
} else{跳出循环}
}
}
}
最后执行 arr[0]() // 其实就是i在运行过程中一直在变化 最后加到了4
*/
for (var j = 0; j < 4; j++) {
arr[j];
}
//第三题
for (var i = 0, j = 6; i < 4, j > 0; i++, j--) {
console.log(i);
} //考点：由j>0控制 ,一共打印5次
//结果 j:6 5 4 3 2 1 i输出：0 1 2 3 4 5
//for中的业务条件筛选
var arr = [{
age: 21,
name: 'karen',
rank: 580
},
{
age: 10,
name: 'jack',
rank: 380
},
{
age: 12,
name: 'marry',
rank: 540
},
{
age: 23,
name: 'rose',
rank: 880
}
]
/* //1.打印名字
for (var i = 0; i < arr.length; i++) {
console.log(arr[i].name);
} */
//2.打印大于18岁的名字
for (var i = 0; i < arr.length; i++) {
if (arr[i].age > 18) {
console.log(arr[i].name);
}
}
//3.打印年龄大于18 rank 大于480 的名字
for (var i = 0; i < arr.length; i++) {
if (arr[i].age > 18 && arr[i].rank > 480) {
console.log(arr[i].name);
}
}
//4.打印年龄小于18 rank大于400的对象的名字 拼接一个字符串“少年班” 大于18 且rank大于480 的普通班 其余的啥也不是
for (var i = 0; i < arr.length; i++) {
if (arr[i].age < 18 && arr[i].rank > 480) {
console.log(arr[i].name + '少年班');
} else if (arr[i].age >= 18 && arr[i].rank > 480) {
console.log(arr[i].name + '普通班');
} else {
console.log(arr[i].name + '啥也不是');
}
}for循环嵌套思想：
-
不要管内部外部for 的执行问题，重点关注每一个for都是遍历自己的数组；
-
for 内部有条件语句和数据处理得到的数组，然后用for遍历
-
for大括号会执行数组的元素个数这么多次，每次执行时 i 就是元素的下标。
5、while 语句
-
语法
while (A) { 业务需要执行的代码 } //A判定为真，执行业务 循环 //A判定为假，直接结束while语句 var i=0 for(;i<len;){ //需要执行的代码 i++; } -
怎样判断选择while和for 循环？
-
while循环：如果有一个业务需要重复执行，但是总有一次执行会让他停下来不再执行，不知道循环次数。
-
for 循环： 一个业务需要重复执行，但是是已知次数。
-
6、continue和break 语句
-
break 语句用于跳出循环。
-
continue 用于跳过循环中的一个迭代，继续执行下一个迭代（如果有的话）。
break 语句举例如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <p>点击按钮，测试带有 break 语句的循环。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction(){ var x="",i=0; for (i=0;i<10;i++){ if (i==3){ break; } x=x + "该数字为 " + i + "<br>"; } document.getElementById("demo").innerHTML=x; } </script> </body> </html>continue 语句举例如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <p>点击下面的按钮来执行循环，该循环会跳过 i=3 的步进。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction(){ var x="",i=0; for (i=0;i<10;i++){ if (i==3){ continue; } x=x + "该数字为 " + i + "<br>";//9行 } document.getElementById("demo").innerHTML=x; } </script> </body> </html>
7、 label 语句
标签语句，在语句之前加上冒号：可标记 JavaScript 语句。
语法如下：
label: statementsbreak 和 continue可以使用标签语句。
var a = 0;
forhere:
for (var i = 0; i < 10; i++) {
for (var j = 0; j < 10; j++) {
if(j == 5){
break forhere;
//这里终止的是外面的for循环
//体会continue、break后面加和不加语句标签的区别；
}
a++;
}
}
console.log(a);
并且：
continue 语句（带有或不带标签引用）只能用在循环中。
break 语句（不带标签引用），只能用在循环或 switch 中。
通过标签引用，break 语句可用于跳出任何 JavaScript 代码块：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
cars=["BMW","Volvo","Saab","Ford"];
list:{
document.write(cars[0] + "<br>");
document.write(cars[1] + "<br>");
document.write(cars[2] + "<br>");
break list;
document.write(cars[3] + "<br>");
document.write(cars[4] + "<br>");
document.write(cars[5] + "<br>");
}
</script>
</body>
</html>8、throw抛出异常
1.立即停止正在执行的程序，跳转至就近的逻辑异常处理程序。
例子：
function factorial (n) {
if(isNaN(n)) throw new Error('请输入数字，HOHO');
if(n == 1) return 1;
return n*factorial(n-1);//递归
}
var n = factorial(3);//3*factorial(2)--3*2*factorial(1)--3*2*1
console.log(n);//6
var n = factorial('a05');
console.log(n);
var n = factorial(5);
console.log(n);2.throw抛出异常该异常可以是 JavaScript 字符串、数字、逻辑值或对象。
3.js语言，是脚本语言，当运行过程终于到了错误就停止运行后面的代码。
9、try-catch-finally语句
-
try-catch-finally是JavaScript的异常处理机制。
-
语法
try{ //我们自认为没有错误的 处理业务的代码 } catch(e){ //上面的业务处理代码报错了，这里才会执行 //console.log(e); } finally{ //这里总是会执行的，理解为领导总结发言 } //语句 不会影响到后面代码的执行。异常对象e里面有两个属性name和message，分别代表错误类型和错误描述信息。
-
例子
try { console.log(1); throw new Error('出错了'); console.log(2); //不会打印2 } catch (e) { console.log(e.message); //打印throw里面的内容，里面写其他的字符串也行 } finally { console.log(4); }
10、with语句(了解)
例子：
<script>
var a = 20;
var b = 10;
console.log(window.b); //window 全局变量 可省略
var obj = {
age: 20,
name: "karen"
};
with(obj) {
console.log(name);
}
/* //我们平常使用的这里代码有一个隐式操作 with（window）{
} */
console.log(age); //报错
</script>不建议使用，语法有性能问题，es6 解决了这个问题
新技术：解构赋值
var {age,name}=obj;
console.log(age)
