300字范文 > 6 语句（if switch for while for...in/of do-while break continue label return throw try-catch-finally w

6 语句（if switch for while for...in/of do-while break continue label return throw try-catch-finally w

时间：2021-03-28 21:49:22

语句

一、 if语句

1. if 语句

2. if...else 语句

3.if...else if....else 语句

二、 switch语句

三、 for语句

四、 while语句

五、 for...in/of语句

六、 do-while语句

七、 break和continue语句

八、 label 语句

九、 return语句

十、 throw抛出异常

十一、try-catch-finally语句

十二、 with语句

语句

单语句：一行代码中有多个单语句，那么每一个但语句结尾都要以分号结尾(也可以不加分号）
eg：var a=20+30;a=30; for(){};
复合语句：if(){};if(){}
空语句：； for(var a=20;a<200;){console.log(a);}
语句组成程序

一、 if语句

条件语句用于基于不同的条件来执行不同的动作。 //更具有逻辑性
通常在写代码时，总是需要为不同的决定来执行不同的动作。我们可以在代码中使用条件语句来完成该任务。

在 JavaScript 中，我们可使用以下条件语句：
if 语句- 只有当指定条件为 true 时，使用该语句来执行代码
if...else 语句- 当条件为 true 时执行代码，当条件为 false 时执行其他代码
if...else if....else 语句- 使用该语句来选择多个代码块之一来执行
switch 语句- 使用该语句来选择多个代码块之一来执行

1. if 语句

if需要小写。使用大写字母（IF）会生成 JavaScript 错误！

只有当指定条件为 true 时，该语句才会执行代码。
语法如下：
if (condition){*当条件为 true 时执行的代码*}

<!DOCTYPE html><html><head><meta charset="utf-8"><title>if语句</title></head><body><p>如果时间早于 20:00，会获得问候 "Good day"。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var x="";var time=new Date().getHours();//获取小时//getFullYear()、getMonth()+1、getDate()、getDay()、getHours()、getMinutes()、getSeconds()、getTime()if (time<20){x="Good day";}document.querySelector("#demo").innerHTML=x;}</script></body></html>

在这个语法中，没有 ..else..。告诉浏览器只有在指定条件为 true 时才执行代码。

2. if...else 语句

js的执行引擎：如果执行体只有一个语句可以省略执行体
使用 if....else 语句在条件为 true 时执行代码，在条件为 false 时执行其他代码。
语法如下：
if (condition){当条件为 true 时执行的代码}else{当条件不为 true 时执行的代码}

<!DOCTYPE html><html><head><meta charset="utf-8"><title>if...else</title></head><body><p>点击这个按钮，获得基于时间的问候。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var x="";var time=new Date().getHours();if (time<20){x="Good day";}else{x="Good evening";}document.getElementById("demo").innerHTML=x;}</script></body></html>

3.if...else if....else 语句

使用 if....else if...else 语句来选择多个代码块之一来执行。
语法如下：
if (condition1){当条件 1 为 true 时执行的代码}else if (condition2){当条件 2 为 true 时执行的代码}else{当条件 1 和条件 2 都不为 true 时执行的代码}

<html><head><meta charset="utf-8"><title></title></head><body><script type="text/javascript">var d = new Date();var time = d.getHours();if (time<12){document.write("<b>早上好</b>");}else if (time>=12 && time<18){document.write("<b>今天好</b>");}else{document.write("<b>晚上好!</b>");}</script><p>这个例子演示了 if..else if...else 语句。</p></body></html>

var a=27;if(a<18){console.log("未成年");}else{if(a>22){console.log("可以喝酒结婚");}else{consloe.log("可以喝酒");}}//上面的代码可以写为下面这样的var a=27;if(a<18){console.log("未成年");}else if(a>22){console.log("可以喝酒结婚");}else{consloe.log("可以喝酒");}

把第二个if 写为else if就可以了

二、 switch语句

switch 语句用于基于不同的条件来执行不同的动作。更具有业务行
使用 switch 语句来选择要执行的多个代码块之一。
语法如下：
switch(n) {case 10: 执行代码块 1break; case 20: 执行代码块 2break; default: 前面都没执行就执行这个default}

工作原理：首先设置表达式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 关键词
使用 default 关键词来规定匹配不存在时做的事情：

<html><head><meta charset="utf-8"><title>switch的default</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 6:x="今天是星期六";break;case 0:x="今天是星期日";break;default:x="期待周末";}document.getElementById("demo").innerHTML=x;}</script></body>

三、 for语句

for没有作用域
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 在每次循环（代码块）已被执行之后执行

<!DOCTYPE html><html><head><meta charset="utf-8"><title>循环语法</title></head><body><p>点击按钮循环代码5次。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var x="";for (var i=0;i<5;i++){x+= + "该数字为 " + i + "<br>";}document.getElementById("demo").innerHTML=x;}</script></body></html>

语句 1
通常我们会使用语句 1 初始化循环中所用的变量 (var i=0)。
语句 1 是可选的，也就是说不使用语句 1 也可以。
您可以在语句 1 中初始化任意（或者多个）值：
<!DOCTYPE html><html><head><meta charset="utf-8"><title>for循环-语句1可选</title></head><body><script>cars=["BMW","Volvo","Saab","Ford"];var i=2,len=cars.length;for (; i<len; i++){document.write(cars[i] + "<br>");}</script></body></html>

语句 2
通常语句 2 用于评估初始变量的条件。
语句 2 同样是可选的。
如果语句 2 返回 true，则循环再次开始，如果返回 false，则循环将结束。
如果省略了语句 2，那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。

语句 3 在每次循环（代码块）已被执行之后执行。
通常语句 3 会增加初始变量的值。
语句 3 也是可选的。
语句 3 有多种用法。增量可以是负数 (i--)，或者更大 (i=i+15)。
语句 3 也可以省略（比如当循环内部有相应的代码时）：
<!DOCTYPE html><html><head><meta charset="utf-8"><title>for循环-语句3可选</title></head><body><script>cars=["BMW","Volvo","Saab","Ford"];var i=0,len=cars.length;for (; i<len; ){document.write(cars[i] + "<br>");i++;}</script></body></html>

被执行的代码块
被执行的代码块可以是用大括号将多条语句括起来的复合语句；
也可以是空语句，举例如下：
var h = new Array(5);//[,,,,,]console.log(h.length);//5for (var i = 0; i < h.length; h[i++]=i);console.log(h);

实现取出一个奇数的数组
方法一：性能不好，因为全部都要执行
for (var i=0;i<arr,length;i++) {if(arr[i]%2 != 0) {console.log(i)}}
方法二：性能较好，只用执行一些

表达式中出选择题：

1、

var i=0;for(;i++,i<5;){consloe.log(i);} //结果为1234

2、

for(var i=0,j=6;i<4,j>0;i++,j--){ //就算i<4不成立了，但是爷要执行j>0，因为是逗号，总会执行console.log(i);}//0 1 2 3 4 5

3、

//考的是闭包和作用域var arr=[];for(var i=0;i<4;i++){arr[i]=function(){console.log(i)}} //函数不会运行，因为没有调用arr[0](); //结果为4arr[1](); //结果为4，因为变量只有一个// for(var j=0;j<4;j++){//arr[j]();//调用函数// }

小练习：
1、循环个数组var size=[1,2,3,4,5,6,7]，输出数组的每个元素到页面上；2、写个乘法口诀表；3、百钱百鸡公鸡5文钱一只，母鸡3文钱一只，小鸡1文钱三只，用100文钱买100只鸡，问，公鸡，母鸡，小鸡各几只？

写代码才是关键，再出个题，练习一下：
写一个方法，求一个字符串的字节长度。（提示：字符串有一个方法charCodeAt();一个中文占两个字节，一个英文占一个字节）。定义和用法charCodeAt()方法可以返回指定位置的字符的Unicode编码。这个返回值是0~65535之间的证书。（当返回值是<=255时为英文字符，当返回值是>255时为中文）语法stringObject.charCodeAt(index)eg:<script type="javascript/text">var str="Hello world!!"document.write(str.charCodeAt(1));//输出101，字母e对应的Unicode编码为101</script>

for中的业务条件筛选和数据处理

for的嵌套和业务混合

1、不要管内部的for与外部的for的执行问题，而是关注每一个for都是遍历的自己的数组

2、for内部有条件语句和数据处理，得到一个数组，然后用for去遍历它

（1)

var arr2=[{name:"karen"},{name:"jack"},{name:"marry"}];//取出数组中的每一个对象for(var i=0;i<arr2.length;i++){console.log(arr2[i]);}//取出数组中的每一个对象的名字for(var i=0;i<arr2.length;i++){console.log(arr2[i].name);}

(2)

var arr3=[100,200,300,[2,3,5,4],{name:"karen"}];// //取出arr3数组的每一个元素// for(var i=0;i<arr3.length;i++){//console.log(arr3[i]);// }//取出arr3数组中的每一个元素（如果是数组，再取出数组中的元素）for(var i=0;i<arr3.length;i++){// console.log(arr3[i]);if(arr3[i] instanceof Array){// consloe.log(arr3[i]);for(var j=0;j<arr3[i].length;j++){console.log(arr3[i][j]);}}else{console.log(arr3[i]);}}

(3)

把所有的都取出来

(4) 联动数据

四、 while语句

while 循环会在指定条件为真时循环执行代码块。

while：如果有一个业务需要重复执行，但是总有一次执行会让它停下来就不再执行，就用while。（for循环能做的事情，while都能做，而while能做的，不一定for能做）
for ：一个业务需要重复执行，但是是已知次数

语法如下：
条件判定为true，执行需要执行的代码，然后再重复；条件判定为false直接借宿while循环语句
while (条件){需要执行的代码}var i=0for(;i<len;){//需要执行的代码i++;}

下例中的循环将继续运行，只要变量 i 小于 5：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title></head><body><p>点击下面的按钮，只要 i 小于 5 就一直循环代码块。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var x="",i=0;while (i<5){x=x + "该数字为 " + i + "<br>";i++;}document.querySelector("#demo").innerHTML=x;}</script></body></html>

小练习：
假设某人有100,000现金。每经过一次路口需要进行一次交费。交费规则为：当他现金大于50,000时每次需要交5%；如果现金小于等于50,000时每次交5,000。请写一程序计算此人可以经过多少次这个路口。

五、 for...in/of语句

JavaScript for/in 语句循环遍历对象的属性：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title></head><body><p>点击下面的按钮，循环遍历对象 "person" 的属性及其值值。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var x;var txt="";var person={fname:"Bill",lname:"Gates",age:56}; for (x in person){txt=txt + x+ "："+person[x]+"<br>";}document.getElementById("demo").innerHTML=txt;var arr = [1,2,3,4,5];//arr[0]=1for(var i in arr){console.log(i);console.log(arr[i]);}}</script></body></html>

看看下面的代码会发生什么：

var personobj = {name: '你叫什么？',sex: '男',weight: '160'};var arr = new Array();//arr=[]var i = 0;for(arr[i++] in personobj);console.log(arr);

六、 do-while语句

do/while 循环是 while 循环的变体。该循环会在检查条件是否为真之前执行一次代码块，然后如果条件为真的话，就会重复这个循环。

语法如下：

do{需要执行的代码（不管下面是真还是假，都会执行这个一次）}while (条件);

下面的例子使用 do/while 循环。该循环至少会执行一次，即使条件为 false 它也会执行一次，因为代码块会在条件被测试前执行：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title></head><body><p>点击下面的按钮，只要 i 小于 5 就一直循环代码块。</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var x="",i=0;do{x=x + "该数字为 " + i + "<br>";i++;}while (i>0)document.getElementById("demo").innerHTML=x;}</script></body></html>

while 和 do/while 的区别 : do/while至少会执行一遍

七、 break和continue语句

break语句用于跳出循环。
continue用于跳过循环中的一个迭代，继续执行下一个迭代（如果有的话）。

结果为 5

结果为 3

结果为 0 1 2 4 如果没有continue那句，结果就是 0 1 2 3 4

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>

八、 label 语句

label就是给代码块取一个名字，但是一般都不用这个标签语法。

标签语句，在语句之前加上冒号：可标记 JavaScript 语句。

语法如下：
label: statements

break 和 continue可以使用标签语句。

var a = 0;forhere:for (var i = 0; i < 10; i++) {for (var j = 0; j < 10; j++) {if(j == 5){break forhere;//体会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>

结果为： 0 1 2 3 4 0 1 2 3 4 0 1 2 3 4 ....... (外面的for循环执行一次，里面就要循环5次）

结果为： 0 0 1 2 1 0 1 2 2 0 1 2 ....

结果为 0 01 2 4 1 0 1 2 4 2 0 1 2 4 ....

九、 return语句

return指定函数调用后的返回值。 function fn(){ return; }

所以，return只能在函数体内出现；return后面的代码不会再执行；所以如果要对一个函数断点调试时...你懂的...

断点设置在return之后，对于函数调试无意义。

十、 throw抛出异常

js语言是脚本语言，当运行的过程中遇到了错误就停止运行，后面的代码不再执行

立即停止正在执行的程序，跳转至就近的逻辑异常处理程序。

反正看不懂，写段代码看看：

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*1console.log(n);//6var n = factorial('a05');console.log(n);var n = factorial(5);console.log(n);

throw抛出异常该异常可以是 JavaScript 字符串、数字、逻辑值或对象。

结果为： uncaught 出错了，并且后面的代码也不会执行

十一、try-catch-finally语句

try-catch-finally是JavaScript的异常处理机制。

语法如下：

try{//我们自认为没有错误的处理业务的代码}catch(e){//上面的业务处理代码报错了，这里才会执行//console.log(e);}finally{//这里总是会执行的，领导总结发言}//语句

异常对象e里面有两个属性name和message，分别代表错误类型和错误描述信息。

瞄一眼小案例：

//var a = 90;try{console.log(a);}catch(e){console.log(e.name); //返回错误类型console.log(e.message); //错误描述}finally{console.log('大会到此结束');}

222不会执行，其他的都会

算平年/闰年

十二、 with语句

官方不建议使用，有代码不好优化、运行慢等问题；并且，严格模式下是不能使用with的。（后来的es6解决了这个性能问题，出了新技术：解构赋值 var {age,name}=obj;console.log(age)）

with语句用于临时扩展作用域链。
临时扩展作用域，临时；with代码块执行完成后恢复原始状态。

语法结构如下：
with(object){statement;}//将object添加到作用域链的头部，执行完成statement后，作用域链恢复到原始状态；

举例如下：

/**清空表单所有输入框的值*document.querySelector('.mydiv').style.fontSize = '20px'; *document.querySelector('.mydiv').style.color = 'red'; *document.querySelector('.mydiv').style.backgroundColor = 'black'; */with(document.querySelector('.mydiv').style){fontSize = '20px';color = 'red'; backgroundColor = 'black'; }

var a=20;b=20;console.log(window.a);//全局变量，就可以省略windowvar obj= {age:20,name:"karen"}with(obj){console.log(age);}//打印20

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。