js运算符和控制流程

181 阅读12分钟

运算符

按照功能划分:

​ 算术运算符 +-*/ %(取余)

​ 位运算符

​ 关系运算符> ,<,>=....

​ 逻辑运算符

运算符根据参与运算的操作数的个数分为:

​ 单目运算

​ 双目运算

​ 三目运算

运算符的优先级

​ 1,小括号();

​ 2,一元运算符 ++ == !

​ 3,算数运算符 */%+-

​ 4,关系运算符 > >= < <=

​ 5,相等运算符 == != === !==

​ 6,逻辑运算符 先&后||

​ 7,赋值运算符 =

1,算数运算符

+,-,*,%(求余/取模),/,++(递增),--(递减)

​ (一元运算符:++(递增),- -(递减))

注:浮点数 算数运算里面会有精度问题,尽量避免浮点数计算

前置递增/减:表示先赋值,再运算,

*m=++i;*即 i 先自增变成10,再赋值给m,m=10+1=11;

例:
let i = 1
console.log(++i +2)     //结果是4
//i先自加1,变成2,再和后面的2相加;

后置递增/减:表示先运算,

*m=i++;*即 i先赋值给m=10,运算后在自增,i=11

例:
let i = 1
console.log(i++ + 2)     //结果是3
//i先和2相加,先运算输出完毕后,i再自加,变成2;

综合:

console.log(i++ + ++i +i)	//输出7
=》(i++)+(++i)+(i)
=》i = i + 1		i = i + 1		i
=》i = 2 		i = 3			3


//求圆的面积:(在js中,通过 Math.PI 来代表 π)

const r = prompt('请输入圆的半径')
console.log('圆的面积是' + Math.PI * r * r)

1.对于非Number数值类型的数据在参与运算之前,都会被自动先转换为Number数值类型,然后再运算;

let res = 1 + true ;  // let res = 1+1;

 let res = 1+ null;  //  let res = 1+0;

2.任何值和NaN做运算都得NaN

​ let result = 2 + NaN;

​ console.log(result); //NaN

3.任何的值和字符串做加法+运算,都会先转换为字符串,然后再和字符串做拼串的操作

​ let result = 1 + "123";

​ console.log(result); // 1123

​ result = 2 + "true";

​ console.log(result); // 2true

4.任何的值和字符串做- * / %法运算, 都会先把字符串转换为Number,再运算

​ let result = 2 - "1"; // - * / %

​ console.log(result); // 1

​ result = "2" - "1";

​ console.log(result); // 1

5.取余运算m%n, n等于0 返回NaN, 其它和C语言一样

​ let result = 10 % 0;

​ console.log(result); // NaN

​ 如果m>n的,那么就正常取余;

​ 如果m<n的,那么结果就是m;

​ 取余运算结果的正负性,取决于m不是n;

​ let result = 10 % -3;

​ console.log(result); //输出1

6.如果一行内有多个运算符,先乘除,后加减

如果有括号先算括号里面的

2,赋值运算符

=,+=,-=,*=(加,减,乘一个数后再赋值), /=,%=,(除,取模后再赋值)

i += j; 等于i=i+j;

i -= j; 等于i=i-j;

3,关系/比较运算符

==(双等),===(全等),!=(不等于号),!==(不等于号,要求字符类型一致), >,<,>=,<=

关系运算符的结果只有两个,成立返回true,不成立返回false;

var i="10";

var j=10;

document.write(i==j); 输出的是true;值相等就可以,因为会默认转换成数字数据类型;

document.write(i===j); 输出的是false,全等号值,字符类型也要完全相同;

1.对于非数值进行比较时,会将其先转换为数字然后在比较

​ console.log(1 > true); //false

​ console.log(1 > false); //true

​ console.log(1 > "0"); //true

​ console.log(1 > null); //true

​ let res = 123 != '123'; //false

2.如果符号两侧的值都是字符串时,不会将其转换为数字进行比较, 而会分别比较字符串中字符的Unicode编码;

​ // a的Unicode编码是:0061

​ // b的Unicode编码是:0062

​ console.log("a" < "b");//true

如果字符串中有多个字符,那么会从左至右的依次比较,直到条件不满足为止;

let res = "ab">"dc" //会先比较ad,再比较bc

3.任何数据和nullundefinedNaN比较,都会返回false;

​ 但是null==undefined 返回true;

NaN === NaN false

{} true

4.不等于!= 不恒等于!==

​ let res = 123 != '123'; //let res = 123 != 123; false;

​ let res = 123 !== '123'; //只要值或者数据类型有一个不相等都符合不恒等于的条件 true;

5.关系运算符都是左结合性(从左至右运算)

​ let res = 10>5>3; //先10和5比较 结果 let res = true > 3; let res = 1 > 3; //false

​ 正因为关系运算符是左结合性,所以不能利用关系运算符来判断区间;

​ let res =10<=25<=20; //true

6.关系运算符优先级:

> < >= <=的优先级高于== != === !===;

​ let res =10==10>0; //let res =10==true; let res =10==1; false;

4,逻辑运算符

进行布尔运算的运算符,返回值也是布尔值,经常用于多个条件判断;

&&( 与),必须同时满足两个条件,才能输出true;

||(或),满足其一即可输出true;

!(非,相反)

var i=101;
var j=10;
document.write(!i==j); 等于问  i不等于j  是否正确   取相反结果  故输出的是true

1,逻辑运算符的优先级和结合性:

逻辑运算符是左结合性(从左至右运算)逻辑&&的优先级高于逻辑||

<script>
    let res = true || false && false;   //由于逻辑与&&的优先级较高,所以会先运算false&&false,
    console.log(res);                   //然后变成let res = true || false   输出结果为true
</script>

2,逻辑运算符的注意点:

2.1对于非Boolean类型的数值, 逻辑运算符会将其先转换为Boolean类型,再参与其他运算

<script>
    let res1 = !0;      //let res1 = !false;
    console.log(res1);  //输出true;
    let res2 = !1;      //let res2 = !true;
    console.log(res2);  //输出false
</script>

2.2在逻辑与&&运算中,如果参与运算的不是布尔类型,返回值有一个特点:

逻辑与(&&)的短路运算-逻辑中断

格式: 条件A && 条件B

如果A成立,无论条件B是否成立都会返回条件B; // 如果表达式1 结果为 则返回表达式2

如果A不成立,那么就会返回条件A; // 如果表达式1 结果为假 则返回表达式1;

<script>
    let res1 = 0 && 123;      //let res1 = false && 123;
    console.log(res1);  //条件A 不成立,输出条件A 0;
    let res2 = 123 && null;      //let res2 = true && null;
    console.log(res2);  //条件A 成立,输出条件B null;

	console.log(123 && 456);  //输出456
	console.log(0 && 456);  //输出0
</script>


//js在判断以下表达式的时候,会自动先转成 布尔类型 再去判断
//最终s获取结果的时候 不会转类型
let s = '' && 'hello'
console.log(s);
输出的是空

let s = undefined && 'hello'
console.log(s);
输出的是undefined

let s = 0 && 'hello'
console.log(s);
输出的是0

一假则假 	&& 左边为false		右边就不再去执行了
console.log(2>10 && 1<3 && 3>1 && 9>5 && 5<10 && 8>2)

2.3在逻辑或||运算中,如果参与运算的不是布尔类型,返回值有一个特点:

逻辑或(||)的短路运算-逻辑中断

格式: 条件A || 条件B

如果A成立,那么就会返回条件A; //如果表达式1 结果为 则返回表达式1

如果A不成立,无论条件B是否成立都会返回条件B; //如果表达式1 结果为假 则返回表达式2;

<script>
    let res1 = 666|| 0;      //let res1 = true || 0;
    console.log(res1);  //条件A 成立,输出条件A 666;
    let res2 = null || 123;      //let res2 = false || 123;
    console.log(res2);  //条件A 不成立,输出条件B null;
		
	console.log(123|| 456);  //输出123
	console.log(0 ||456);  //输出456
</script>


一真为真	只要||左边 成立了 为true,右边就不再去执行
consolelog(100>3 || 2>6 || 9>10 || 10>11 || 13>20)

这些值转换为布尔类型 都是 false

undifined null 0 “ ” false NaN

5,条件运算符/三目

var i=11;

document.write(i>10? "i大于10" : "i小于10" ); 输出:i大于10;

(**?前为条件,满足条件输出:**前的内容,不满足就输出后面双引号的内容)

三元表达式

由三元运算符组成的式子我们称为三元表达式;

格式:

条件表达式 ?表达式1 :表达式2

如果条件表达式结果为真,则返回表达式1的值,否则返回表达式2的值;

三元表达式一般用来取值

// let num3; 要等于num1 和num2 中的最大值
//比较出num1和num2的值,然后赋值给num3
num3 = ((num1 > num2 ) ? num1 : num2);



//案例:用户输入两个数,控制台输出最大的值
let num1 = +prompt('请输入第一个数字')
let num2 = +prompt('请输入第二个数字')
console.log(num1 > num2 ? num1 : num2); 

// 用户输入一个数,如果数字小于0,则前面进行补0,比如09,03等
let num1 = prompt('请输入一个数字')
console.log(num1 < 10 ? (0 + num1): num1);

控制流程

js的控制流程:

1,顺序结构:默认的流程结构,按照书写顺序从上至下执行每一条语句;

2,选择结构:对给定的条件进行判断,再根据判断结果来决定执行哪一段代码; 分支结构( if, switch)

3,循环结构:在给定条件成立的情况下,反复执行某一段代码; 循环结构 ( for,while , do....while )

if选择语句

1,if:

​ 格式: if(条件表达式){

条件成立的执行语句;

​ }

特点:当条件表达式为真的时候,会执行{}里面所有的代码,并且只会执行一次;

如果 if 大括号里面只有一行代码 可以省略 大括号

 //  案例:获取用户输入的分数,用分数做判断,大于700恭喜他
<script>
    //用户输入的是字符串,所以需要用 加号 进行转换为数字
    let score = +prompt('请输入你的分数')
    if (score > 700) {
      alert('恭喜你')
     }
</script>

注意点:
//如果 if 大括号里面只有一行代码 可以省略 大括号
if(true)console.log('输出了true')	//正确的

2,if else:

​ 格式: if(条件表达式){

​ 条件成立的执行语句;

​ }else{

​ 条件不成立的执行语句;

​ }

特点:当条件成立时就会执行if{}里面的代码,

​ 当条件不成立时就会执行else{}里面的代码,

​ 并且两个{}只有一个会被执行,并且只执行一次;

<script>
     // 案例: 获取用户输入的分数,用分数做判断,大于700蓝翔,否则北大
    let score = +prompt('请输入你的分数')
       if (score > 700) {
        alert('蓝翔欢迎你')
     } else{
     alert('北大欢迎你') 
      }
</script>

3,if else if else:

​ 格式: if(条件表达式1){

​ 条件1满足执行的语句;

​ }else if(条件表达式2){

​ 条件2满足执行的语句;

​ }else if(条件表达式3){

​ 条件3满足执行的语句;

​ } ....

else{

​ 前面所有条件都不满足执行的语句;

​ }

执行思路:

​ 会从上至下的依次判断每一个条件表达式,哪一个条件表达式满足,就执行哪一个条件表达式{}后面中的代码,

​ 如果前面所有条件表达式都不满足,就会执行else{}里面的代码,

​ 并且众多的大括号只有一个会被执行,并且只会执行一次;

//案例:简易计算器 
//用户输入2个数字,然后 + - / * 任何一个,可以计算结果   operator操作符
        let num1 = +prompt('请输入第一个数字')
        let operator = prompt('请输入计算符号')		//操作符 不需要转换
        let num2 = +prompt('请输入第二个数字')

        if (operator === '+') {
            console.log(num1 + num2)				//需要 ===
        } else if (operator === '-') {
            console.log(num1 - num2)
        } else if (operator === '*') {
            console.log(num1 * num2)
        } else if (operator === '/') {
            console.log(num1 / num2)
        } else {
            alert('错了,从新输入')		//最后的else可以省略
        }

4,if注意点总结:

1.对于非布尔类型的数据会先转换为布尔类型再判断;

​ if (null) { // if(null) 先转换成 if(false) ,条件不成立,不会输出语句A;

​ if (1) { //if(1)先转换成 if(ture) ,条件成立,会输出语句A;

​ console.log("语句A");

​ }

​ console.log("语句B");

2.对于==/===判断,将常量写在前面;

​ let num = 10;

​ if(num=5){ //if(num=5)会直接给num赋值变成if(5),条件成立,输出语句A;

​ if(5=num){ //报错;

​ if(5==num){ //if(num=5)会转换成if(false),条件不成立,不会输出语句A;

​ console.log("语句A");

​ }

​ console.log("语句B");

3.if / else if /else后面的大括号都可以省略,但是省略之后只有紧随其后的语句受到控制;

if ( false ) { //正常情况下,因为条件不成立,不会输出语句A和B;

​ console.log("语句A");

​ console.log("语句B");

​ }

if(false) //去掉大括号后,只有语句A受到控制,语句B不会受到控制,会输出语句B;

​ console.log("语句A");

​ console.log("语句B");

4.在js中,分号(;)也是一条语句,是一条空语句;

5.if结构是可以嵌套使用

6.当if选择结构省略大括号时,else if /else会自动和距离最近没有被使用的if匹配;

案例

<!-- 需求:接收用户输入的整数,判断是否是偶数,偶数输出yes,奇数输出no; -->
    
    <script>
        let num = prompt("请输入一个数字");
        //num % 2 === 0 ? alert("yes") : alert("no");         //运用三目运算符进行判断

        if (num % 2 === 0) {                //if选择结构进行判断
            alert("yes");
        } else {
            alert("no");
        }
    </script>

switch选择语句

switch case

格式

switch(表达式){

case 表达式1:

​ 执行语句1;

​ break;

case 表达式2:

​ 执行语句2;

​ break;

​ ....

default:

​ 前面所有case都不匹配执行的代码;

​ break;

​ }

执行思路:

计算表达式的值,和case后面的选项值相匹配,如果匹配上,就执行该case里的语句

​ 如果都没匹配上,就执行default里面的语句;

				 let num = 123;
            switch(num){
                case "123";
                console.log("字符串123");
                break;

                case 123;
                console.log("数值的123");
                break;

                default :
                console.log("other");
                break;

            }                               //最后输出 数值的123

注意点

1,case判断的 是===, 不是==;

2,()中可以是常量也可以是变量还可以是表达式;

3,case后面可以是常量也可以是变量还可以是表达式;

4,break的作用是立即结束整个switch语句;

​ 因为在switch语句中, 一旦case或者default被匹配,那么其他的case和default都会失效,

​ 但是case和default后面的语句不会失效,会继续运行,知道遇到break或运行完毕才会停止;

5, default不一定要写在最后,

​ 因为default无论在前面还是后面,都会等到所有的case不匹配后,default语句才会在最后执行;

6, 和if/else中的else一样,default可以省略;

​ 省略后,如果没有适合的case匹配成功,那么会没有输出结果;

7, 会从上至下地判断每一个case是否和()中表达式的结果相等,如果相等就执行对应的case后面的代码,

​ 如果前面的所有case都不匹配,那么就会执行default后面的代码;

​ 并且所有的case和default只有一个会被执行,并且只会被执行一次;

8,选择结构中,if和switch应该如何选择?

​ 在企业开发中,如果对区间进行判断,那么建议使用if;

​ 在企业开发中,如果对几个固定的值进行判断,那么建议使用switch;

原则,能用if就用if;

while循环

1,while循环

格式: while(条件表达式){

条件成立的执行语句;

​ }

必须具备三要素:

1,变量初始值

2,终止条件

3,变量需要改变(自增或自减)

while的执行流程:

​ 1.1首先会先判断条件表达式是否为真,如果 为真 就执行{}后面的代码;

​ 1.2执行完{}中的代码,会再次判断条件表达式是否还为真;

​ 1.3如果条件表达式还为真,那么会再次执行{}中的代码;

​ 1.4重复1.1-1.3,直到条件表达式不为真为止;

特点:当条件表达式为真的时候,会执行{}里面所有的代码

​ 大括号中的代码有可能被执行多次;

注意点:

​ 1,什么是死循环?

​ 条件表达式永远为真的循环结构;

​ 2,什么是循环体?

​ 循环结构后面的{}我们称为循环体;

​ 3,和if一样,对于非布尔类型的数据会先转换为布尔类型再判断;

​ 4,和if一样,后面如果只有一条语句,大括号可以省略;

​ 5,和if一样,不能在()后面写分号;

书写循环结构的规则:

​ 1,先写循环结构的代码;

​ 2,将需要重复执行的语句写到{}中;

​ 3,再在()中指定循环的结束条件;

案例:

 案例:
 
 let i = 1			// 1,变量初始值
 
// 
 while (i <= 3){				//2,终止条件
     document.write(`这是第${i}循环`)    //反引号
     
      
      i++								//3,变量需要改变(自增或自减)
 }




案例2// 用户输入打印次数,使用while循环,在页面中打印,可以添加换行效果   
let sum = +prompt('请输入打印次数')
let i = 1
while (i <= sum) {
    document.write(`${i}月薪过万<br>`)
    i++
} 


案例3//计算1-100之间所有的偶数和  
//方法1    
    let i = 1
    sum = 0
    while (i <= 100) {
        i % 2 === 0 && (sum += i)		//短路运算, i % 2 === 0 成立, 那么执行右边的代码(sum += i)
        i++ 
    }    
    console.log(sum)

//方法2
let i = 1
  sum = 0   
  while(i <= 100){
      //这一行代码不能直接执行,满足某些条件才能执行
      if(i%2 ===0 ){
          sum += i;
      }
      //无论当你请按的i是偶数还是奇数 i++ 都要执行,并进行下一轮的循环
      i++
  } 
console.log(sum)



案例4
//需求:页面弹出对话框,“你爱我吗”,如果输出“爱”,结束,否则一直弹出对话框  
let i = prompt('你爱我吗')															//1,变量初始值
while (i !== '爱') {														//2,终止条件
   i = prompt('你爱我吗')											//3,变体(增减)
   
} 

案例5:
<!--需求1:打印"发射子弹1-10" -->
     
    <!--
    <script>
     
        let num = 1;
        while (num <= 10) {
            console.log("子弹发射" + num);
            num++;
        }
    </script> -->


案例6//简易银行存取款
let operation				/1,变量初始值
let money = 100
while(operation !== 4){								/2,终止条件
    operation = +prompt(`请选择您的操作:
    1.取款
    2.存款
    3.查看余额
    4.退出`)
    if (operation === 1) {					 		 /3,变体(增减)
        str = +prompt('请输入取款金额')
        money -= str
    } else if (operation === 2) {
        str = +prompt('请输入存款金额')
        money += str
        alert(`您的余额为${money}`)
    } else if (operation === 3) {
        alert(`您的余额为${money}`)
    } else if (operation === 4) {
       console.log('退出')				//退出循环体
    }
}





 <!-- 需求2:打印1-50之间7的倍数,并统计个数; -->
     
    <!-- <script>
        let num = 1;
        let count = 0;
        while (num <= 50) {
            // console.log(num);
            if (num % 7 === 0) {
                console.log(num);
                count++;
            }
            num++;
        }
        console.log(count); 
    </script> -->




<!--需求3:提示用户输入一个正整数n,计算1-+2+3+4+...n的和;

        <script>
        		let sum = 0;
        		let num = 1;
        		while(n <= n){
                sum = sum + num;
                num++;
        }
        </script>-->

2,do while循环

格式:

do{

需要重复执行的代码;

​ } while();

执行流程:

do...while循环,先执行循环体,再判断条件,效果为真继续循环否则退出

特点:

无论条件表达式是否为真,循环体都会被执行一次;

在企业开发中大部分情况下while循环和dowhile循环是可以互换的;

在企业开发中如果循环体的代码无论如何都需要先执行一次,那么建议使用dowhile循环;

在企业开发中其他情况都建议用while循环;

需求:要求用户输入密码,判读输入密码是否正确(假设正确密码为123456)
                如果正确输出:"欢迎回来"
                如果错误输出:"请重新输入密码"

 方法一:
        <script>
        		let pwd = prompt("请输入密码");
        		while (pwd !== "123456") {				//密码 不等于 123456 满足条件,输出额循环体"请输入密码"
             pwd = prompt("请输入密码");
       			 }
        			alert("欢迎回来");					//否则输出 "欢迎回来"
    	</script> 


方法二:
   	 		<script>
        			let pwd = -1;
        		do {
            			pwd = prompt("请输入密码");			//先执行循环体
       				 }	 while (pwd !== "123456");			//再判断,为真,则继续执行循环体 "请输入密码",直到不为真
        					alert("欢迎回来");				//(pwd !== "123456") 为假,密码正确,输出 "欢迎回来"
    		</script>

例2let index = 0
do{
    console.log('执行了do里面的diam')
    index++
}while (false)

for循环

1,for循环

1,for循环的格式:

			    1    				 2/5      				4/7

for ( 初始化表达式 ; 条件表达式 ; 循环后增量表达式 ) {

3/6

需要重复执行的代码;

}

初始化表达式 就是用let声明一个普通变量,通常用于作计数器使用;

条件表达式 就是用来决定每一次循环是否继续执行,就是终止的条件;

操作表达式 是每次循环最后执行的代码,经常用于我们的计数器变量进行更新;(递增/减)

2,for循环的特点:

for循环的特点和while循环的特点一样,只有条件表达式为真,才会执行循环体;

3,for循环的执行流程:

3.1首先会执行初始化表达式,并且只会执行一次;

3.2判断条件表达式是否为真,如果条件表达式为真,就执行循环体;

3.3执行完循环体后就会执行循环后增量表达式;

3.4重复3.2-3.3,直到条件表达式不为真为止;

//while方法 循环案例1  
<script>
     let num = 1;                        //初始化表达式
     while (num <= 10) {                 //num <= 10  条件表达式
     console.log("子弹发射" + num);
       num++;                          //循环后增量表达式
    }
</script>


//for方法 循环案例1
<script>
    for (let num = 1; num <= 10; num++) {
    console.log("子弹发射" + num);
        }
</script>



//案例2
<script>
    for(var i= 1;i<=100;i++){
    document.write(i);
    }
</script>
<!--
   1.首先执行var i=1,但这句话在for里面只运行一次;
   2.执行i<=100 判断是否满足条件,满足则执行循环体,否则退出程序;
   3.最后执行i++,第一轮结束;
   4.再次执行i<=100 判断是否满足条件,满足则执行循环体,否则退出程序;
-->

       
//案例31-100之间所有的偶数和
 let num = 0
 for(let i = 1; i <= 100; i++ ){
     if(i % 2 === 0){
         num += i 
     }
 }
 (法2:(i%2 === 0) && (num += i))
 console.log(num);    
    

//案例4
页面中打印500个小星星
法1for(let i = 1; i <= 10; i++){
    document.write('⭐')
}

法2let str = ''
for(let i = 1; i <= 10; i++){
    str += '⭐'
}
document.write(str)




//案例5
//需求:3天背5个单词
/*  for(let i = 1; i <=3; i++){
         document.write(`第${i}天<br/>`)
         for(let num = 1; num <= 5; num++){
             document.write(`背${num}个单词<br/>`)
         }
 }  */


//需求:n天背n个单词
let day = +prompt('请输入天数')
let num2 = +prompt('你被几个单词')
for (let i = 1; i <= 3; i++) {
    document.write(`第${day}天<br/>`)
    for (let num = 1; num <= 5; num++) {
        document.write(`背${num2}个单词<br/>`)
    }
}

55列星星
for (let i = 1; i <= 5; i++) {
 document.write(`<br/>`)
 for (let index = 1; index <= 5; index++) {
     document.write('⭐')
 }
               
 } 

//用户输入行数和列数打印星星
let num1 = +prompt('请输入打印行数')
 let num2 = +prompt('请输入列数')
 for (let star = 1; star <= num1; star++) {
         document.write(`<br/>`)
         for (let star2 = 1; star2 <= num2; star2++) {
             document.write('⭐')
         }
     }  

//打印倒三角星星
 //法1
   let star = ''
for (let i = 1; i <= 10; i++) {
    for (let index = 1; index <= 1; index++) {
        star += '⭐'
    }
    document.write(`${star}<br/>`)
}  */
// 法二:
   for (let i = 1; i <= 10; i++) {
for (let index = 1; index <=i; index++) {
document.write(`⭐`)
 }
document.write(`<br/>`)
}  */


//九九乘法表
   for (let i = 1; i <= 9; i++) {
    for (let index = 1; index <= i; index++) {
       let num = i * index  
      document.write(` <span>${i}*${index}=${num}</span>`)
    }
    document.write(`<br>`)
} */

2,for in循环

for(变量 in 对象){

在此执行代码

}

for…in 语句用于遍历数组 / 对象的属性(对数组或者对象的属性进行循环操作)

正式写法为for(i in obj){}. obj表示一个对象i则表示对象中的属性和方法

也就是说,for…in循环的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。

for…in循环可应用于对象的复制,不过其有一个缺点,就是会从原型属性里继承prototype()属性。

<script>    
		let j;
		let i=[1,2,3];
		for(j in i){
      document.write(j);			//输出:  012
      //document.write(i);      //1,2,31,2,31,2,3
    }
</script>

3,for循环和while循环的区别:

如果明确了循环的次数推荐使用for循环;

如果不明确循环的次数的时候推荐使用while循环

退出循环

1,break关键字

​ break关键字可以用于switch语句和循环结构中

​ 在switch语句中break关键字的作用是立即结束当前的switch语句;

​ 在循环结构中的break关键字的作用也是立即结束当前的循环结构;

​ 注意点:

​ break后面不能编写任何语句,因为永远执行不到

​ 如果break在循环嵌套的结构中,break结束的是当前所在的循环结构;

​ (我们也可以通过 if else 来实现它的功能,

​ 但是如果可以,尽量使用break,因为性能更好,break会终止剩下的循环,针对的是整个流程)

*break*;一旦遇到跳出整个循环,不再进行下一次循环;

 例如:吃5个包子 ,第三个有虫子,就扔掉第三个,第三第四个五也不吃了;
for (let index = 1; index < 10; index++) {
    if (index === 5){           //如果当前的index = 5,就不再往下循环了,终止循环
        break
    }
     console.log(index)
}    

2,continue关键字

​ continue关键字只能用于循环结构

​ 在循环结构中的continue关键字的作用是跳过本次循环,进入下一次循环;

​ continue和break一样,后面不能编写任何语句,因为永远执行不到

​ (if else 也能实现类似的功能)

continue;跳过本次i的值的循环,继续进行下一次循环;

​ 例如:吃5个包子 ,第三个有虫子,就扔掉第三个,第三第四个五个继续吃;

//只输出偶数 

方法一:直接求偶数项
for (let index = 1; index < 10; index++) {
    if (index % 2 === 0) {
        console.log(index);
    }
}
方法二:跳过奇数项
for (let index = 1; index < 10; index++) {
        if (index % 2 !== 0) {
            continue					//如果是奇数,跳过本次循环
        }
        console.log(index);
    }

3,return关键字

​ 不仅可以退出循环,还能够返回return语句中的值同时可以结束

​ 当前的函数体内的代码;