一、运算符
1.1 算术运算符
算术运算符用来执行数学运算。
生活中常见的算术运算符有： + - * / %(取模，取余数)
// 表达式分为运算元和运算符
//JS中算术运算符：+ - * / % ++ --
// + 除字符串类型外参与的运算，执行数学运算 true隐式转换成数字 1 进行数学运算 false和null隐式转换成 0进行数学运算
console.log(10 + 20);//30
console.log(10 + 4.6);//14.6
console.log(10 + true);//11
console.log(10 + false);//10
console.log(10 + null);//10
console.log(10 + undefined);//NaN
// + 作为正号进行运算
console.log(+10);//10
console.log(+ "10");//10 可以转换数字字符串
console.log(+ "10ab");//NaN
console.log(+ true);//1
console.log(+ false);//0
console.log(+ null);//0
console.log(+ "");// 0 空字符串转为0
console.log(+ undefined);//NaN
// + 字符串参数与的多元运算，属于字符串拼接
console.log(10 + "");// "10" "string"
console.log(10 + "10");//"1010"
console.log("10" + 10);//"1010"
console.log("10" + true);//"10true"
console.log("10" + false);//"10false"
console.log("10" + null);//"10null"
console.log("10" + undefined);//"10undefined"
console.log("10" + NaN);//"10NaN"
// - * / % true隐式转换成数字 1 进行数学运算 false和null隐式转换成 0进行数学运算 undefined参与的都是NaN
console.log(10 - 5);//5
console.log(0.3 - 0.1);//0.19999999999999998
console.log(10 * "10");// 100 number 除了 + 之外的其它数学运算，字符串或者其它非数值类型都会隐式转为数值类型进行运算
console.log(10 * "10abc");// NaN number
console.log(10 - "");// 10
console.log(10 - false);// 10
console.log(10 / true);// 10
console.log(10 / null);// Infinity 无穷大
console.log(10 / undefined);// NaN
console.log(10 % null);// NaN
“+” 运算可以作为：加法运算、正号、字符串参与的运算作为字符串拼接
上面这些运算符同样适用于程序执行数学运算，在JS中除了上面几个，还有其它算术运算符： ++(自增) --(自增)
// 前++ 前--
var a = 1,
b = a;
console.log("a:",a,"b:",b);//a: 1 b: 1
--a;// --a ===> a = a - 1
++b;// ++b ===> b = b + 1
console.log("a:",a,"b:",b);//a: 0 b: 2
a = --a;
console.log("a:",a,"b:",b);//a: -1 b: 2
var c = ++b;
console.log("a:",a,"b:",b,"c:",c);//a: -1 b: 3 c:3
// 后++ 后--
var i = 1,
j = i;
console.log("i:",i,"j:",j);//i: 1 j: 1
i--;// i-- ===> i = i - 1
j++;// j++ ===> j = j + 1
console.log("i:",i,"j:",j);//i: 0 j: 2
//总结：根据实践结果，在自身操作前++和后++ 前--和后--问题上，没有什么区别
//第三方变量参与时，就不同了，如下观察结果
var s = j++;// 1. 先赋值 2. 再加加
console.log("i:",i,"j:",j,"s:",s);//i: 0 j: 3 s:2
i = i--;//这种方式只有面试的时候脑残面试官才会出这样的问题
console.log("i:",i,"j:",j,"s:",s);//i: 0 j: 3 s:2
//数学中的运算顺序：先乘除后加减
//程序中的运算同样是有顺序的：如上面的算术运算符，优先级 前++、前--、正负号（+ -） >> * / % >> + - >> 赋值运算符 = >> 后++ 后--
**练习：**使用 prompt() 方法提示用户输入两个数字，对这两个数字进行加法运算并打印求和结果。
如：用户输入 10 和 20这两个数字，求和后 结果为 30
1.2 比较运算符
比较运算符也叫关系运算。
比较运算符比较的结果是一个布尔值。
比较运算符有： > < >= <= ==(等于) !=(不等于) =(全等于) !(全不等于)
//纯数值进行比较 按照值得大小
console.log(10 > 20);//false
console.log(3.14 == Math.PI); //false
//数值和其它基本数据类型进行比较 将其它类型转为数值类型进行运算
console.log(10 > "5");//true
console.log(10 > "10ab");//false
console.log(10 < "10ab");//false
console.log(10 == "10ab");//false
console.log(1 == true);//true
console.log(0 == false);//true
console.log(0 == null);//false
console.log(1 === true);//false 数据类型不同
// “==”比较是值是否相同，忽略了数据类型 “===”比较的是值和数据类型是否完全相同
console.log(10 >= 10);//true 等价于 判断10大于10 或者 10等于10吗？
console.log(null === null);//true
console.log(undefined === undefined);//true
console.log(NaN === NaN);//false
console.log(Infinity === Infinity);//true
console.log(null == undefined);//true ES3中，才新增undefined数据类型，这个数据类型衍生自null 所以在比较值的时候他们是相同的
console.log(null === undefined);//false 数据类型不同 null数据类型为"object" undefined数据类型为"undefined"
//数字字符串之间的比较 按照ASCII码从左向右逐个进行比较表进行比较 ASCII码表中 0-9 对应的 ASCII值 48-57
console.log("24" > "15");//true
console.log("10" > "5");//false
console.log("234" > "25");//false
**练习：**使用prompt()提示用户输入两个数字，利用比较运算符比较其值大小
例如：用户输入 a = 150 和 b = 18， 那么a >= b 比较的结果是 true
1.3 逻辑运算符
用来进行逻辑运算，运算符有： & && | || ! (逻辑非)
①逻辑与&&
将逻辑与比喻成串联电路，判断过程，想象成电流通过的过程。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-q3ehsjE9-1687653616765)(02 运算符 与 Math对象.assets/image-20201228160908860.png)]
电流通过：如果a为真，电流能够通过流通到b，结果就是b；如果a为假，电流不能通过，停留在a，结果为a
②逻辑或||
将逻辑或比喻成并联电路，判断过程，想象成电流通过的过程。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-8ddRXG2U-1687653616766)(02 运算符 与 Math对象.assets/image-20201228160957966.png)]
电流经过时：如果a为真，电流直接从a完成循环，结果为a；如果a为假，电流从a不能经过，流经到b，我们结果是b。
真值表
逻辑与 && 运算：两边都为真才是真，有一个为假则为假。
| a | b | a && b 结果 |
|---|---|---|
| true | true | true |
| true | false | false |
| false | true | false |
| false | false | false |
逻辑或 || 运算：有一个为真即为真，两边都为假结果才为假
| a | b | a || b 结果 |
|---|---|---|
| true | true | true |
| true | false | true |
| false | true | true |
| false | false | false |
//逻辑运算符：逻辑与（& &&）同时满足才满足 逻辑或(| ||)只要有一个满足即满足 逻辑非(!)
console.log(true);//true
console.log(!true);//false
console.log(10);//10
console.log(!10);//false
console.log(-10);//-10
console.log(!(-10));//false
console.log(0);//0
console.log(!0);//true
//除了0之外的所有数字，进行逻辑非操作，得结果都是 false
console.log("hello");//"hello"
console.log(!"hello");//false
console.log("");// ""
console.log(!"");//true
//非空字符串进行逻辑非操作，所得结果都是false
console.log(null);//null
console.log(!null);//true
console.log(undefined);//undefined
console.log(!undefined);//true
console.log(NaN);//NaN
console.log(!NaN);//true
// && 和 || 具有短路效果，可以提高程序的执行效率 短路效果解释：
//逻辑与 两边同时满足才满足
//当第一个值是true的情况下，第二值决定最终结果
console.log(true && false);//false
console.log(true && true);//true
//当第一个值不成立，那么使用 && 的情况下，就不需要在进行后面的判断就能直接得出结果不满足
console.log(false && true);//false
//逻辑或 有一个满足即满足
//当第一个值是false的情况下，第二个值决定最终结果
console.log(false || true);//true
console.log(false || false);//false
//当第一个值条件成立，最终结果就是成立的，那么就不需要再去判断后面的结果了，这就是 || 短路效果
console.log(true || false);//true
//上面 || 和 && 进行运算，最终结果是 true 或 false
// 如果使用 | 和 & 进行布尔运算 最终结果是 0 或 1
console.log(true | false);//1
console.log(true & false);//0
所有的基本数据类型进行逻辑运算时，如何进行运算：
// 通过上一个案例逻辑非(!)的操作，我们总结出： 数值0、空字符串""、null、undefined、NaN、false都被当作条件不成立，在进行逻辑非操作时返回true
console.log(10 && 5);//5
console.log(10 && 0);//0
console.log(10 && "hello");//"hello"
console.log("" && "hello");//""
console.log("" || "10");// "10"
console.log("" || null);// null
console.log(undefined && null);// undefined
练习：
-
false || !false && false || true;
false || !false && false || true = false || true && false || true = false || false || true = false || true = true -
4 && “hello” || !false || !true && null;
4 && "hello" || !false || !true && null; = 4 && "hello" || true || false && null = "hello" || true || false = "hello" || false = "hello"
补充： 逻辑运算符优先级 ! >> && >> ||
1.3 赋值运算符
不同于前面运算符运算顺序从左向右，赋值运算符运算顺序是从右往左的。
如： var num; num = 10; 将右边的字面量10赋给左边的变量num
赋值运算符：= += -= *= /= %=
//声明一个变量num
var num;
console.log("num:",num);//num:undefined
//赋值运算符：= += -= *= /= %=
//对变量 num 进行赋值操作
num = 10;
console.log("num:",num);//num:10
num += 20;// 等价于 num = num + 20
console.log("num:",num);//num:30
num *= 10;//等价于 num = num * 10
console.log("num:",num);//num:300
num %= 7;//等价于 num = num % 7
console.log("num:",num);//num:6
num /= 3;//等价于 num = num / 3
console.log("num:",num);//num:2
1.4 运算符的优先级
运算优先级： 贴身（前++、前–、正+、负-、逻辑非!） >>> 算术运算符（先乘除后加减） >>> 比较运算符(先> >= < <= ，再 == ！=)>>逻辑运算符（先逻辑与&&，再逻辑或||）>>> 赋值运算符 >>> 后++、后–
**运算顺序：**除赋值运算符运算顺序从右往左，其它都是从左往右
1.5 三元运算符
语法： 条件表达式 ? 条件表达式成立执行的语句 : 条件表达式不成立执行的语句
示例：
var a = 100,
b = 50;
var maxNum = a > b ? a : b;
console.log("a 与 b中的最大值是：", maxNum);//a 与 b中的最大值是： 100
练习：提示用户输入两个任意大于0的整数，获取其中的最小值
1.6 运算符综合练习
var a = 4;
var sum = 1 * (2 + 3) && a++ || 5 > 6 && 7 < 8 || 9;
二、Math对象
这是JS中内置的一个对象，叫做算术对象。
Math 对象用于执行数学任务。
只要是对象，那么就具有特征与行为，体现到程序中就是属性和方法。
Math对象作为JS中的内置对象，给它内置了很多属性和方法。
Math将自己本身当作对象，可以直接调用这些属性和方法。
Math对象调用属性和方法的方式 Math.属性 Math.方法()
2.1 Math对象的属性
PI 获取圆周率Π=3.14…
2.2 Math对象的方法
random() 获取0-1之间的随机数 左闭右开[0,1)
round(num) 获取参数num的四舍五入的值
pow(x,y) 获取x的y次幂
sqrt(num) 获取参数num的开平方跟
//获取圆周率Π=3.14...
console.log(Math.PI);//3.141592653589793 JS中只能获取到小数点后15位
//pow(底数x，指数y) 获取x的y次方
console.log(Math.pow(2,4));//16
//sqrt(num) 获取开平方根
console.log(Math.sqrt(9));//3
//random() 获取 [0,1) 之间的随机数
console.log(Math.random());//每次结果不同
//获取 [0,10) 之间的随机数
console.log(Math.random() * 10);
//获取 [0,10) 之间的随机整数
console.log(parseInt(Math.random() * 10))
//获取 [0,10] 之间的随机整数
//round(num) 获取指定的四舍五入值
console.log(Math.round(Math.random() * 10))
三、条件语句
条件if语句，用来指定符合条件后需要执行的语句，不符合条件不执行。
类似于选择器，选择正确的答案，必须符合题干条件。
条件语句有很多种语法格式，如下：
-
只有if关键字的条件语句
if(条件表达式){
当条件表达式成立的情况下才会执行的语句
}
案例：判断一个人的年龄是否满18岁，如果满足了，那么你可以进入网站继续观看暴力电影
var age = parseInt(prompt("请输入您的年龄","18")); if(age >= 18){ alert("可以观看...") }满足条件，执行大括号中的语句体；不满足条件，跳出if语句，继续执行if语句后面的代码。
-
存在 else 的if语句
if(条件表达式){
当条件表达式成立的情况下才会执行的语句
}else{
条件表达式不成立执行的语句
}
案例：判断一个人的年龄是否满18岁，如果满足了，那么你可以进入网站继续观看暴力电影；如果不满18岁，那么请在家长陪同下进行观看。
var age = parseInt(prompt("请输入您的年龄","18")); if(age >= 18){ alert("可以观看...") }else{ alert("警告！！请在家长陪同下进行观看！！") }通过观察，不难发现，if…else语句 可以和 三元运算进行转换，如上代码，可以用三元表达式优化，如下：
age >= 18 ? alert("可以观看...") : alert("警告！！请在家长陪同下进行观看！！"); -
if else存在的多条件判断语句
if(条件一){
条件一满足执行的语句体
}else if(条件二){
不满足条件一，满足条件二执行的语句体
}…else if(条件N){
不满足N之前的条件，满足条件N执行的语句体
}else{
以上所有的条件都不满足执行的语句
}
思考？假设公司员工可以根据工龄，领取对应的福利商品：满10年的老员工，发红包2万元，购物卡1000元一张；满5年但是不满10年的老员工，发红包8000元，购物卡1000元一张；满3年但是不满5年的老员工，发红包3000元，购物卡800元一张； 满1年但是不满3年的老员工，购物卡1500元一张；不满一年的员工，购物开300元两张。
-
省略大括号的情况
如果if语句的大括号只有一条语句，那么我们就可以省略大括号。
如果有两条执行语句，省略大括号的情况下，直接报错
四、选择语句
switch语句，这是一个选择语句，根据条件去匹配对应的值，匹配成功，执行这条匹配下的语句。
- 语法格式
switch(表达式){
case 值1：
语句体1；
break;
case 值2:
语句体2；
break;
…
case 值N:
语句体N；
break;
default:
以上都不满足执行的语句体；
break;
}
注：default 语句可以写在 switch 中的任何位置，都是在 case 值都匹配不到的时候执行，习惯上放到最后。
default也可以省略，当不满足所有case时，不执行任何操作，直接跳出switch。
break是控制语句，打断的意思；这里用来跳出 switch 语句。也就是遇到break 语句就结束了。
需求一：请输入1-7之间的数字，判断今天是星期几`
需求二：请输入1-12之间的数字，判断当前月份的季节
-
变种
switch 中的表达式书写 true, 在 case 后面去写条件表达式。当 case 后面条件表达式成立，即执行对应的语句体，否则继续向下匹配，直到匹配成功，遇到 break 跳出。
需求三：根据用户输入的性别和年龄，判断用户是否满足结婚年龄（男：23 女：20）
四、循环语句
生活见到的循环事件有：商场的电梯、传送带、拖拉机传送带、工厂中的机器、驴拉磨。
循环指的其实就是只要符合一定的条件，就会不停的执行某个动作。直到通过外力或者不符合条件后，才会结束循环。
在程序中的循环有三种：while循环、do…while循环、for循环。
4.1 do…while循环
语法格式
do{
循环体
}while(条件表达式)；
不难发现，do…while 和 while循环最大的区别在于：do…while不管条件是否成立，都会至少执行一次循环。
需求：实现 10 次 “Hello World!” 的控制台输出。
练习：输出 1 - 100 之间，可以同时被 3 和 7 整除的整数（do…while实现）。
4.2 for循环
语法格式：
for(初始化变量; 条件表达式; 变量操作){
循环体
}
//需求：在控制台输出 10 次"Hello World"
//while循环向for循环的演变
//初始化变量
// var i = 0;
// //while循环
// while (i < 10){//条件表达式
// console.log("Hello World!");//大括号包裹的，叫做循环语句
// //变量操作
// i++;
// }
//初始化变量
// var i = 0;
// //for循环
// for (;i < 10;){//条件表达式
// console.log("Hello World!");//大括号包裹的，叫做循环语句
// //变量操作
// i++;
// }
//for循环
// for (var i = 0;i < 10;){//(初始化变量; 条件表达式)
// console.log("Hello World!");//大括号包裹的，叫做循环语句
// //变量操作
// i++;
// }
//for循环
for (var i = 0;i < 10; i++){//(初始化变量; 条件表达式; 变量操作)
console.log("Hello World!");//大括号包裹的，叫做循环语句
}
4.3 穷举思想
**概述：**我们想要得到一组数据，这些数据有特定的场景要求，计算机没有办法帮我们输出这些数据。我们需要人为的去编写一段程序，来实现这个功能：将所有可能符合要求数据，一一的列举出来，然后认为设置限制条件，将符合条件的数据筛选出来，不满足的跳过，继续验证下一个可能符合要求的数据，直到把所有可能的数据都验证一遍。这个方法就叫做穷举法，穷举法也叫全举法。
将可能符合要求的数据，使用for循环进行一一列举（遍历）;
在for循环的内部，使用if条件语句对这些可能符合条件的数据，进行一一验证，筛选出真正的符合条件的数据。
代码演示：提示用户输入一个大于0的整数，在控制台输出这个数字所有的约数
var num = Number(prompt("请输入一个大于 0 的整数","10"));
//按照穷举思想，先把所有可能的数据列举出来：一个数的约数，最小是1，最大是它本身
for(var i = 1; i <= num; i++){
// console.log("i:",i);
//按照约数的定义规则，判断是否是输出的这个数字的约数，判断条件：遍历的这个数字 i 可以整除 用户输入的数字 num
if(num % i == 0){//取余的结果为0，即是其约数
console.log(i,"是",num,"的约数！！");
}
}
4.4 for循环嵌套
for循环嵌套，说白了就是 for循环 里面嵌套 for循环
在页面文档中输出数据的方式： document.write(“内容”);
代码演示：在页面中输出 “九九乘法表”
<style>
table{
border-collapse:collapse;
}
td{
padding: 4px 8px;
border: solid 1px;
}
</style>
<script>
//向页面输出内容：可以是标签也可以是文本
// document.write("<h2>Hello World!!</h2>");
//页面上打印 九九乘法表
// for (var i = 1; i <= 9; i++) {//外层循环控制行
// for (var j = 1; j <= i ; j++) {//内层循环控制列 此时内层循环作为外层循环的循环体存在
// document.write(j + "×" + i + "=" + (i * j) + " ");
// }
// //上面内层循环执行完毕后，也就相当于这一行的结束，此时在这一行后面加换行符
// document.write("<br>")
// }
//加表格
document.write("<table>")
for (var i = 1; i <= 9; i++) {//外层循环控制行
document.write("<tr>")
for (var j = 1; j <= i ; j++) {//内层循环控制列 此时内层循环作为外层循环的循环体存在
document.write("<td>")
document.write(j + "×" + i + "=" + (i * j));
document.write("</td>")
}
document.write("</tr>")
}
document.write("</table>")
</script>
3.6 综合小练习
输出100~999之间的水仙花数（水仙花数指的时每个数值位上的数值的立方和等于当前数字）
如 153 = 1³ + 5³ + 3³
// 穷举思想第一步：--列举出所有可能的值
for (var i = 100; i < 1000; i++) {
// console.log("i:",i);
//声明三个变量：接收百位数字的 b 接收十位数字的 s 接收个位数字的 g
var b = parseInt(i / 100);
// console.log("b:",b)
var s = parseInt(i % 100 / 10);
// console.log("s:",s);
var g = parseInt(i % 10);
// console.log("g:",g);
//穷举思想第二步：通过设置条件，从可能的值中筛选出确定符合条件的值
if(Math.pow(b,3) + Math.pow(s,3) + Math.pow(g,3) == i){
console.log(i,"是水仙花数！！")
}
}
四、控制语句
一般情况下，我们在执行循环时，只要是满足循环条件，那么循环体就会一直执行下去。
这个时候，我们想要在循环时，达到某种条件时，控制循环的执行，那么就用到控制语句。
控制语句有两个：break 和 continue
-
break 打断、中断。在JS中，可以应用于 switch 语句、循环语句（常见于 for 循环），用来跳出语句或者说是结束语句的执行
需求：遍历1-10之间的数字，当数字是6的时候，跳出循环；打印结果：1，2，3，4，5
for (var i = 1; i <= 10; i++) { if(i == 6){ break; } console.log("i:",i); } console.log("循环执行完毕i:",i);控制台效果：
-
continue 继续。在JS中，一般应用于循环语句中，用来跳过本次循环继续下一个循环
需求：遍历1-10之间的数字，当数字是6的时候，跳过本次循环继续下一次循环；打印结果：1，2，3，4，5，7，8，9，10
for (var j = 1; j <= 10; j++) { if(j == 6){ continue;//跳过本次循环继续下一次循环 } console.log("j:",j); } console.log("循环执行完毕j:",j);控制台输出效果：
-
多层嵌套循环下，跳出或跳过指定循环
outter:for (var i = 1; i <= 5; i++) { inner:for (var j = 1; j <= 5 ; j++) { if(j == 3){ // break;//跳出当前循环，当前循环为内层循环 // continue;//跳过本次循环，继续下一次条件循环 // break outter;//跳出指定标记的那一层循环 continue outter; } console.log("i:",i,"j:",j); } }控制台效果：