- 算术运算符
+、-、*、/、%、**（幂次运算）
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><script>// /除法运算与C不同两个整数之间相除可能会得到小数let num1 = 5.0let num2 = 2.0console.log(num1 /num2)// **幂次运算console.log(num1 ** num2)console.log(num2 ** num1)// +加运算 不仅可以做数学运算还可以进行字符串拼接等功能console.log(num1 + num2)let str1 = "3"let str2 = "2"console.log(num1 + str1)console.log(str1 + str2)</script></body>
</html>
-
逻辑运算符
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>// 逻辑运算符或|| 由||链接Boolean值中如果一个为真 则表达式为真if (true || false || false || false){console.log(true)}else{console.log(false)}// 逻辑运算符&& 又&&连接起来的Boolean值 如果其中一个为假 则表达式为假let num1 = 10let num2 = 5// true && trueif (num1 > num2 && num1 - num2 >= num2){console.log(true)}else{console.log(false)}// 逻辑运算符！他表示取反// true && trueif (num1 > num2 && !(num1 - num2 > num2)){console.log(true)}else{console.log(false)}</script></body> </html> -
比较运算符
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//>、<、==、>=、<=、!=、===let num1 = 1let str1 = "1"// =赋值 ==值比较 ===值比较的基础上还会考虑类型if (num1 === str1){console.log(true)}else{console.log(false)}</script></body> </html> -
赋值运算符
赋值运输符，顾名思义，就是用来给变量赋值的，最常见的就是=，等于符号在数学上表示判断是否相等，在编程中一般表示将右侧的值赋给左侧，常见的赋值运输符见表8-1。
表达式 结果 a = 10 a最后的值是10 a += 10 a = a + 10,最后a的值加10 a -= 10 a = a - 10 a *= 10 a = a * 10 a /= 10 a = a / 10 a **= 10 a = a ** 10 表8-1 -
自增自减运算符
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>let a = 5let b = 10//a++会先提取值在进行表达式运算let c = a++ + ++bconsole.log(c--)let d = c-- - --cconsole.log(d)let e = d++console.log(e)</script></body> </html> -
三目运算符
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//三目运算符如果?的左侧结果是true，则返回冒号左侧的结果，否贼返回冒号右侧的结果let a = 11let b = 1c = a==b?false:trueconsole.log(c)</script></body> </html> -
位移运算符
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//位移运算符：将数字转化为2进制然后向右移动两位// >>右移 <<左移 >>>无符号右移 <<<无符号左移let a = -12// 1000 1100// 0010 0000 0000 0000 0000 0000 0011// 128 64 32 16 8 4 2 1// 1 1 1 1 1 1 1 1//12的二进制结果 1 1 00// 0 0 11// console.log(a>>2>>2)console.log(-12 >>> 2)</script></body> </html>
数据类型转换
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><script>//数据类型转换 自动转换//数据类型的自动转换通常是从精度低的转向精度高的类型,或者根据数据类型的优先级转换后进行运算//优先级 boolean < number < stringlet a = 1let b = 2.5c = a + bconsole.log(c)// let d = "123"// let e = a + d// let f = true// console.log(d + f)// console.log(e)// 强制转换会使用到两个函数parseInt和pareseFloatlet d = "123"//parseint会将小数的小数部分扔掉保留整数部分// d = parseInt(d)//parsefloat会完整保留小数d = parseFloat(d)console.log(d)e = a + dconsole.log(e)</script></body>
</html>
流程控制
-
顺序结构
从页面的视角去看，代码按照从上到下的顺序执行
从行的角度去看，代码按照从左到右的顺序执行
-
分支结构
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><script>flag = prompt("你试试坤坤的粉丝吗？","1")// if (flag == "1"){// console.log("太好了，我也是");// }else if(flag == "2"){// console.log("你好酷")// }else if(flag == "3"){// console.log("你好傻")// }else{// console.log("你好 路人")// }//使用switch语句的时候如果没有break，将会击穿条件语句，一直到break为止switch(flag){case "1":console.log("太好了，我也是");breakcase "2":console.log("你好酷")breakcase "3":console.log("你好傻")breakdefault:console.log("你好 路人");}//swich的效率非常高，一般情况是if多分支3倍，switch使用了快表的技术//当分支非常多的时候 尽量使用switch语句//switch的case中必须是一个具体的值而不能表达式。</script></body>
</html>
-
循环结构
-
for循环
-
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>// for while 是循环结构// 循环起始;循环结束;循环变化arr = [10,20,30,40,50,60]// for(let i = 0; i< arr.length;i++){// console.log(arr[i])// }//for of 在遍历数组的时候常用，相对上一种方式更为简洁// for(let num of arr){// console.log(num)// }//for in 常用于遍历对象的let obj = new Object();// 为对象属性赋值obj.name = "刘建宏"obj.age = 16;obj.gender = "男";for(let attr in obj){console.log(attr) //输入对象的属性名console.log(obj[attr]) //输入对象的属性值}</script></body> </html> -
while
-
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//while循环 会先判断条件 然后条件成立在执行语句//do while会先执行循环体 在判断条件知否成立// let i = 0;// while (i < 100) {// console.log(i)// ++i// }let i = 0// while (i < 0) {// console.log(i)// ++i// }do {i++console.log(i)} while (i < 0)// break中断当前循环且只能中断//continue中断本次循环进入下一次循环 当前循环有效</script></body> </html>
-
函数
-
什么是函数？
封装起来的代码片段，通常具有特定的功能，他可以提升代码的复用性，可读性等等
-
如何创建一个函数
在JS使用function关键字+函数名+([参数1,参数2,…])然后使用{}表示函数体
//语法结构 function 函数名([参数1.....]){//函数体代码[return 结果] }<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//使用关键字function创建函数add，形参是a和bfunction add(a,b){c = a + breturn c}//调用函数时只需要书写函数名，并将你需要进行运算的数字穿个形参即可//100和10是实参let num1 = parseInt(prompt("请输入第一个数字"))let num2 = parseInt(prompt("请输入第二个数字"))result = add(num1,num2)console.log(result)</script></body> </html><!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>function chufa(a, b) {let result = a / breturn result}// console.log(chufa(10,5)) 等价于一下let result = chufa(10,5)console.log(result)</script></body> </html> -
函数分为有参/无参函数、有返回值/无返回值、以及系统定义函数和自定义函数
-
值传递和引用传递
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//值传递，只是将变量的值赋值给了参数，让它参与函数的运算堆变量本身不产生任何影响//所有基本数据类型都是值传递function add(a){a = a + 10return a}num = 10console.log(add(num))// 20console.log(add(num))// 20console.log(add(num))// 20console.log(add(num))// 20function add2(arrary){arrary[0] += 10return arrary}//引用传递会将本身交给函数，它会参与函数的运算// 所有引用类型都是引用传递let arr = [1]console.log(add2(arr))//[11]console.log(add2(arr))//[21]console.log(add2(arr))//[31]console.log(add2(arr))//[41]</script></body> </html> -
函数作为参数进行传递
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>function area(width,height){return width * height}function C(width,height){return (width + height) * 2}function show(fn,width,height){return fn(width,height)}//函数作为参数传递时不能写参数列表否则表示调用，而不是传递函数console.log(C(10,10))console.log(show(C,10,10))console.log(show(area,10,10))</script></body> </html> -
默认值参数
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//默认值参数提高了编码效率，开发者可以使用默认值参数而不必传参，如果觉得默认值参数不够可靠，那么可以传参来覆盖原有的默认值function circleArea(r,PI=3.14){return PI*r*r}let result = circleArea(10)console.log(result)result = circleArea(10)console.log(result)</script></body> </html> -
匿名函数
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//所谓匿名函数，顾名思义就是没有名字的函数,一般情况下，匿名函数是用来当参数的，只是用一次，所以没有起名字的必要，直接在参数列表中写函数即可。function area(width,height){return width * height}function C(width,height){return (width + height) * 2}function show(fn, width, height) {return fn(width, height)}console.log(show(area,10,10))console.log(show(C,10,10))let result = show(function(a,b,){return a + b },10,10)console.log(result)</script></body> </html> -
lambda表达式
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>//lambda表达式又称箭头表达式，它在匿名函数的基础上进一步进行了省略（function都不用写了）//当参数列表为空时()=>{代码块}//当参数列表为一个是，可省略括号即 param=>{代码块}//当参数列表大于1时，括号不可省略（param1,param2,pra.....）=>{代码块}function show(fn, width) {return fn(width)}show((a)=>{console.log(a++ + ++a)},10)</script></body> </html> -
arguments
<!DOCTYPE html> <html><head><meta charset="utf-8"><title></title></head><body><script>function fn() {if(arguments.length == 2){console.log(arguments[0] * arguments[1])}else if(arguments.length == 3){console.log(arguments[0] + arguments[1] + arguments[2])}else if(arguments.length == 4){console.log(arguments[0]-arguments[1]-arguments[2]-arguments[3])}else{let result = 0for(param of arguments){result += param}console.log(result)}}fn(10, 20)//200fn(10, 20, 30)//60fn(10, 20, 30, 40)//-80fn(10, 20, 30, 40, 50)//150</script></body> </html>
--魔咒词典)
