运算符优先级

下面的表将所有运算符按照优先级的不同从高（20）到低（1）排列。

优先级	运算类型	关联性	运算符
20	圆括号	n/a（不相关）	( … )
19	成员访问	从左到右	… . …
	需计算的成员访问	从左到右	… [ … ]
	new (带参数列表)	n/a	new … ( … )
	函数调用	从左到右	… ( … )
	可选链（Optional chaining）	从左到右	?.
18	new (无参数列表)	从右到左	new …
17	后置递增(运算符在后)	n/a	… ++
	后置递减(运算符在后)		… --
16	逻辑非	从右到左	! …
	按位非		~ …
	一元加法		+ …
	一元减法		- …
	前置递增		++ …
	前置递减		-- …
	typeof		typeof …
	void		void …
	delete		delete …
	await		await …
15	幂	从右到左	… ** …
14	乘法	从左到右	… * …
	除法		… / …
	取模		… % …
13	加法	从左到右	… + …
	减法		… - …
12	按位左移	从左到右	… << …
	按位右移		… >> …
	无符号右移		… >>> …
11	小于	从左到右	… < …
	小于等于		… <= …
	大于		… > …
	大于等于		… >= …
	in		… in …
	instanceof		… instanceof …
10	等号	从左到右	… == …
	非等号		… != …
	全等号		… === …
	非全等号		… !== …
9	按位与	从左到右	… & …
8	按位异或	从左到右	… ^ …
7	按位或	从左到右	… | …
6	逻辑与	从左到右	… && …
5	逻辑或	从左到右	… || …
4	条件运算符	从右到左	… ? … : …
3	赋值	从右到左	… = …
			… += …
			… -= …
			… *= …
			… /= …
			… %= …
			… <<= …
			… >>= …
			… >>>= …
			… &= …
			… ^= …
			… |= …
2	yield	从右到左	yield …
	yield*		yield* …
1	展开运算符	n/a	... …
0	逗号	从左到右	… , …

从左到右、从右到左

从左到右：需要从左到右一次计算，比如逗号，与或，等于、不等于；

从右到左：左右是两个独立的块儿，比如所有的赋值运算符，幂运算符 ，new typeof await关键词，三目运算符是三个独立的块儿，和if else性质一致。

三元操作符 ：

function example(…) {
    return condition1 ? value1
         : condition2 ? value2
         : condition3 ? value3
         : value4;
}

// Equivalent to:

function example(…) {
    if (condition1) { return value1; }
    else if (condition2) { return value2; }
    else if (condition3) { return value3; }
    else { return value4; }
}

六部分：

1、括号  

()          ==> . [] new Func()

2、自增自减

i++ i--     ==>   ++i --i +i -i !  typeof await

 3、幂运算 

加减、乘除、幂运算

**          ==>  *  / %   + -

4、大于小于

> < >= <=   ==>  == !=  ===  !==

5、与或三目

&&  ||  ? :

 6、赋值

赋值= ... ,

简化版

运算类型	运算符
圆括号	()
属性访问、计算属性访问、函数调用、new操作符	… . …、… [ … ]、… ( … )、new … ( … )
后置递增、后置递减	… ++、… --
逻辑非、一元加减、前置递增递减、typeof、wait	! …、+ …、- …、++ …、-- …、typeof …、await …
幂运算|乘除取余|加减	… \** …              |              … \* …、… / …、… % …               |           … + …、… - …
大于、小于、大于等于、小于等于、in、instanceof	… > …、… < …、… >= …、… <= …、… in …、… instanceof …
等于、不等于、全等于、非全等于	… == …、… != …、… === …、… !== …
逻辑与|逻辑或|三目运算符	&& || … ? … : …
赋值	=、+=、-=、*=、/=、%=
展开运算符	...
逗号运算符	,

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

执行顺序，执行条件的判断，根据true或false，执行对应的表达式

 

实例

（1）

return typeof obj === "object" || typeof obj === "function" ?
			class2type[toString.call(obj)] || "object" :
			typeof obj;

（2）逗号运算符：

数组中

var num = 1;
var arr = [num, num +2, num +4];

函数默认参数中：

function sum(a =1, b = 2*a){
}

函数参数中：

fToBind.apply(
                   fNOP.prototype.isPrototypeOf(this) ? this : otherThis, baseArgs
            )

（3）查看数组每项的个数

        var obj = {};
        var arr = ['a','b','a','c'];
        var sum = arr.reduce((acc, cur, index) => {
            // if(acc.indexOf(cur) != -1){
            //     obj[cur]++;
            // }else {
            //     obj[cur] =  1;
            //     acc.push(cur);
            // }
            acc.indexOf(cur) != -1 ? obj[cur]++ : (obj[cur] =  1 , acc.push(cur))
            // acc.indexOf(cur) != -1 ? obj[cur]++ : (obj[cur] =  1) && acc.push(cur)
            return acc;
        }, [])
        console.log(sum); // ["a", "b", "c"]
        console.log(obj)  //{a: 2, b: 1, c: 1}