运算符
- JavaScript 中的运算符用于执行各种运算。
赋值运算符
简单赋值运算符
- 将右侧的值赋给左侧的变量, 先算等号右侧,再算等号左侧
- =
- 示例
let a = 5; console.log(a); //5
算术运算符
- + 加法
- - 减法
- * 乘法
- / 除法
- % 取模,即求余数
- ** 指数运算符,用于计算基数(base)的指数(exponent)次幂。在ES2016(即ES7)中引入,作为数学幂运算的一种简写方法。
- ++ 自增运算符 在自身的基础上+1,正常运算
- i++ : 先取值,后运算
- ++i : 先运算,后赋值
- -- 自减运算符
组合赋值运算符
- 将左侧的变量与右侧的值进行运算后再赋值给左侧的变量
- +=
- -=
- *=
- /=
- %=
- 示例
let num = 2; num += 3; // num+=3 => num=num+3 console.log(num); //5
比较运算符
- == 等于,进行数据类型转换后比较,返回一个布尔值
- === 全等, 严格等于,不进行类型转换, 只要数据类型不一样,返回 false
- != 不等于,进行类型转换后比较
- !== 绝对不等, 严格不等于,不进行类型转换
- > 大于
- < 小于
- >= 大于等于
- <= 小于等于
逻辑运算符
- && 逻辑与 左右两边都成立,这个条件成立,整体结果就是 true
- 如果前边转布尔是 true,那就取后边的,反之就取前边的
- || 逻辑或 左右两边只要有一个成立,这个条件就成立,整体结果就是 true
- 如果前边转布尔是 false,就取后面的,反之就是前面的
- ! 逻辑非 把其他数据类型先转布尔,然后取反
- !! 两次逻辑非运算操作,就相当于把操作数转换为布尔值
- 示例
// && let num = 1 && 2; console.log(num); //2 let num1 = 0 && 1; console.log(num1); //0 if (1 == "1" && 2 === "2") { console.log(100); } // || let num = 1||2; console.log(num);//1 let num1 = 0||1;//1 let num3 = 0&&1||1&&2;//2 if(1==true||2===3){ console.log(200) // 200 }
位运算符
其他运算符
字符串运算符
- + 连接字符串
三元运算符
- condition ? value1 : value2 如果condition为true返回value1,否则返回value2
逗号运算符
- , 允许在一条语句中执行多个操作,返回最后一个操作的结果
let x = 1;
x = (x++, x);
console.log(x);
// Expected output: 2
x = (2, 3);
console.log(x);
// Expected output: 3
关系运算符
- in 判断对象是否拥有给定的属性
- instanceof 判断对象是否是某个构造函数的实例
展开运算符和剩余参数
- … 展开运算符用于将数组或对象的元素/属性扩展到一个新的数组或对象中,或者在函数调用时将数组转换为参数序列。剩余参数用于将不定数量的参数表示为一个数组
需计算的成员访问
- 属性访问器提供了两种方式用于访问一个对象的属性,它们分别是点号和方括号。
- .
- [] 获取变量只能用中括号
- 中括号法可以用变量作为属性名,而点方法不可以;
- 中括号法可以用数字作为属性名,而点语法不可以;
运算符优先级
- 每种运算符都有特定的运算顺序,称为运算符优先级。在复杂表达式中,运算符优先级和结合性决定了表达式的计算顺序。可以使用圆括号 () 来明确指定运算顺序。
- 运算符的优先级决定了表达式中运算执行的先后顺序。优先级高的运算符会作为优先级低的运算符的操作数
- 运算符优先级 MDN
所有运算符按照优先级的不同从高(19)到低(1)排列 成员访问:寻找对象里的属性名所对应的属性值就是成员访问(19) new(带参数列表):就是构造函数执行有括号(19) new(无参数列表):就是构造函数执行没有括号(18) 优先级一样,从左到右运算
- 运算符优先级 MDN
ES2020 (ES11)
可选链操作符(Optional Chaining)
- ES2020的可选链接运算符让我们可以新加一个?(可选链操作符语法?.),检查对象深处是否存在值。
-
?. 是一个可选链操作符,它允许你安全地访问对象的嵌套属性,而不需要在每个级别上显式检查是否存在。如果链中的某个属性不存在(即为 null 或 undefined),表达式会短路并返回 undefined,而不是抛出一个错误。
- 当检查嵌套对象内部的属性时,通常必须检查中间对象的存在,不用像以前用&&去判断前一项是否存在或者部分情况用三元去判断。
object?.property object 不存在 返回undefined object?.[expression] object 不存在 返回undefined func?.(args) func 不存在 返回undefined ———————————————————————————————————————— const res = { "result": true, "message": "success", "data": { "id": 726, "title": "你要努力的去生活,因为你只有努力了,才知道自己真的不行。", "hits": 31, "status": 1, "user_id": 1 , "obj":{ "name":"zhainanya" } } } let a=res.data?.obj?.name; //如果返回的对象中有data,就取res.data.obj,没有返回undefined //如果data中有obj,就取res.data.obj.name,没有返回undefined console.log(a);
-
空位合并运算符(Nullish coalescing Operator)
- 空位合并运算符是一个非常简单的名称,使我们能够检查一个值是否为null或undefined,如果是,则默认为另一个值,仅此而已。
- 转布尔为false是下面五种情况
- null
- undefined
- 空字符串 “”
- 0
- 没有数字-NaN
const result={
"result":true,
"message":"success",
"data":{
"a":0,
"b":"",
"c":null,
"d":undefined,
"e":NaN,
}
}
let b=result.data.a?result.data.a:"";
console.log(b);//想要0但是结果是""
let c=result.data.a??""
console.log(c);//0
let d=result.data.c??"";
console.log(d);//""
let f=result.data?.c??"";
console.log(f);//""
let e=result.data?.a??"";
console.log(e);//0
//如果result.data存在,就取result.data.a
// 如果result.data.a其值不为null或undefined,就取自身,反之取??后面的"""
ES2021(ES12)
数字分隔符
- 数字分隔符是指数值字面量中使用的下划线(_),目的是为了提高可读性,特别是在处理大量数字时。这一特性在ES2021(即ES12)中被引入。使用数字分隔符,可以将数字分隔成更易于阅读的形式,但是在解析时,分隔符会被忽略,不会影响数字的实际值。
let billion = 1_000_000_000; // 十亿 1,000,000,000
let bytes = 0xFF_FF_FF_FF; // 一个32位的十六进制数 4294967295
需要注意的是,数字分隔符有以下几个使用规则:
不能在数字的最前面或最后面使用分隔符(例如,不可以写成_100或100_)。
不能有连续的分隔符(例如,不可以写成10__000)。
不能在数字的小数点或科学记数法的e(或E)直接前后使用(例如,不可以写成1_.5、1.5、1e_7或1e7)。
遵守这些规则,你可以在任何你觉得有助于增加可读性的地方使用数字分隔符,无论是整数、小数还是不同进制的数值(如二进制、八进制、十六进制)。
逻辑或赋值
- ||= 是逻辑或赋值(Logical OR assignment)运算符,是逻辑运算符 || 和赋值运算符 = 的组合,用于仅在左侧的操作数是“false”值时,将右侧的操作数赋值给左侧的操作数。
- “false”值包括:false、0、-0、0n(BigInt的0)、“”(空字符串)、null、undefined 和 NaN。
let a = null; let b = "default value"; a ||= b; console.log(a); // 输出:"default value" 因为 a 是 null(一个 false 值) let c = "existing value"; c ||= b; console.log(c); // 输出:"existing value" 因为 c 是一个 true 值