关于javascript:JavaScript-系列三操作符

“Code tailor”，为前端开发者提供技术相干资讯以及系列根底文章，微信关注“小和山的菜鸟们”公众号，及时获取最新文章。

前言

在开始学习之前，咱们想要告诉您的是，本文章是对 JavaScript 语言常识中 “ 操作符 ” 局部的总结，如果您已把握上面常识事项，则可跳过此环节间接进入题目练习

• 一元操作符
• 位操作符（理解）
• 布尔操作符
• 乘性操作符
• 指数操作符
• 加性操作符
• 关系操作符
• 相等操作符
• 条件操作符
• 赋值操作符
• 逗号操作符
• 运算程序

如果您对某些局部有些忘记，👇🏻 曾经为您筹备好了！

什么是操作符？

在 ECMA-262 中形容了一组可用于操作数据值的符号被称为操作符

有哪些类型的操作符

一元操作符

只操作一个值的操作符叫一元操作符

1. 递增 / 递加操作符

• 递增操作符

有两种模式，即 ++i 和 i++ (两者有些稍微区别)

let age = 29
++age

实际上等于

let age = 29
age = age + 1 //console.log(age) = 30

i++ 和 ++i 的区别

• i++：先援用后自加
• ++i：先自加后援用
• 递加操作符

同理 i-- 和 --i 也有稍微区别

let age = 29
--age //console.log(age) = 28

let num = 2
let num1 = 20
let sum = num-- + num1 //console.log(sum) = 22;

// 如果换成这样
let sum = --num + num1 //console.log(sum) = 21;

留神： 该操作符能够作用于任何值，不限于整数 — 字符串、布尔值、浮点值、甚至对象都能够。

• 对于字符串，如果是无效的数值模式，则转换为数值再利用扭转。变量类型从字符串变成数值。
• 对于字符串，如果不是无效的数值模式，则将变量的值设置为 NaN。变量类型从字符串变成数值。
• 对于布尔值，如果是 false，则转换为 0 再利用扭转。变量类型从布尔值变成数值。
• 对于布尔值，如果是 true，则转换为 1 再利用扭转。变量类型从布尔值变成数值。
• 对于浮点值，加 1 或减 1。
• 如果是对象，则调用其 valueOf() 办法获得能够操作的值。对失去的值利用上述规定。如果是 NaN，则调用 toString() 并再次利用其余规定。变量类型从对象变成数值。

2. 一元加和减

一元加和减操作符对大多数开发者来说并不生疏，它们在 ECMAScript 中跟在高中数学中的用处一样。

• 一元加：由一个加号（+）示意，放在变量前头，对数值没有任何影响

let num = 25
num = +num
console.log(num) // 25

若利用到非数值，则会执行与应用 Number() 转型函数一样的类型转换；

留神：

• 布尔值 false 和 true 转换为 0 和 1
• 字符串依据非凡规定进行解析
• 对象会调用它们的 valueOf() 和（或）toString() 办法以失去能够转换的值

let a = '01'
let b = '1.2'
let c = 'c'
let d = false
let e = 1.2

a = +a // 变为数值 1
b = +b // 变为数值 1.2
c = +c // 变为 NaN
d = +d // 变为数值 0
e = +e // 不变

• 一元减： 由一个减号（ -）示意，放在变量前头，次要用于把数值变成负值，如把 1 转换为 -1。

let num = 25
num = -num
console.log(num) // -25

若利用到非数值，一元减会遵循与一元加同样的规定，先对它们进行转换，而后再取负值

let a = '01'
let b = '1.2'
let c = 'c'
let d = false
let e = 1.2

a = -a // 变为数值 -1
b = -b // 变为数值 -1.2
c = -c // 变为 NaN
d = -d // 变为数值 0
e = -e // 变为 -1.2

位操作符（理解）

用于数值的底层操作，也就是操作内存中示意数据的比特（位）

1. 按位非

按位非操作符用波浪符（~）示意，它的作用是返回数值的一补数

let num1 = 25 // 二进制 00000000000000000000000000011001
let num2 = ~num1 // 二进制 11111111111111111111111111100110
console.log(num2) // -26

2. 按位与

按位与就是将两个数的每一个位对齐，而后基于真值表中的规定，对每一位执行相应的与操作

let result = 27 & 4
console.log(result) // 0

/*
 27 = 0000 0000 0000 0000 0000 0000 0001 1011
 4  = 0000 0000 0000 0000 0000 0000 0000 0100
---------------------------------------------
AND = 0000 0000 0000 0000 0000 0000 0000 0000
*/

3. 按位或

按位或操作符用管道符（|）示意，同样有两个操作数，按位或遵循真值表

let result = 27 | 4
console.log(result) // 31

/*
 27 = 0000 0000 0000 0000 0000 0000 0001 1011
 4  = 0000 0000 0000 0000 0000 0000 0000 0100
---------------------------------------------
 OR = 0000 0000 0000 0000 0000 0000 0001 1111
 */

4. 按异位或

按位异或用脱字符（^）示意，同样有两个操作数，按位异或遵循真值表

let result = 27 ^ 3
console.log(result) // 24

/*
 27 = 0000 0000 0000 0000 0000 0000 0001 1011
 3  = 0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
XOR = 0000 0000 0000 0000 0000 0000 0001 1000
*/

5. 左移

左移操作符用两个小于号（<<）示意，会依照指定的位数将数值的所有位向左挪动

let oldValue = 2 // 等于二进制 10
let newValue = oldValue << 5 // 等于二进制 1000000，即十进制 64

留神在移位后，数值右端会空出 5 位。左移会以 0 填充这些空位，让后果是残缺的 32 位数值，左移会保留它所操作数值的符号

6. 有符号右移

有符号右移由两个大于号（>>）示意，会将数值的所有 32 位都向右移，同时保留符号（正或负）。有符号右移实际上是左移的逆运算

let oldValue = 64 // 等于二进制 1000000
let newValue = oldValue >> 5 // 等于二进制 10，即十进制 2

7. 无符号右移

无符号右移用 3 个大于号示意（>>>），会将数值的所有 32 位都向右移。对于负数，无符号右移与有符号右 移后果雷同

let oldValue = 64 // 等于二进制 1000000
let newValue = oldValue >> 5 // 等于二进制 10，即十进制 2

对于正数，有时候差别会十分大。与有符号右移不同，无符号右移会给空位补 0，而不论符号位是什么。

let oldValue = -64 // 等于二进制 11111111111111111111111111000000
let newValue = oldValue >>> 5 // 等于十进制 134217726

/*
11111111111111111111111111000000 => 等于 -64
00000111111111111111111111111110 => 等于 134217726
*/

布尔操作符

1. 逻辑非

console.log(!false) // true
console.log(!'blue') // false
console.log(!0) // true
console.log(!NaN) // true
console.log(!'') // true
console.log(!12345) // false

2. 逻辑与

let found = true;
let clear = {};
let result = (found && clear); // 返回 clear

3. 逻辑或

let myObject = preObject || afeObject

preObject 变量蕴含首选的值，afeObject 变量蕴含备用的值

• 如果 preObject 不是 null，则它的值就会赋给 myObject；
• 如果 preObject 是 null，则 afeObject 的值就会赋给 myObject。
• 这种模式在 ECMAScript 代码中常常用于变量赋值

乘性操作符

ECMAScript 定义了 3 个乘性操作符：乘法、除法和取模

1. 乘法操作符

乘法操作符由一个星号（*）示意，能够用于计算两个数值的乘积。其语法相似于 C 语言

let result = 12 * 34

留神：

2. 除法操作符

除法操作符由一个斜杠（/）示意，用于计算第一个操作数除以第二个操作数的商

let result = 34 / 12

留神：

3. 取模操作符

取模（余数）操作符由一个百分比符号（%）示意

let result = 16 % 5 // 余 1 个

指数操作符

ECMAScript 7 新增了指数操作符（**），Math.pow() 当初有了本人的操作符，后果是一样的

console.log(Math.pow(4, 2); // 16
console.log(4 ** 2); // 9
console.log(Math.pow(16, 0.5); // 4
console.log(16 ** 0.5); // 4

加性操作符

加性操作符，即加法和减法操作符，个别都是编程语言中最简略的操作符

1. 加法操作符

注：第一操作数和第二操作数无特定程序

let result = 10 + 10 // 20
let result2 = 10 + '5' // 105

2. 减法操作符

补充：如果有任一操作数是字符串、布尔值、null 或 undefined，则先在后盾应用 Number()将其转换为数值，而后再依据后面的规定执行数学运算

let result1 = 6 - true // true 被转换为 1，所以后果是 5
let result2 = NaN - 2 // NaN
let result3 = 6 - 3 // 3
let result4 = 6 - ''//"" 被转换为 0，所以后果是 6
let result5 = 3 - '2' // "2" 被转换为 2，所以后果是 1
let result6 = 2 - null // null 被转换为 0，所以后果是 2

关系操作符

关系操作符执行比拟两个值的操作，包含小于（<）、大于（>）、小于等于（<=）和大于等于（>=），用法跟数学课上学的一样

let result1 = 6 > 3 // true
let result2 = 4 < 3 // false

// 补充：let result1 = NaN < 5 // false
let result2 = NaN >= 5 // false

相等操作符

判断两个变量是否相等是编程中最重要的操作之一

ECMAScript 提供了两组操作符。第一组是 等于 和不等于 ，它们在比拟之前执行转换。第二组是 全等 和不全等，它们，在比拟之前不执行转换。

1. 等于和不等于

等于操作符用两个等于号（==）示意，如果操作数相等，则会返回 true

不等于操作符用叹号和等于号（!=）示意，如果两个操作数不相等，则会返回 true

补充：（1）NaN 不等于 NaN

（2）null 和 undefined 相等

（3）null 和 undefined 不能转换为其余类型的值再进行比拟

2. 全等和不全等

全等和不全等操作符需在比拟数在不转换的前提下全等或不全等才返回 true

let result1 = '34' == 34 // true，转换后相等
let result2 = '34' === 34 // false，不相等，因为数据类型不同

let result1 = '23' != 23 // false，转换后相等
let result2 = '23' !== 23 // true，不相等，因为数据类型不同

let result1 = null == undefined // true
let result1 = null === undefined // false, 不是雷同的数据类型

条件操作符

条件操作符是 ECMAScript 中用处最为宽泛的操作符之一

let min = num1 < num2 ? num1 : num2

// 如果 num1 小于 num2，则返回 num1，否则返回 num2

赋值操作符

简略赋值用等于号（=）示意，将右手边的值赋给左手边的变量

let num = 100

每个数学操作符以及其余一些操作符都有对应的复合赋值操作符

逗号操作符

逗号操作符能够用来在一条语句中执行多个操作

let num0 = 1,
  num1 = 2,
  num2 = 3

运算程序

1. 优先级

JavaScript 各种运算符的优先级别（Operator Precedence）是不一样的。优先级高的运算符先执行，优先级低的运算符后执行。

3 + 1 * 2 // 6

在上段代码中，乘法运算符（*）的优先级高于加法运算符（+），所以先执行乘法，后执行加法。

这是一个很简略的优先级问题，但如果多个运算符混写在一起，经常会令人困惑。

var x = 1
var array = []

var y = array.length <= 0 || array[0] === undefined ? x : array[0]

// 因而上述代码理论运算是这样的
var y = array.length <= 0 || array[0] === undefined ? x : array[0]

注：记住所有运算符的优先级是没必要的，用到时查问就好。

2. 左联合和右联合

对于优先级别雷同的运算符，大多数状况，计算程序总是从左到右，这叫做运算符的“左联合”（left-to-right associativity），即从右边开始计算。

a + b + c

像这种很简略就是先计算右边 a 与 b 的和，再计算与 c 的和

但有一些运算符的计算程序是从右到左，即从左边开始计算，这叫做运算符的 ” 右联合 ”。次要有赋值运算符（=）和三元条件运算符（?: ）

h = x = y = z
i = a ? b : c ? d : e ? f : g

// <== 等价于 ==>
h = x = y = z
i = a ? b : c ? d : e ? f : g

题目自测：

1: 上面代码输入什么 ?

;+true
!'Lydia'

• A: 1 and false
• B: false and NaN
• C: false and false

2: 上面代码输入什么 ?

function sum(a, b) {return a + b}

sum(1, '2')

• A. NaN
• B. TypeError
• C. "12"
• D. 3

3: 上面代码输入什么？

!!null
!!''
!!1

• A. false true false
• B. false false true
• C. false true true
• D. true true false

4: 上面代码输入什么？

console.log(3 + 4 + '5')

• A. "345"
• B. "75"
• C. 12
• D. "12"

题目解析

一、

Answer: A

+ 号运算符将 true 转换为 Number 类型 1

而 string 类型 Lydia 转化为 Boolean 值为 true，而后面有 ！，故返回 false

二、

Answer: C

当 + 运算符碰到数值与字符串相加时，将数值转化为字符串，再拼接

三、

Answer: B

null 是 false. !null 返回 true. !true 返回 false.

"" 是 true . !"" 返回 true. !true 返回 false.

1 是 true. !1 返回 false. !false 返回 true.

四、

Answer: B

运算符关联性是编译器计算表达式的程序，从左到右或从右到左。只有当所有运算符具备雷同的优先级时，才会产生这种状况。咱们只有一种运算符：+。此外，关联性是从左到右的。

先运算 3+4。后果是数字 7。

7+“5”隐式转化为“75”。JavaScript 将数字 7 转换为字符串，咱们能够应用 + 运算符连贯两个字符串。