[JS]表達式與操做符

表達式是一個能夠被求值併產生一個值的JavaScript短語，常量、變量都是最簡單的表達式，它們能夠被求值和賦值（即產生新值）。基於簡單表達式來構建複雜表達式的方式是使用操做符，操做符以某種方式組合兩個及以上的簡單表達式。

表達式

表達式是一個能夠被求值併產生一個值的JavaScript短語，常量、變量都是最簡單的表達式，它們能夠被求值和賦值（即產生新值）。基於簡單表達式來構建複雜表達式的方式是使用操做符，操做符以某種方式組合兩個及以上的簡單表達式，列如：let result = x * y，x 與 y兩個簡單表達式被操做符*組合起來，造成的一個值爲result。

主表達式

最簡單的表達式稱爲主表達式，一般包括常量、變量等。

1.23 // 數值
"hello" // 字符串
true // 布爾值true
false // 布爾值false
null // null值
this // 當前對象
i // 變量i
sum // 變量sum

函數定義表達式

函數定義表達式定義JavaScript函數，其值爲新定義的函數，函數定義表達式由function關鍵字、參數列表、函數代碼塊（函數體）構成。

let square = function(x, y) {
  // ......
  return x * y
}

屬性訪問表達式

屬性訪問表達式是求對象屬性或數組元素的值，JS有兩種方式訪問屬性的語法，一個是表達式後跟一個句點和一個標識符，另外一個是表達式位於方括號的表達式。

let a = {x: 1, y: {z: 3}}
let b = [a, 4, [5, 6]]

// 第一種，句點
a.x // 1
a.y.z // 3

// 第二種，方括號
a[1] // 4
a[0].x // 1

條件式屬性訪問

當使用屬性訪問表達式時，若是.或[]的左側的表達式求值爲null或undefined，會報TypeError。所以，使用?.或?.[]語法防止這種錯誤發生。

let a = { b: null }
a.b?.c.d // undefined

let a = { b: undefined }
a.b?.c.d // undefined

let a = { b: {} }
a.b.c?.d // undefined

操做符

操做符用於算術表達式、比較表達式、邏輯表達式、賦值表達式等。多數的操做符都以+、=這樣的標點符號表示，可是也有一些以delete和instanceof關鍵字表示。關鍵字也是操做符，只是它的語法沒有那麼簡短。

操做符操做的對象叫作操做數，好比 a + b = c 中，+操做符須要操做a和b兩個操做數，而且+操做符操做數個數爲2。

in操做符

in操做符期待左側操做數是字符串、符號或能夠轉換爲字符串的值，期待右側操做數是對象。

let a = { x: 1, y: 1 }
'x' in a // true，對象a存在屬性名x
'c' in a // false，對象a不存在屬性名c

let b = [1, 2, 3]
'2' in b // true，b數組有索引值2
'3' in b // false，b數組沒有索引值3

instanceof操做符

instanceof操做符期待左側操做數是對象，右側操做數是對象類的標識。簡而言之，instanceof用於判斷一個操做數是否爲某個對象的實例。

let d = new Date()
d instanceof Date // true
d instanceof Object // true，全部對象都是Object的實例
d instanceof Array // false

typeof操做符

typeof操做符一般用於獲取一個操做數的類型，它返回的結果爲字符串，有"number"、"boolean"、"string"、"function"、"object"、"undefined"六種結果。

instanceof操做符是一個二元操做符，它須要有兩個操做數才能夠完成運算，而typeof是一元運算符，它僅須要一個操做數便可運算。

let b = 10
let a = "hello word!"
typeof b // number
typeof a // string

delete操做符

delete是一元操做符，刪除對象屬性或數組元素。

let a = { x: 1, y: 2 }
delete a.x
'x' in a // false，對象a不存在屬性名x

條件操做符

條件操做符又稱爲三元運算符，由於它有三個操做數，a ? b : c。

let a = 10
let flag = false
a > 0 ? (flag = true) : (flag = false) // flag爲true

若是第二和第三操做數相對複雜，能夠在其首尾添加一堆括號。

三元操做符簡化了if語句，上述代碼能夠寫成：

if (a > 0) {
  flag = true
} else {
  flag = false
}

先定義(??)

先定義操做符??是一個二元操做符，只有在第一個操做數值爲null或undefined時纔會返回第二個操做數的值。

let a = null
a ?? 10 // 結果爲10

由於a爲null值，因此返回第二個操做數的值。因此先定義操做符相似於以下表達式：

let a = null
a === null ? 10 : null // 結果爲10

?? 是對 || 的一個有用的代替，適合選擇先定義的操做數，而不是第一個爲真值的操做數。

let maxWidth = 0
let preference = {
    maxWidth: 120,
    title: "",
    visited: false
}

let max = maxWidth ?? preference.title ?? preference.visited ?? preference.maxWidth ?? 500 // 結果爲0

若操做數的值爲0、空字符串和false，而這些值在某些狀況下是徹底有效的，好比maxWidth是0因此就會被忽略。

let maxWidth = 0
let preference = {
    maxWidth: 120,
    title: "",
    visited: false
}

let max = maxWidth || preference.title || preference.visited || preference.maxWidth || 500 // 結果爲120

若操做符改成 ?? ，那麼對於該表達式來講，0也會成爲有效值，因此max爲0。