【JavaScript 前端开发 】 第二章 下

一.算术运算符

 算数运算符有如下几种:

                + - * / %

                以上五种是最基本的加减乘除和取余

                其中取余的注意事项:例题如下          

            */

            // console.log(10%3);//1

            // console.log(10%-3);//1

            // console.log(-10%3);//-1

            // console.log(-10%-3);//-1

            //总结:取余结果的正负取决于%左边的正负,也就是两个数取余,首先全看成正数

            //然后结果的正负和%左边的正负一致即可.

            

            //** 幂运算 语法: a ** b 理解为a的b次方

            // console.log(2**3);//8

            

            //++ 和 -- 表示自增1 和自减1

            //有两种用法: a++ 表示先用在加 ++a表示先加再用

            

            //做算数运算的注意事项: 任何编程语言都有一个通病

            //做小数运算会可能损失精度

            // console.log(0.1+0.2);//0.300000004

            

            //所以JS提供了一个方法 来避免这种情况出现

            // aaa.toFixed(num); 表示保留小数点后面几位小数

            // aaa表示某个数 num表示保留几位 如果没写默认就是0

            // console.log( (0.1+0.2).toFixed(3) );

            //注意事项: 该方法的返回值是string类型.

            

            //字符运算符 就是一个 +

            // 字符之间的运算 通过 + 即可完成拼接

            // var str1 = "张三";

            // var str2 = "是猪";

            // console.log(str1+str2);//张三是猪

            

            //注意事项:任何类型 + string = string

            //所以:我们不仅可以将字符串转型成数字 也可以将任何类型 转成string

            //最常见的做法: 直接和空字符串相加即可.这样不会影响值的本身.

            // console.log( typeof (1234 + ""));

二.算术运算符的案例

           // 根据弹窗,用户输入的数据完成求和运算,能够利用运算符计算用户输入的两数之和

            // 为了避免JavaScript的精度问题,将结果保留两位小数。

            var num1 = prompt("请输入第一个数字");

            var num2 = prompt("请输入第二个数字");

            

            //注意:下面写法是错误的.原因: 因为toFieed方法只能给数字使用

            //但是prompt方法返回的一定是字符串,所以num1+num2的结果就是字符串.无法调用toFixed方法.

            // alert( (num1 + num2).toFixed(2) );

            

            //思考: 是一个一个将Num1和num2转成数字 还是为了节省代码将(num1+num2)看成一个整体然后进行转型

            //答案:这里不能为了节省代码. 因为string+string是字符串的拼接

            

            num1 = Number(num1);

            num2 = Number(num2);

            

            //这里注意:可以改进,如果结果是NAN 我们应该给用户提示一个"请输入合法的数据"

            

            //思路:将NAN的值弄清楚是什么类型 通过typeof 得知 NAN 是一个String类型

            if ( (num1 + num2).toFixed(2) == "NaN") {

                alert("请输入合法的数据");

            }else{

                alert( (num1 + num2).toFixed(2) );

            }

            

三.赋值运算符

          //赋值运算符:最常见的就是 = 将右边的式子赋给左边.

            // var a = 2 ;

            //不常见的有如下:

            // += *= -= /= %=

            //例如

            // a = a + 1; 等同于 a+=1;

            

            //习题:

            var a = 3;

            a += 2;     

            console.log(a);//5

            a -= 2;     

            console.log(a);//3        

            a *= 2;     

            console.log(a);//6         

            a /= 2;     

            console.log(a); //3    

            a %= 2;     

            console.log(a); //1

            a **= 2;        

            console.log(a); //1

四.比较运算符

            //比较运算符 用来比较两个值 怎么样 返回结果为boolean类型.

            //例如常见的有以下: > < >= <= != ==

            

            

            //了解一下的 === 表示全等于

            //==仅仅是判断值是否相等 ===不仅要值相等而且要类型相等

            console.log("1" == 1);//true

            console.log("1" === 1);//false

五.逻辑运算符

            //逻辑运算符的用法主要分为以下4类:

            // && 短路与 & 逻辑与

            // || 短路或 |逻辑或

            //用法完全一致 区别如下:

            // 例如 a && b

            //如果a和b都为真,返回值才为真. 那么当a为false 将不会执行b

            // 例如 a & b

            //如果a和b都为真,返回值才为真. 当a为false 将会执行b

            // 例如 a || b

            //如果a和b只要有一个为真,返回值才为真. 那么当a为true 将不会执行b

            // 例如 a | b

            //如果a和b只要有一个为真,返回值才为真. 当a为true 将会执行b

            

            var num = 1;

            false && num++;

            console.log(num);//1

            true || num++;

            console.log(num);//1

            

            var num = 1;

            false & num++;

            console.log(num);//2

            true | num++;

            console.log(num);//3

六.三元运行符

            /*

                三元运算符也称为三元表达式

                语法如下:

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

                如果条件表达式的值为true,则返回表达式1的执行结果。

                如果条件表达式的值为false,则返回表达式2的执行结果。

                常用于替代简单的if-else语句

            

            */

        

         var age = 18;

         // if (age>18) {

         //   alert("成年了");

         // } else{

         //   alert("未成年");

         // }

         alert( age>18?"陈年了":"未成年" );

七.流程控制_if

            //流程控制.如果没有流程控制,JS的代码将会从上至下依次执行

            //有了流程控制,可以根据需求来进行代码的执行顺序

            //JS中的流程控制:无非就是 if 和 switch

            //其中if分为 简单的if if-else if else if

            

            // 使用if语句实现只有当年龄(age变量值)大于等于18周岁时,才输出“已成年”,

            // 否则无输出。

            // var age = 18;

            // if (age>=18) {

            //      alert("已成年");

            // }

            

            // 使用if…else语句实现当年龄(age变量值)大于等于18周岁时,输出“已成年”,

            // 否则输出“未成年”,示例代码如下。

            // var age = 18;

            // if (age>=18) {

            //      alert("已成年");

            // }else{

            //  alert("未成年");

            // }

            

            // 使用if…else if…else语句实现对一个学生的考试成绩按分数进行等级的划分:

            // 90~100分为优秀,80~90分为良好,70~80分为中等,60~70分为及格,分数小于60则为不及格。

        //  var score = 75;

        //  if (score > 90) {

        //      alert("优秀")

        //  } else if(score>80) {

        //      alert("良好");

        //  }else if(score>60){

        //      alert("及格");

        //  }else{

        //      alert("不及格");

        //  }

        

        //如果可能性较少 就有2-4种,使用if即可 如果可能很多就推荐使用switch

        

        

        // switch语句也是多分支语句,相比if…else if…else语句,

        // switch语句可以使代码更加清晰简洁、便于阅读,其语法格式如下。

        /*

            switch ( 表达式 ) {

             case 值1:

                代码段1;

                break;

            case 值2

                代码段2;

                break;

             ...

            default:

                代码段n;

            }

        */

     // 使用switch语句判断变量week的值,若week变量的值为1~6时输出“星期一”~“星期六”,

     // 为0时输出“星期日”,若没有与week变量的值相等的case值时输出“错误”。

    

     var week = 2;

     switch (week){

            case 1:

                alert("周1");

                break;

            case 2:

                alert("周2");

                break;

            case 3:

                alert("周3");

                break;

            case 4:

                alert("周4");

                    break;

            case 5:

                alert("周5");

                break;

            case 6:

                alert("周6");

                break;

            case 0:

                alert("周日");

                    break;

            default:

                alert("没有这个日期");

                break;

     }

    

    

    

    

     // 注意事项1:break的重要性

     //如果case中没有break,那么进入case之后,将不会跳出,而是会直接进入后续的case,并且是无条件进入,直到被break或执行完毕

    

     // 注意事项2:如果存在多个case有相同的结果,怎么节省代码量。

var week = 2;

     switch (week){

            case 1:

            case 2:

            case 3:

            case 4:

            case 5:

                alert("工作日");

                break;

            case 6:

            case 0:

                alert("节假日");

                    break;

            default:

                alert("没有这个日期");

                break;

     }

八.循环结构

// for (var i = 1; i <= 100; i++) {

            // console.log(i);      // 输出1、2、3、4、5、6……100

            // }

            // var i = 1;

            // while (i <= 100) {

            // console.log(i);

            // i++;

            // }


 

            // var i = 1;

            // do {

            // console.log(i);

            // i++;

            // } while (i <= 100)

            

            //常用的跳转语句如下。

            // continue : 跳过本次循环,执行下一次

            // break: 直接跳出循环.

            

            //习题: 输出1-100 如果是3的倍数就不输出.如果输出了61就停止输出

            for(var i = 1; i<=100;i++){

                

                if(i%3==0){

                    continue;

                }

                

                if (i==61) {

                    break;

                }

                console.log(i);

                

            }

九.嵌套循环的案例

            // 下面以9层金字塔为例,案例效果如下,分别在页面和或控制台输出:

            /*

                 *

                 ***

                 *****

                 *******

                *********

             ***********

             *************

             ***************

            *****************

            

            */

        

        

         //页面输出的方法:

            

            //因为是9层 所有直接定义1-9的循环

            // for(var i = 1 ; i<=9;i++){

            //  //开始思考:每一行由什么组成:

            //  //答案:空格和星星

            //  //所以:控制行数的for循环内部:先打印空格,然后打印**

            //  //找规律: 第一行:8个空格+1个星星 第二行:7个空格+3个星星 第三行:6个空+ 5个星星:

            //  //结论:第几行的空格数: 空格的个数 = 9-i

            //  //结论:第几行的星星数: 2*i-1

            //  for(var j = 1 ; j<=9-i;j++){

            //      document.write("&nbsp;");

            //  }

            //  for(var k = 1 ; k<=2*i-1;k++){

            //      document.write("*");

            //  }

                

            //  //控制行数的for循环的最后一行肯定是换行:

            //  document.write("<br>"); //注意:页面的换行指的是<br> 控制台的换行才是 \n

            // }

            

            

            

            // var str = "";

         // for(var i = 1 ; i<=9;i++){

          //开始思考:每一行由什么组成:

          //答案:空格和星星

          //所以:控制行数的for循环内部:先打印空格,然后打印**

          //找规律: 第一行:8个空格+1个星星 第二行:7个空格+3个星星 第三行:6个空+ 5个星星:

          //结论:第几行的空格数: 空格的个数 = 9-i

          //结论:第几行的星星数: 2*i-1

         //   for(var j = 1 ; j<=9-i;j++){

         //       str = str + " ";

         //   }

         //   for(var k = 1 ; k<=2*i-1;k++){

         //       str = str + "*";

         //   }

          

         //   //控制行数的for循环的最后一行肯定是换行:

                // str = str + "\n";//注意:页面的换行指的是<br> 控制台的换行才是 \n

         // }

        

         // console.log(str);

        //console.log类似于Java中System.out.println();打印就自动换行

        //但是JS没有类似于System.out.print();的方法

        //所以如果想要在控制台实现类似的效果,应该将所有的内容放在一个字符串内.

        //然后通过console.log打印这个一个字符串

        

         //将99乘法表输出在页面上

         // for(var i = 1 ; i<=9;i++){//不仅是行数 而且还是被乘数

                // for(var j = 1;j<=i;j++){

                //  document.write(j + "*" + i + "=" + (i*j) + "&nbsp;" );

                // }

                // document.write("<hr>");

         // }  

        

         //将99乘法表输出在控制台上

         var str = "";

         for(var i = 1 ; i<=9;i++){//不仅是行数 而且还是被乘数

              for(var j = 1;j<=i;j++){

                    str = str + j + "*" + i + "=" + (i*j) + " ";

              }

                str = str + "\n";

         }

        

         console.log(str);

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值