JS基础-运算符

运算符【操作符】

作用：通过运算符可以多一个或者多个值进行运算，并获取运算结果

运算符优先级

• 先乘除后加减，先&&后||
• 自增自减优先级 > 算术运算符 > 赋值运算符
• 表越上面表示优先级越高， 同一行的优先级一样高，其中逗号优先级最低

// 一道经典的优先级题目
var val = 'smtg';
console.log('Value is ' + (val === 'smtg') ? 'Something' : 'Nothing');
// Something 因为 + 的优先级高于三目运算符

算术运算符（二元运算符）

• +、—、*、/、%，上诉可以对两个值分别进行加法、减法、除法、取余运算，并将结果返回
• 对非Number的值进行运算的时候，会将这些值转换成number，然后再运算
• 任何值和字符串做加法运算，度会将其他值转成字符串然后相加，结果都是是两个字符串拼接的字符串【 故可通过数字加上空字符串，将数字转成字符串 】
• 除了加法运算符会将数字转字符串，其他运算符都会将字符串转成数字[ 故通过字符串-0，*1，/1，将string转成number ]

一元运算符

• 只需要一个操作数，本身不会对变量产生影响
• typeof 运算符用来判断js的基本类型,返回的结果是 变量的类型，值的类型以字符串的形式返回
• + - 分别表示正号、负号, 对于非Number类型的值，会将其先转换成number再运算【 对string使用+将其转成number,原理和Number函数一样 】

// 算术运算符
console.log(2+3,true+1,true+false,null+1,1+NaN) // 5 2 1 1 NaN
console.log('12'+'43','11'+11, 11+'11') // 1243 1111 1111
console.log(1+2+'3','1'+2+3, 2*'8', 2*undefined, 2*null) // 33 123 16

// 一元运算符
let num = typeof 1
console.log(typeof num, num) // string number 
// 第一个值是因为结果以字符串形式返回【等同于 `typeof (typeof 1) `】，第二个则是typeof 1的结果]
let aa = 123
console.log(+aa,-aa, +true,-true,+'12') // 123 -123 1 -1 12
console.log(1+ +'2' +2) //5, 其中+'2'将字符串2转成数字2啦

自增自减【也属于一元运算符】

自增： 可以在原变量的基础上加一，会直接影响原变量
自减： 可以在原变量的基础上减一，会直接影响原变量

• 自增分两种：前++和后++，但是都会使原变量立即+1；表达式里面 有的话就是立即有了变化
  • a++是表达式，a++的值是原变量的值
  • ++a的值是等于自增以后的值（新值）

let a = 1;
console.log(a++) // 1 ，a++是表达式，值还是1，
console.log(++a) // 3

let b = 2;
b++; // 这个b++使得b的值是3
console.log(b++) // 这个是输出表达式b的值故是3

let c = 10;
let res = c++ + ++c + c; 
console.log(res) // 24 相当于是（10 + 12 + 12），第一个c++是表达式值是10，此时c是11，第二个++c的值等于原值是12，第三个c是12

let d = 10;
d = d++;
console.log(d) // 10 d++的值赋值给d 其实就相当于 let a = 10； let e = a++；

逻辑运算符

• JS中三种逻辑运算符！、&&、||
• !非运算，对值做取反操作【故可以对任意类型转换成布尔类型使用!!，原理和Boolean一样】
• &&与运算，对符号两侧值做运算，取两者值，两者都为true返回true，其中只要有一个false就返回false
  • 属于短路与，如果左侧值为false就不会看右侧的值了，遇到false直接返回
  • 非布尔值运算：左侧值为false则返回左侧值，只要左侧值为true，就会返回右侧值，两个值都为true，则返回右侧
• ||或运算，只要有一侧值为true就会返回true，如果两个都为false才会返回fales
  • 遇到true直接返回
  • 非布尔值运算：左侧为true，直接返回左侧，不看右侧值，只要第一个值为false，则返回右侧的值

// 非运算
let a = '10';
console.log(!a) // false
console.log(!!a) // true 转换类型
// 与运算
console.log(1&&2,true&&false, false&&true, ''&&1) // 2 false false ''
// 或运算
console.log(1||2, false||true, false||false, ''||null)// 1 true false null

赋值运算符

• =符号右侧值赋值给左侧
• +=、 -=、 *=, /=, %= 符号左侧的值等于 符号左侧的值+ - *符号右侧的值

let a = 1, b=2, c=3, d=4, e=5, f=6;
b += a; // 等同于 b = b+a
c -= a 
d *= a
e /= a
f %= a // 等同 f = f%a
console.log(a,b,c,d,e,f) // 1 3 2 4 5 0

关系运算符

• 关系运算符有>、>=、<、<=、=
• 关系成立返回true、否则返回false；注意：任何值和NaN做比较都是false
• 非数值比较，会将其转换成数字然后比较，如果两侧都是字符串则会比较其Unicode编码，编码比较是一位一位比较
• 比较两个字符型的数字，结果可能是不可预期的比如：‘11’<‘5’ 返回true，可以转型之后比较’11’ < +‘5’
• unicode编码输出，js里面字符串格式'\u编码'，html里面格式&#编码;（需要将16进制的转成10进制）

console.log(5>6,7<8) // false, true
// 字符编码比较一位一位的比较，b = b  a大于空
console.log('bac'>'bcc') // false
// 转型之后的比较
console.log('11'<'5', '11' < +'5') // true, false
// unicode编码
console.log('\u2620') // ☠ 输出一个骷髅头

相等运算符

• 属于关系运算符,有 ==、!=、===、!==
• 比较两个值是否相等，会自动的做类型转换,
• NaN不和任何值相等，包括其本身
• 全等===,不会对变量做类型转换

console.log('1'==1,undefined==null,undefined==0,null==0,true==1) // true true false false true
console.log(NaN==NaN,1==NaN) // false、 false

条件运算符（三元运算符）

• 语法：条件表达式 ? 语句1 : 语句2
• 执行时，先对条件表达式求值(值如果是非布尔也会被转换成布尔)，值为true，则执行语句1，否则执行语句2

let aa = 3, bb =5;
let max = aa > bb ? aa : bb

---