JS基础语句(条件语句与for语句)

M78_国产007

已于 2022-05-10 01:43:14 修改

阅读量492

点赞数

分类专栏： JS 文章标签： javascript linq 前端

于 2022-04-29 00:30:39 首次发布

本文链接：https://blog.csdn.net/m0_59345890/article/details/124475113

版权

JS 专栏收录该内容

48 篇文章 0 订阅

订阅专栏

一、条件语句

1、if语句（单分支）

<script>
    var A=0
    if(A) { //如果（）内的逻辑为真，则运行{}内代码；反之不运行
        //多条语句
    }
</script>

2、if else语句（双分支）

if(A){}eLse{}A判定为真就执行第一个大括号，假执行eLse后面的大括号

js的执行引擎:如果执行体只有一个语句可以省略执行体

<script>
    if(a>22){
		console.log("可以喝酒还可以结婚")
		}else{
			console.log("可以喝酒")
	}	
</script>

3、if-else-if-else 语句（多分支）

if、if else是标准语法

if-else-if-else 不是js的标准语法，是程序员利用js引擎的纠错功能实现了其他语言的这个功能

<script>
    var a = 20;
      if(a>22){
		console.log("可以喝酒还可以结婚")
		}else if(a>18){
			console.log("可以喝酒")
	}else {
        console.log("未成年")
    }

    //等价于：
     var a = 20;
      if(a>22){
		console.log("可以喝酒还可以结婚")
		}else {
            if(a>18){
			console.log("可以喝酒")
	        }else {
            console.log("未成年")
        }

}
</script>

4、switch语句

switch语句基于不同的条件来执行不同的操作，与if else-if else语句相同，但是switch更具有业务性，if else-if else更具有逻辑性。

<script>
        var a=6 //设置一个变量
        switch(a){ //作为判断条件
            case 1:
                console.log("打印1");
                break;//阻止往下继续执行
            case 2:
                console.log("打印2");
                break;
            case 3:
                console.log("打印31");
                break;
            case 4:
                console.log("打印4");
                break;
            case 5:
                console.log("打印5");
                break;
            default : //无匹配的选项就执行default下的语句
                console.log("无型匹配的");
        }
    </script>

二、 for语句（重点）

循环可以将代码块执行指定的次数。

1、 for循环的执行顺序，展示：

<script>
    for(A;B;C){D}
    //执行流程：
    {
        A
            label:if(B){//判断条件
            D;
            C;
            //再次执行label
            }
            else{
                //退出for循环
            }
    
    }

    //具体例子：
    for(var i=0;i<4;i++){
        console.log(i)
    }
    //解析：
    {
        i=0
        if(0<4){
            console.log(0);
            i=0+1;
            if(1<4){
                console.log(1);
                i=1+1
                     if(2<4){
                        console.log(2);
                          i=2+1;
                             if(3<4){
                                console.log(1);
                                i=3+1
                                     if(4<4){ //不成立
                                        console.log(1);
                                                i=4+1
                                            }else{
                                                //退出for循环    
                                        }
                                }
                    }
                        
            }

        }
               
    }
</script>

补充：for循环没有作用域

练习：

 <script>
        // 打印0-19
        for(var i=0;i<20;i++){ 
            console.log(i);
        }

        //遍历得到数组元素
        var arr=["hi","ji",29]
        for(var i=0;i<arr.length;i++){
        console.log(arr[i])
    }
        //打印数组的第三个到第八个的元素
        var arr1=[2,333,4,65,7,8,6,99,76,46]
        for(var i=2;i<8;i++){ //第三个元素下标为2，第八个元素下标为7
            console.log(arr[i])
    }
        //打印数组中下标为奇数的元素

        //第一种方法分析：奇数的下标 初始值是：1  
        //结束值：arr.length-1 如果为奇数，就是它 为偶数就是arr.length-2==>不能arr.length  
        //变化规律：每次变化量+2
        for(var i=1;arr.length;i+=2){
         console.log(arr[i])
        }
        //第二种方法分析：
        //初始值：0
        //结束值：arr.length-1==>不能arr.length
        //变化规律：每次变化量+1
        for(var i=0;i<arr.length;i++){ 
            if(i%2==1){console.log(arr[i])}
        }
</script>

2、在选择题中出现

<script>
    var i=0;
		for(false;i++,i<5;){
				console.log(i) //打印结果 1 2 3 4
			}
        //解析过程：
       {
        i=0
        {
            false
           if(0++，1<5){ //i++会执行，再执行i<5,因为是，号操作符，结果是最后一个表达式
                console.log(1)
               空
                   if(1++，2<5){ //先执行i++
                        console.log(2) 
                            //重复操作直到不满足if条件
                            
                    }
            }
           }
       }
</script>

<script>
for(var i=0,j=6;i<4,j>0;i++,j--){ //i<4,j>0 以j>0为准
				//6 5 4 3 2 1 
				//0 1 2 3 4 5 
				console.log(i) //打印0 1 2 3  4 5
			}
</script>

	<script>
    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;
			 if(0<4){
			 arr[0]=function(){console.log(i)}//console.log(i)不运行不取值
			 i=i+1
				 if(1<4){
				  arr[1]=function(){console.log(i)}//console.log(i)不运行不取值
				  i=i+1
					 if(2<4){
					  arr[2]=function(){console.log(i)}//console.log(i)不运行不取值
					 i++
					if(3<4){
					  arr[3]=function(){console.log(i)}//console.log(i)不运行不取值
						 i++
						  if(4<4){}else{跳出循环}
							  }
						  }
					  }
				  }				   				
			  }
			  arr[0]()//
			 console.log(i)//i最后一次保存的数据
			 
			*/

    <script>

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

for遍历数据容器-for最常用的功能;遍历就是把容器中每一个数据都取出

<script>

var arr=[
			{age:20,name:"karen",rank:580},
			{age:14,name:"jack",rank:480},
			{age:19,name:"marry",rank:600},
			{age:12,name:"zhangsan",rank:680}
		]

        //打印数组中的对象的名字
         for(var i=0;i<arr.length;i++){
                console.log(arr[i].name);
            }

        //打印年龄大于18岁的对象的名字
            for(var i=0;i<arr.length;i++){
                if(arr[i].age>18)
                console.log(arr[i].name);
            }
         //打印年龄大于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);
            }
         // 打印年龄小于18而且rank大于400的对象的名字拼接一个字符串"少年班"
		//大于等于18rank大于480的名字拼接"普通班"
              for(var i=0;i<arr.length;i++){
                if(arr[i].age<18 && arr[i].rank>400){
                console.log(arr[i].name + '-少年班');
            }else if(arr[i].age>=18 && arr[i].rank>480){
                console.log(arr[i].name + '-普通班');
            }
</script>

<script>
 var arr=[
{id:123,text:"内容1",created_at:"2022-04-28 19:47",user:{name:"karen",online_status:1}},
{id:124,text:"内容2",created_at:"2022-04-27 19:22",user:{name:"jack",online_status:0}},
{id:125,text:"内容3",created_at:"2022-04-28 19:12",user:{name:"maryy",online_status:1}},
]
//打印每一个对选的text内容 而且在内容后面拼接 在线/不在线(根据online_status 1为在线 0为不在线)
     for(var i=0;i<arr.length;i++){
               if( arr[i].user.online_status == 1){
                   console.log( arr[i].text + '在线');
               }else{
                console.log( arr[i].text + '不在线');
               }

            }
	//显示内容和时间 时间必须显示(刚刚  "x分钟前"  "xx:xx"  )
           for(var i=0;i<arr.length;i++){ 
                var now = new Date()
                var mytime = new Date(arr[i].created_at)
                var bin = now - mytime
                 time=null
                // console.log(bin);
               
                if(bin<1000*60){
                    console.log(arr[i].text + '刚刚');
                }else if(bin > 1000*60 && bin < 1000*60*60){
                    time = Math.floor((bin/1000/60)) 
                    console.log(arr[i].text +'--'+ time +'分钟前');
                }else if(bin> 1000*60*60 && bin< 1000*60*60*24){
                    time = mytime.getHours()+':'+mytime.getMinutes()
                   console.log( arr[i].text+ '--'+ time );
                }
            }
</script>

4、for的嵌套和业务混合

for循环该怎么嵌套

1.不要管内部的for与外部的for的执行问题==>每一个for都是遍历的自己的数组

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

   <script>
        	var arr = [{
					name: "karen",
					its: ["css", "js", "html"],
					books: ["book1", "book5"]
				},
				{
					name: "jack",
					its: ["nodejs", "html"],
					books: ["book2", "book3", "book6"]
				},
				{
					name: "marry",
					its: [],
					books: ["book2"]
				}
			]

        打印arr数组中的所有字符串
            //步骤：
			//1.遍历arr 取出每一个对象obj
			//2.obj取出它的每一个成员
			//2.1成员是name直接打印
			//2.2成员是its 是个数组(遍历它)
			//2.3成员是books 是个数组(遍历它)
         for(var i=0;i<arr.length;i++){
                console.log(arr[i].name);
                for(var j=0;j<arr[i].its.length;j++){
                    console.log(arr[i].its[j]);
                }
                for(var k=0;k<arr[i].books.length;k++){
                    console.log(arr[i].books[k]);
                }
            }
    </script>

<script>
	var data = [{
				name: "四川",
				next: [{
					name: '成都',
					next: ["东站", "北站", "南站", "西站", "汽车客运站", "双流机场"]
				}, {
					name: '绵阳',
					next: ["富乐汽车站", "南湖汽车站", "火车站"]
				}, {
					name: '广安',
					next: ["广安南站", "广安北站"]
				}]
			}, {
				name: "云南",
				next: [{
					name: '大理',
					next: ["东站", "北站", "南站"]
				}, {
					name: '昆明',
					next: ["东站", "北站", "南站", "东站", "北站", "南站"]
				}, {
					name: '五华区',
					next: ["东站", "北站"]
				}, {
					name: '水富县',
					next: ["东站", "北站", "南站"]
				}, {
					name: '安宁县',
					next: ["东站", "北站", "南站", "东站", "北站", "南站"]
				}, {
					name: '香格里拉',
					next: ["东站", "北站"]
				}]
			}, {
				name: "浙江",
				next: [{
					name: '杭州',
					next: ["一区", "二区", "三区", "四区", '五区', "六区"]
				}, {
					name: '温州',
					next: ["1区", "2区"]
				}, {
					name: '金华',
					next: ["壹区", "贰区", "叁区", "肆区"]
				}]
			}, {
				name: "重庆",
				next: [{
					name: '万州',
					next: ["东站", "北站", "南站"]
				}, {
					name: '渝北',
					next: ["东站", "北站", "南站", "东站", "北站", "南站"]
				}, {
					name: '北碚',
					next: ["东站", "北站"]
				}, {
					name: '渝中',
					next: ["东站", "北站", "南站"]
				}, {
					name: '大渡口',
					next: ["东站", "北站", "南站", "东站", "北站", "南站 "]
				}]
			}]

        //1.打印1级数组中的每一个对象
       for(var i=0;i<data.length;i++){
                console.log(data[i]);
            }
        //2.打印1级数组中的每一个对象的name属性
             for(var i=0;i<data.length;i++){
                console.log(data[i].name);
            }
        //3.打印1级数组中的第一个对象的name属性 和 next属性
                console.log(data[0].name);
                console.log(data[0].next);
         

        //4.打印1级数组中的第一个对象的name属性 和 next数组中的每一个元素
                  console.log(data[0].name);
               for(var j=0;j<data[0].next.length;j++){
                   console.log(data[0].next[j]);
               }
        //5.打印1级数组中的第一个对象的next数组中的每一个元素的name属性
              for(var j=0;j<data[0].next.length;j++){
                   console.log(data[0].next[j].name);
               }
            
</script>

M78_国产007

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JS基础语句(条件语句与for语句)

一、条件语句1、if语句（单分支）<script> var A=0 if(A) { //如果（）内的逻辑为真，则运行{}内代码；反之不运行 //多条语句 }</script>2、if else语句（双分支）if(A){}eLse{}A判定为真就执行第一个大括号，假执行eLse后面的大括号js的执行引擎:如果执行体只有一个语句可以省略执行体<script> if(a>22){ con.
复制链接

扫一扫