JavaScript(二):流程控制语句、数组

一、流程控制语句

流程控制语句分为3种,顺序结构,分支结构,循环结构

1、分支结构

(1)if单分支语法

(2) if else 双分支结构:

语法结构:

案例1:判断是否能够进入酒吧 

        // if else 双分支语句
        var age = prompt('请输入您的年龄:');
        if (age>=18) {
            alert('准许进入网吧');
        }else {
            alert('不能进入网吧');
        }

案例2:判断是否为闰年

思路:

        // 判断闰年
        var year=prompt('请输入年份:');
        if(year%4==0 && year%100!=0 || year%400==0){
            alert('闰年');
        }else {
            alert('平年');
        }

 (3)if else if多分支语句

语法规范:

案例:判断成绩级别

        var score=prompt('请输入成绩:');
        if (score>=90) {
            alert('A');
        } else if(score>=80) {
            alert('B');
        } else if (score >= 70) {
            alert('C');
        } else if (score >= 60) {
            alert('D');
        } else {
            alert('不及格');
        }

 (4)三元表达式

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

如果条件表达式为真,执行表达式1;如果为假,执行表达式2.

        // 案例多元
        var num=10;
        var result = num > 5 ? '是的':'不是的';
        console.log(result);//是的

 案例:数字补0

(5)switch语句

switch语句也是多分支语句,它用于基于不同的条件来执行不同的代码。当要针对变量设置一系列的特定值的选项时,就可以使用switch。 

    <script>
        switch (4) {
            case 1:
                console.log('这是1');
                break;
            case 3:
                console.log('这是3');
                break;
            case 5:
                console.log('这是5');
                break;
            default:
                console.log('未匹配到');
        }
    </script>

注意事项:

1、括号里的表达式经常写成变量:

        var num=3;
        switch (num) {

2、在匹配时,num和case的值必须是全等的,数值和类型都是一致。

3、如果当前case里面没有break,那么就不会退出switch,而是继续执行下一个case,直到找到break。

案例:查找水果(注意全等问题)

        // 查找水果
        var fruit=prompt('请输入一个水果:');
        switch (fruit) {
            case '草莓'://一定要加引号 注意全等问题
                alert('32一斤');
                brek;
            case '黄桃'://一定要加引号 注意全等问题
                alert('8一斤');
                brek;
            case '苹果'://一定要加引号 注意全等问题
                alert('9一斤');
                brek;
            default:
                alert('没有这种水果');
        }

(6)switch和if else区别

2、循环结构

(1)for循环

语法结构:

    <script>
        for (var i=1;i<=100;i++) {
            console.log('love you');
        }
    </script>

 断点调试debug:

案例:让用户控制输出次数 

        // 让用户控制输出的次数
        var time=prompt('请你输入次数');
        for (var i=1;i<=time;i++) {
            console.log('love you');
        }

 案例:for循环重复不同代码

        // 重复不同的代码
        for (var age=1;age<=100;age++) {
            console.log('我今年'+age+'岁了');
        }

 案例:嵌套

        // 嵌套
        for (var i = 1; i <= 100; i++) { 
            if (i == 1) { 
                console.log('这个人今年1岁了,他出生了');
            } else if (i == 100) { 
                console.log('这个人今年100岁了,他死了'); 
            } else {
                 console.log('这个人今年' + i + '岁了'); 
            }
        }

案例:求1-100所有整数的累加和

        var sum = 0;//求和的变量
        for (var i = 1; i <= 100; i++){
            // sum = sum + i;
            sum += i;
        }
            console.log(sum);//5050

案例:求1-100和的平均值;求1-100之间偶数的和,奇数的和;求能被3整除的数字和;

            // 求1-100的和的平均值 
            var sum=0;
            var average=0;
            for (i=1;i<=100;i++){
                sum=sum+i;
            }
            average=sum/100;
            console.log(average);//50.5
            // 求1-100偶数even的和,奇数odd的和
            var even=0;
            var odd=0;
            for(i=0;i<=100;i++){
                if(i%2==0){
                    even=even+i;
                }else{
                    odd=odd+i;
                }
            }
            console.log('偶数的和是:'+even);//2550
            console.log('奇数的和是:'+odd);//2500
            // 求1-100能被3整除的和
            var sum=0;
            for(i=0;i<=100;i++){
                if(i%3==0){
                    sum=sum+i;
                }
            }
            console.log('1-100能被3整除的数字和是:'+sum);//1683

案例:求学生成绩:要求输入班级人数,之后依次输入成绩,最后打印出来班级总成绩及平均成绩;(需要注意的是prompt得到的数据类型是字符串类型的,需要数据转换)

        // 求学生成绩案例
        var num=prompt('请输入班级人数:');
        var sum=0;
        var average=0;
        for(i=1;i<=num;i++){
            var score=prompt('请您输入第'+i+'个学生成绩');//弹出num次,用score存储分数
            sum=sum+parseFloat(score);//注意类型转换
        }
        average=sum/num;
        alert('总成绩为'+sum);
        alert('平均成绩为'+average);

 案例:打印五角星,一行显示多个星星

        // 一行显示多个星星
        var num=prompt('请输入想要的个数');
        var str='';
        for (var i=1;i<=num;i++){
            str=str+'☆';
        }
        console.log(str);

(2)for双重循环

语法结构:

        //1.双重for循环语法结构
        // for(外层的初始化变量;外层的条件表达式;外层的操作表达式){
        //     for(里层的初始化变量;里层的条件表达式;里层的操作表达式){
        //         执行语句;
        //     }
        // }
                //2.我们可以把里面的循环看做是外层循环的语句
                //3.外层循环循环一次,里面的循环执行全部
                //4.代码验证
                for(var i =1;i<=3;i++){
                    console.log('这是外层循环第'+i+'次');
                    for (var j= 1;j<= 3;j++){
                        console.log('这是里层的循环第'+j+'次');
                    }
                }

 

案例:打印5行5列星星

外层循环负责打印几行,内层循环负责打印几列 

        var str='';
        for(var i=1;i<=5;i++){
            for(var j=1;j<=5;j++){
                str=str+'☆';
            }
            // 如果一行打印完5个星星就换行
            str=str+'\n';
        }
        console.log(str);

 案例:打印n行n列星星

        // n行n列星星
        var rows=prompt('请输入行数:');
        var cols=prompt('请输入列数:');
        var str = '';
        for (var i = 1; i <= rows; i++) {
                for (var j = 1; j <= cols; j++) {
                    str = str + '☆';
                }
                // 如果一行打印完就换行
                str = str + '\n';
            }
            alert(str);

 案例:打印倒三角,正三角

        //倒三角
        var str='';
        for(i=1;i<=10;i++){
            for(j=i;j<=10;j++){
                str=str+'☆';
            }
            str=str + '\n';
        }
        console.log(str);

 

        // 正三角
                var str = '';
                    for (i = 1; i <= 10; i++) {
                        for (j = 1;j<=i; j++) {
                            str = str + '☆';
                        }
                        str = str + '\n';
                    }
                    console.log(str);

 案例:九九乘法表

        // 99乘法表
        var str='';
        for(i=1;i<=9;i++){
            for(j=1;j<=i;j++){
                str += j+'*'+i + '='+ i * j + '\t';
            }
            str +='\n';
        }
        console.log(str);

(3)while循环

语法结构:

 里面应该有操作表达式完成计数器更新,防止死循环

案例:打印1-100岁;输出1-100的和;淡出一个提示框,你爱我吗,如果输入我爱你,则结束,否则一直循环询问;

//1-100岁
i=1;
while(i<=100){
    console.log('今年'+i+'岁了');
    i++;
}
// 1-100的和
var sum=0;
var j=1;
while(j<=100){
    sum += j;
    j++;
}
console.log(sum);
// 我爱你
var message=prompt('你爱我吗?');
while(message !='我爱你'){
    message=prompt('你爱我吗?');
}
alert('我也爱你');

(4)do while循环

语法结构:

 

案例:1-100岁;1-100的和;我阿爱你

        // 1-100岁
        var i=1;
        do{
            console.log('今年'+i+'岁');
            i++
        }while(i<=10)
        // 1-100和
        var sum=0;
        var j=1;
        do{
            sum += j;
            j++;
        }while(j<=100)
        console.log(sum);
        // 我爱你
        do{
            var message=prompt('你爱我吗');
        }while(message != '我爱你')
        alert('我爱你');

(5)continue break 

continue:跳出本次循环,继续下一次循环

 //continue:跳出本次循环,继续下一次循环
        //求1-100之间除了7的倍数之外的其他整数和
        var sum = 0
        for (var i = 1; i <= 100; i++) {
            if (i % 7 == 0) {
                continue;
            }
            sum += i;
        }
        console.log(sum);

break:跳出整个循环

for (var i = 1; i <= 20; i++) {
            if (i == 9) {
                break;
            }
            console.log('我挣了第' + i + '个百万');
        }

(6)命规范及语法格式

标识符命名规范

操作符规范

 单行注释符规范

3、作业案例 

(1).接收用户输入的用户名和密码,若用户名为“admin”,密码为“123456”,则提示用户登录成功!否则,让用户一直输入。

        var name=prompt('请您输入用户名:');
        var psd=prompt('请您输入密码:');
        while(name != 'admin' && psd != 123456){
            alert('输入错误重新输入');
            name = prompt('请您重新输入用户名:');
            psd = prompt('请您重新输入密码:');
        }
        alert('用户登录成功');

(2)求整数1~100的累加值,但要求跳过所有个位为3的数【用continue实现】。 

            var sum = 0;
            for (var i = 1; i <= 100; i++) {
                if (i%10 == 3) { //(i - 3) % 10 == 0
                    continue;
                }
                sum += i;
            }
            console.log(sum);//4570

(3)简易ATM

 写法1:正确写法,用if else if和break可以跳出整个循环

        var sum=100;
        for(var i=1;i<2;) {
        var num=prompt('请输入你需要的操作:\n1、存钱\n2、取钱\n3、显示余额\n4、退出');
        if (num == 1){
            var save = parseFloat(prompt('请输入存钱数目:'));//注意转换为数字型
            sum += save;
            alert('您的账户余额是:' + sum);
            continue;
        }
        else if (num == 2) {
                var cost = parseFloat(prompt('请输入要取的钱数:'));
                sum -= cost;
                alert('您现在的余额是:' + sum);
                continue;
            }
            else if (num == 3) {
                alert('您现在的余额是:' + sum);
                continue;
            }
            else if (num == 4) {
                alert('您已退出!');
                break;
            }
            else {
                alert('输入有误!');
            }
    }

写法2:错误写法,用swutch语句和brek无法跳出循环,因为break跳出的是switch这个循环 而不是整个大循环

        var sum = 100;
        for(i=1;i<2;){
            var num = prompt('请输入你需要的操作:\n1、存钱\n2、取钱\n3、显示余额\n4、退出');
            switch(num){
                case'1':
                    var save = parseInt(prompt('请输入要存的钱数:'));
                    sum += save;
                    alert('您目前余额是:' + sum);
                    continue;
                case '2':
                    var take = parseInt(prompt('请输入要取的钱数:'));
                    sum -= take;
                    alert('您现在的余额是:' + sum);
                    continue;
                case '3':
                    alert('您现在的余额是:' + sum);
                    continue;
                case '4':
                    alert('您已退出!');
                    break;
                default:
                    alert('未匹配到请重新输入');
            }
        }

二、数组(Array)

数组是指一组数据的集合,其中的每个数据被称作元素,在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。 

1、创建数组

 (1)利用new创建数组(了解)

 注意:Array首字母要大写。

	var arr = new Array();

(2)利用数组字面量创建数组(常用)

 数组里可以存放任意的数据类型,用逗号隔开。
数组元素:存放在数组里面的数据。

	var arr1 = []; // 创建了一个空数组
    var arr2 = [1, 2, '奥里给', true]; //数组里可以存放任意数据类型

2、获取数组

数组的索引:

 

使用数组名[n]来获取,注意n从0开始,arr[0]代表第一个元素

 

3、遍历数组

(1)借助for循环实现数组的遍历。 

 //数组的遍历:借助for循环
 	var arr3 = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日']
        for (var i = 0; i < 7; i++) {
            console.log(arr3[i]);
        }

1.因为我们的数组索引号从0开始,所以i必须从0开始;

2.输出的时候 arr[i], i是计数器当索引号来用。

(2)数组的长度获取方式:

使用“数组名.length”可以访问数组元素的数量(数组长度)。

var arr3 = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日']
for (var i = 0; i < arr3.length; i++) {
            console.log(arr3[i]);//先输出几个元素,在遍历出所有元素
        }

1.数组的长度是元素个数不要跟索引号混淆;

2.arr.length 动态监测数组元素的个数。

4、数组中新增元素

 方法一:修改length长度

	var arr = ['123', '456', '789'];
        arr.length = 5;
        console.log(arr[3]);  // undefined
        console.log(arr[4]);  // undefined

方法二:修改索引号

    //修改数组元素:修改索引号
    var arr = ['123', '456', '789'];
    arr[3] = '奥里给';
    arr[4] = '年薪百万';
    arr[0] = '替换';  //直接赋值会替换相应的元素值
    console.log(arr);
    arr = '不能这么搞';
    console.log(arr);  //如果直接赋值给数组,那么会将整个数组覆盖

 直接赋值会替换相应的元素值;如果直接赋值给数组,那么会将整个数组覆盖。

5、数组案例

 a.计算数组的和及平均值。

思路:

声明一个求和变量sum。

遍历这个数组,把里面每个数组元素加到sum里面。

用求和变量sum除以数组的长度就可以得到数组的平均值。

        var arr=[1,3,5,7,9];
        var sum=0;
        var average=0;
        for(i=0;i<arr.length;i++){
            sum += arr[i];//要加的是arr数组的元素,而不是i
        }
        average = sum / arr.length;
        console.log(sum,average);//输出多个用,隔开
 b.求数组中最大值
        var arr=[1,3,5,7,9];
        var max = arr[0];
        for(i=0;i<arr.length;i++){
            if(arr[i] > max){
                max = arr[i];
            }
        }
        console.log(max);
c.数组转换为分割字符串
        var arr=['red','green','blue','black'];
        var str='';
        var sep = '*'
        for(i=0;i<arr.length;i++){
            str += arr[i] + sep;
            // str += arr[i] + '*';

        }
        console.log(str);
d.新建一个数组,存放100个整数

 思路:使用循环来追加数组。声明一个空数组arr。循环中的计数器i可以作为数组元素存入。由于数组的索引号是从0开始的,因此计数器从0开始更合适,存入的数组元素要+1。

        var arr =[];
        for(i=0;i<10;i++){
                // arr = [i];不能直接给数组名赋值,否则会替换
                arr[i] = i+1;//因为需要的是1-10,i从0开始,所以需要i+1;
        }
        console.log(arr);

 注意:不能直接给数组名赋值,否则会替换;因为需要的是1-10,i从0开始,所以需要i+1;

 e.筛选数组
//将数组中大于等于10的元素选出来,放到新的数组中
        var newArr = [];
        var arr = [23, 34, 6, 56, 7,  345, 64, 4, 1];
        var j = 0;
        for (var i = 0; i < arr.length; i++) {
            if(arr[i] >= 10) {
                //存储数组的索引必须从0开始,依次递增,所以这里要定义一个新的计数器j
                newArr[j] =arr[i];
                j++;
            }
        }
        console.log(newArr);

 另一种方法newArr.length

 var newArr = [];
        //此时newArr.length的长度是0
        var arr = [23, 34, 6, 56, 7, 345, 64, 4, 1];
        for (var i = 0; i < arr.length; i++) {
            if (arr[i] >= 10) {
                //存储数组的索引必须从0开始,依次递增
                newArr[newArr.length] = arr[i];
            }
        }
        console.log(newArr);
f.删除指定数组元素(简易去重)

        var arr = [3,5,2,8,3,8,0,3];
        var newArr = [];
        for(i=0;i<arr.length;i++){
            if(arr[i] != 3){
                newArr[newArr.length] = arr[i];
            }
        }
        console.log(newArr);
g,翻转数组

设置一个新的数组,把旧数组里的数从尾部开始依次扔进去。 

	var newArr = [];
	var arr = ['我', '不', '是', '黄', '容'];
	for (var i = arr.length - 1; i >= 0; i--) {
	    newArr[newArr.length] = arr[i];
	}
	console.log(newArr);
 h.复习交换两个变量
        // 交换两个变量
        var temp1 = 2;
        var temp2 = 7;
        var apple;
        apple = temp1;
        temp1 = temp2;
        temp2 = apple;
        console.log(temp1,temp2);
i,冒泡排序

冒泡排序是一种简单的排序算法。它重复地走访过要排序的数列,一次比较两个元素,如果他们的顺序措误就把他们交换过来。走访数列的工作是重复地进行直到没有再需要交换,也就是说该数列已经排序完成。这个算法的名字由来是因为越小的元素会经由交换慢慢“浮”到数列的顶端。 

 

        // 冒泡排序
        var arr = [2,6,1,8,4,7];
        for(var i=0;i<=arr.length-1;i++){//外层循环
            for(var j=0; j<arr.length-1-i;j++){
                if(arr[j]>arr[j+1]){//内部交换两个变量大的值,前面和后面比较
                    var temp;
                    temp = arr[j];
                    arr[j]=arr[j+1];
                    arr[j+1]=temp;
                }
            }
        }
        console.log(arr);

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值