表达式
表达式是一个可以被求值并产生一个值的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。