前端基础——JavaScript运算符基础总结前言：打好基础，在日常开发工作中才能事半功倍。从一个简单的问题开始归纳基础

前言：打好基础，在日常开发工作中才能事半功倍。从一个简单的问题开始归纳基础知识

判断奇数偶数有哪些方法？

// 方法一： %  判断数字能否整除2
let num = 5
let isOdd = num % 2 === 1 // 奇数
let isEnve = num % 2 === 0 // 偶数
console.log(isOdd) // true

方法二：& 与位运算符
let isOdd2 = num & 1 === 1 // 奇数
let isEnve2 = num & 1 === 0 // 偶数

一、# Javascript 运算符

常见的运算符包括：一元运算符、算术运算符(二元运算符)、三元/三目运算符、赋值运算符、位运算符、比较运算符、逻辑运算符等

一元运算符

自增自减运算符，包括前置自增自减:先计算后输出和后置自增自减：先输出后计算。

let a = 1
console.log(++a) // 2
// 此时 a 已经执行了+1 此时a的值是2
console.log(a++) // 这里先输出 2 再执行加1

console.log(a) // 3

算术运算符（二元）

又称为二元运算符，需要两个操作数，用于执行基本的数学运算。如 +加,-减,*乘,/除,%取余,**幂

console.log(1 + 2) //3
console.log(1 - 1) //0
console.log(1 % 2) // 1
console.log(1 / 2) // 0.5
console.log(10 % 2) //5
console.log(2**2) //4

三元运算符

日常开发中，常用于条件判断条件是否成立？成立执行代码：不成立执行代码

let isYou = true
let result = isYou ? 'open' : 'close'
console.log(result) // 'open'

位运算符

JS 支持 7 个位运算符，与(&)、或(|)、异或(^)、取反(~)、零填充左位移(<<)，零填充右位移(>>>)，有符号右位移(>>)，除了取反是一元运算符，其他的都是二元运算符。

1.& 是二元运算符，它将左右两个数的相同二进制位进行比较，如果都为 1 则结果为 1，否则结果为 0

2.｜是二元运算符，它将左右两个数的相同二进制位进行比较，如果都为 0 则结果为 0，否则结果为 1

3.^异或运算符，将两个数的二进制的每一位进行异或操作，如果两个数对应位不同则结果为1，相同则为0

4.~反转所有位即1变成0,0变成1

let a = 5 // 
let b = 5
let c = 7
// 1的二进制00000001
// 3的二进制00000011
console.log(1&3) // 1 
console.log(1|3) // 得00000011 即3
console.log(a^b) // 0 可用于判断两个数是否相当于
console.log(a^c) // 2
console.log(~1) // -2 二进制11111110，查了一下这个二进制转成十进制是254 为什么这里输出-2？

//判断两个数是否相等
function isEqual(a, b) { 
  return (a ^ b) === 0 
}
console.log(isEqual(1,2)) // false

赋值运算法

即给变量赋值：如=,+=,-=,*=,/=,%=,**=,&=,|=,^=,<<=,>>=,>>>=

=即代表赋值；

+=,-=,*=,/=,%=,**=都是用于变量自身与其他变量（常量）做数学运算（加，减，乘，除，余，幂运算）

let b = 7
b += 2 // 即 相当于b=b+2 就是将7+2值给了b
console.log(b)// 9 
let a = 5
a **= 2 // 即 相当于a=a**2 就是将5的两次幂赋值给了a
console.log(a) //25

//使用^=快速求得
// 已知一个数组arr值的格式如下 [1, 1, 2, 2, 3, 3, 4, 5, 5];1 ≤ arr.length ≤ 1001,数组长度为奇数，并其中只有一个数字是独数，其他数字两两呈现
function solution(cards) {
    let res = 0
    for (let index = 0; index < cards.length; index++) {
      const el = cards[index];
      res ^= el
    }
   return res
}
console.log(solution([1, 1, 2, 2, 3, 3, 4, 5, 5]));
console.log(solution([0, 1, 0, 1, 2]))

比较运算符

顾名思义，比较两个值，如==,===,!=,!==,>,<,>=,<=,两个数比较之后输出的是布尔值

“==”、“===”符号用于比较两个数是否相等，返回值也是布尔值，其中“==”仅比较两个数的值，如果数据类型不相等，只要值相等就是true，“===”比较两个数的值以及数据类型，只有数据类型和值都相同才为true。

逻辑运算符

&&逻辑与，日常读法并且，符号两边条件都为真

||逻辑或，日常读法或者，符号两边只要有一边为真

!逻辑非，日常读法取反,将true变成false或将false变成true

逻辑运算符里的短路：只存在于 && 和 || 中，当满足一定条件会让右边代码不执行

// 逻辑或 一真则真 // 只要 || 左边成立了 为true 右边就不再执行 为false 就去执行
let b = '5'
let a = b || 0
console.log(a) // '5'
a = '7'
let c = b && a
console.log(c) // '7'

空值合并运算符 ??

??用于处理null或undefined的情况

 let a = null ?? 'me'
 let b = 0 ?? 'me'
 console.log(a,b) // 'me' 0

可选链运算符 ?.

用于安全访问对象的深层属性，避免因属性不存在而导致的错误。

// 如请求数据返回结果res
if (res?.result) {
// 通常接口返回的数据放在result中，我们判断接口返回的对象中是否存在result
// 如果请求异常，返回的数据中没有result属性
}

展开运算符 ...

用于将数组或对象展开为单独的元素

let arr1 = [1,2]
let arr2 = [3,4]
let arr = [...arr1,...arr2]
console.log(arr) // [1,2,3,4]
// obj 同理

类型运算符 typeof

用于检查一个变量的类型 typeof在对值类型number、string、boolean 、symbol、 undefined、 function、 bigint的反应是精准的；

但对于对象{ } 、数组[ ] 、null 都会返回 object

 let a = null 
 console.log(typeof(a)) // object

删除运算符

用于删除对象的属性

let obj = {name: 'alien', age: '1'}
delete obj.age
console.log(obj) // {name: 'alien'}

拓展：其他删除对象属性的方法

// 使用rest解构对象
let obj = {name: 'alien', age: '1'}
let {age,...newObj} = obj
// console.log(newObj)// {name: 'alien'}
// 使用ES6新增的Reflect.deleteProperty
Reflect.deleteProperty(obj,'age')
console.log(obj)// {name: 'alien'}

另外loadsh中的方法 unset

前端基础——JavaScript运算符基础总结