JavaScript-表达式和运算符

àì夳堔傛蜴生んèń 2021-09-09 09:30 466阅读 0赞

## 原始表达式 ##

最简单的表达式是“原始表达式”（primaryexpression）。原始表达式是表达式的最小单位——它们不再包含其他表达式。JavaScript中的原始表达式包含常量或直接量、关键字和变量。

**直接量**

1.23
    "abc"

**保留字**

true
    false
    null
    this

**变量**

i
    sum
    undefined

## 对象和数组的初始化表达式 ##

**数组**

[] 			//空数组
    [1+2,3+4] 	//拥有两个元素的数组

**嵌套**

var m=[[1,2,3,],[4,5,6],[7,8,9]];

数组直接量中的列表逗号之间的元素可以省略，这时省略的空位会填充值undefined。

var a=[1,,,,5];
    数组包含五个元素
    第一个是1 最后一个是5 其他的是undefined

## 对象 ##

对象初始化表达式和数组初始化表达式非常类似，只是方括号被花括号代替，并且每个子表达式都包含一个属性名和一个冒号作为前缀

var p = { x:2, y:6}; //拥有两个属性成员的对象
    var q = {};			//一个空对象
    q.x=3; q.y=6;		//添加属性成员并赋值

**嵌套**

var s ={
    	p = { x:2, y:6},
    	q = { x:2, y:6}
    };

## 函数定义表达式 ##

一个典型的函数定义表达式包含关键字function，跟随其后的是一对圆括号，括号内是一个以逗号分割的列表，列表含有0个或多个标识符（参数名），然后再跟随一个由花括号包裹的JavaScript代码段（函数体）

var square = function(x){
    	return x*x;
    }

## 属性访问表达式 ##

属性访问表达式运算得到一个对象属性或一个数组元素的值

a.x
    a[x]

第一种写法是一个表达式后跟随一个句点和标识符。  
第二种写法是使用方括号，方括号内是另外一个表达式（这种方法适用于对象和数组）

var o = {x:1,y:{z:3}};
    var a = [o,4,[5,6];
    o.x //表达式o的x属性
    o.y.z //表达式o.y的z属性
    o["x"] //对象o的x属性
    a[1] //表达式a中索引为1的元素
    a[2]["1"] //表达式a[2]中索引为1的元素
    a[0].x //表达式a[0]的x属性

## 调用表达式 ##

调用表达式（invocationexpression）是一种调用（或者执行）函数或方法的语法表示。  
它以一个函数表达式开始，这个函数表达式指代了要调用的函数。  
函数表达式后跟随一对圆括号，括号内是一个以逗号隔开的参数列表，参数可以有0个也可有多个。

f(0) //f是一个函数表达式；0是一个参数表达式
    Math.max(x,y,z) //Math.max是一个函数;x,y,z是参数
    a.sort() //a.sort是一个函数，它没有参数

## 对象创建表达式 ##

对象创建表达式（object creationexpression）创建一个对象并调用一个函数（这个函数称做构造函数）初始化新对象的属性。对象创建表达式和函数调用表达式非常类似，只是对象创建表达式之前多了一个关键字new

new Object()
    new Point(2,3)
    如果一个对象创建表达式不需要传入任何参数 空园括号可以省略
    new Object
    new Date

## 运算符概述 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQwMzYzMg_size_16_color_FFFFFF_t_70]标题为A的列表示运算符的结合性，L（从左至右）或R（从右至左）  
标题为N的列表示操作数的个数。  
标题为“类型”的列表示期望的操作数类型，以及运算符的结果类型

**左值**  
左值（lvalue）是一个古老的术语，它是指“表达式只能出现在赋值运算符的左侧”。在JavaScript中，变量、对象属性和数组元素均是左值。ECMAScript规范允许内置函数返回一个左值，但自定义的函数则不能返回左值。

**运算符优先级**  
每个水平分割线内的一组运算符具有相同的优先级。运算符优先级控制着运算符的执行顺序。优先级高的运算符（表格的顶部）的执行总是先于优先级低（表格的底部）的运算符。

## 算术表达式 ##

基本的算术运算符是\*（乘法）、/（除法）、%（求余）、+（加法）和-（减法）。

### “+”运算符 ###

1+2 //3
    "hello" + " hello" //"hello hello"
    "1"+"2" //"12"

"1"+2 //"12" 数字转换为字符串后进行字符串连接
    1 + {} //"1[object]" 对象转换为字符串后进行字符串连接
    true + true //2 布尔值转换为数字后做加法
    2 + null //2 null转换为0后做加法
    2 + undefined //NaN undefined转换为NaN后做加法
    
    1 + 2 + "abc" //"3abc"
    1 + (2 + "abc") //"12abc"

### 一元算术运算符 ###

#### 一元加法(+) ####

一元加法运算符把操作数转换为数字（或者NaN），并返回这个转换后的数字。如果操作数本身就是数字，则直接返回这个数字。

#### 一元减法（-） ####

当“-”用做一元运算符时，它会根据需要把操作数转换为数字，然后改变运算结果的符号。

#### 递增（++） ####

var i = 1, j = ++i;
    i和j的值都是2
    var i = 1, j = i++;
    i是2 j是1

#### 递减（–） ####

递减“-”运算符的操作数也是一个左值。它把操作数转换为数字，然后减1，并将计算后的值重新赋值给操作数。和“++”运算符一样。

### 位运算符 ###

#### 按位与（&） ####

位运算符“&”对它的整型操作数逐位执行布尔与（AND）操作。只有两个操作数中相对应的位都是1，结果中的这一位才是1。 全1 为1；有0为0

#### 按位或（|） ####

位运算符“|”对它的整型操作数逐位执行布尔或（OR）操作。如果其中一个操作数相应的位为1，或者两个操作数相应位都是1，那么结果中的这一位就为1。有1为1；全0为0

#### 按位异或（^） ####

异或是指第一个操作数为true或第二个操作数为true，但两者不能同时为true。如果两个操作数中只有一个相应位为1（不能同时为1），那么结果中的这一位就是1。全1 全0 为0

#### 按位非（～） ####

位于一个整型参数之前，它将操作数的所有位取反。  
对一个值使用“～”运算符相当于改变它的符号并减1。

#### 左移（<<） ####

将第一个操作数的所有二进制位进行左移操作，移动的位数由第二个操作数指定

#### 带符号右移（>>） ####

将第一个操作数的所有位进行右移操作，移动的位数由第二个操作数指定

#### 无符号右移（>>>） ####

运算符“>>>”和运算符“>>”一样，只是左边的高位总是填补0，与原来的操作数符号无关

## 关系表达式 ##

### 相等和不等运算符 ###

“==”和“===”运算符用于比较两个值是否相等
    ===”也称为严格相等运算符（strict equality）（有时也称做恒等运算符（identity operator）），它用来检测两个操作数是否严格相等。
    “==”运算符称做相等运算符（equality operator），它用来检测两个操作数是否相等，这里“相等”的定义非常宽松，可以允许进行类型转换。

### 比较运算符 ###

小于（<）  
大于（>）  
小于等于(<=)  
大于等于(>=)

### in运算符 ###

如果右侧的对象拥有一个名为左操作数值的属性名，那么表达式返回true

var x = { x:1, y:1 };
    "x" in a //true
    "z" in a //false
    "toString" in a //true 对象继承了toString()方法
    
    var data = [7,8,9];
    "0" in data // true 数组包含元素"0"
    1 in data // ture 数字转换为字符串"1" 
    3 in data //false 没有索引为3的元素-

### instanceof运算符 ###

instanceof运算符希望左操作数是一个对象，右操作数标识对象的类。如果左侧的对象是右侧类的实例，则表达式返回true；否则返回false

## 逻辑表达式 ##

逻辑运算符“&&”、“||”和“!”是对操作数进行布尔算术运算，经常和关系运算符一起配合使用，逻辑运算符将多个关系表达式组合起来组成一个更复杂的表达式。

### 逻辑与（&&） ###

第一个操作数和第二个操作数都是true的时候，它才返回true

x == 0 && y == 0 
    //只有在x和y都是0的时候，才返回true

### 逻辑或（||） ###

“||”运算符对两个操作数做布尔或（OR）运算。如果其中一个或者两个操作数是真值，它返回一个真值。如果两个操作数都是假值，它返回一个假值。

### 逻辑非（!） ###

!”运算符是一元运算符。它放置在一个单独的操作数之前。它的目的是将操作数的布尔值进行求反。

## 赋值表达式 ##

JavaScript使用“=”运算符来给变量或者属性赋值

i=0
    o.x=1

赋值操作符的结合性是从右至左，也就是说，如果一个表达式中出现了多个赋值运算符，运算顺序是从右到左。

i=j=k=0

### 带操作的赋值运算 ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQwMzYzMg_size_16_color_FFFFFF_t_70 1]

## 其他运算符 ##

### 条件运算符（？：） ###

条件运算符是JavaScript中唯一的一个三元运算符（三个操作数），有时直接称做“三元运算符”。

x>0 ? x : -x

第一个操作数当成布尔值，如果它是真值，那么将计算第二个操作数，并返回其计算结果。否则，如果第一个操作数是假值，那么将计算第三个操作数，并返回其计算结果。

### typeof运算符 ###

typeof是一元运算符，放在其单个操作数的前面，操作数可以是任意类型。返回值为表示操作数类型的一个字符串。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQwMzYzMg_size_16_color_FFFFFF_t_70 2]

### delete运算符 ###

delete是一元操作符，它用来删除对象属性或者数组元素。就像赋值、递增、递减运算符一样，delete也是具有副作用的，它是用来做删除操作的，不是用来返回一个值的

var o = { x:1, y=2};
    delete o.x; //删除一个属性

### 逗号运算符（,） ###

逗号运算符是二元运算符，它的操作数可以是任意类型。它首先计算左操作数，然后计算右操作数，最后返回右操作数的值

i = 0, j = 1, k = 2;

参考资料：《JavaScript权威指南》

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQwMzYzMg_size_16_color_FFFFFF_t_70]: /images/20210813/4031b55260524ee1bce5873545793521.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQwMzYzMg_size_16_color_FFFFFF_t_70 1]: /images/20210813/bb80e1491f2b4adaaa3fc25c369b4bb1.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQwMzYzMg_size_16_color_FFFFFF_t_70 2]: /images/20210813/72d84c1ddd094216b87743855a397f89.png