一、算术运算符
算数运算符有如下几种：
+ - * / %
以上五种是最基本的加减乘除和取余
其中取余的注意事项：例题如下
console.log(10%3);//1
console.log(10%-3);//1
console.log(-10%3);//-1
console.log(-10%-3);//-1
总结:取余结果的正负取决于%左边的正负,也就是两个数取余,首先全看成正数，然后结果的正负和%左边的正负一致即可。
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类型.
2.字符运算符
就是一个 +
字符之间的运算 通过 + 即可完成拼接
var str1 = "张三";
var str2 = "是猪";
onsole.log(str1+str2);//张三是猪
注意事项:任何类型 + string = string
所以:我们不仅可以将字符串转型成数字 也可以将任何类型 转成string
最常见的做法: 直接和空字符串相加即可.这样不会影响值的本身.
console.log( typeof (1234 + ""));
练习：
根据弹窗，用户输入的数据完成求和运算，能够利用运算符计算用户输入的两数之和。
为了避免JavaScript的精度问题，将结果保留两位小数。
| <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> 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) ); } </script> </body> </html> |
二、赋值运算符
赋值运算符: 最常见的就是 = 将右边的式子赋给左边.
var a = 2 ;
不常见的有如下:
+= *= -= /= %=
例如
a = a + 1; 等同于 a+=1;
习题:
var a = 3;
a += 2;
console.log(a);//5
a -= 2;
onsole.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?"成年了":"未成年" );
六、流程控制
如果没有流程控制,JS的代码将会从上至下依次执行，有了流程控制,可以根据需求来进行代码的执行顺序。
JS中的流程控制:无非就是 if 和 switch
其中if分为 简单的if if-else if else if
练习1：
使用if语句实现只有当年龄（age变量值）大于等于18周岁时，才输出“已成年”，
否则无输出。
| var age = 18; if (age>=18) { alert("已成年"); } |
练习2：
使用if…else语句实现当年龄（age变量值）大于等于18周岁时，输出“已成年”，
否则输出“未成年”，示例代码如下。
| var age = 18; if (age>=18) { alert("已成年"); }else{ alert("未成年"); } |
练习3：
使用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;
}
练习4：
使用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; } |
七、循环结构
1.for循环
for (var i = 1; i <= 100; i++) {
console.log(i); // 输出1、2、3、4、5、6……100
}
2.while循环
var i = 1;
while (i <= 100) {
console.log(i);
i++;
}
3.do....while循环
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); } |
八、嵌套循环的案例
| <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> // 下面以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(" "); // } // 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) + " " ); // } // 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); </script> </body> </html> |
9877
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
