js运算符和表达式（一元运算符，赋值运算符，关系运算符（比较运算符），逻辑运算符，三目运算符）

⊱sun⊰

于 2023-08-28 21:23:01 发布

阅读量141

点赞数

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/sun12345678_/article/details/132547619

版权

一、JavaScript运算符和表达式

1.1、基本概念

JavaScript描述了一组用于操作数据值的运算符，包括一元运算符(++ --)、逻辑运算符、算术运算符、关系运算符、三目运算符及赋值运算符。ECMAScript 中的运算符适用于很多值，包括字符串、数值、布尔值、对象等。

表达式：

表达式由一个或多个操作数通过操作符组合而成，就是由数据和运算符组成的一个式子。
例如：x+y；x/10; x+23/2+y; x%y等都是表达式。

操作符：

表达式中的变量成为操作数；

运算符：

表达式中起运算作用的符号称为运算符；

1.2、算数运算符

算术运算符即算术运算符号。是完成基本的算术运算 (arithmetic operators) 符号，就是用来处理四则运算的符号。

算数运算符分为以下几种:
在这里插入图片描述

加法运算符（+）:

var box = 1 + 2; //等于3
var box = 1 + NaN; //NaN，只要有一个NaN 就为NaN
var box = Infinity + Infinity; //Infinity
var box = -Infinity + -Infinity; //-Infinity
var box = Infinity + -Infinity; //NaN，正无穷和负无穷相加等NaN
var box = 100 + '100';//100100，字符串连接符，有字符串就不是加法
var box = '您的年龄是：' + 10 + 20; //您的年龄是：1020，被转换成字符串
var box = 10 + 20 + '是您的年龄'; //30 是您的年龄，没有被转成字符串
var box = '您的年龄是：' + (10 + 20); //您的年龄是：30，没有被转成字符串

其中NaN是not a number的缩写，表示不是一个数；infinity是无穷大的数。任意数据类型的数值和字符串做 “+”运算，得到的肯定是字符串。

减法运算符:

var box = 100 - 70; //等于30
var box = -100 - 70 ;//等于-170
var box = -100 - -70; //-30，一般写成-100 - (-70)比较清晰
var box = 1 - NaN; //NaN，只要有一个NaN 就为NaN
var box = Infinity - Infinity; //NaN
var box = -Infinity - -Infinity;//NaN
var box = 100 - true; //99，true 转成数值为1
var box = 100 -false; //100，false转成数值为0
var box = 100 - ''; //100，''转成了0
var box = 100 - '70'; //30，'70'转成了数值70
var box = 100 - null; //100，null 转成了0
var box = 100 - 'Lee'; //NaN，Lee 转成了NaN

乘法运算符:

var box = 100 * 70; //7000
var box = 100 * NaN; //NaN，只要有一个NaN 即为NaN
var box = Infinity * Infinity; //Infinity
var box = -Infinity * Infinity ; //-Infinity
var box = -Infinity * -Infinity ; //Infinity
var box = 100 * true; //100，true 转成数值为1
var box = 100 * ''; //0，''转成了0
var box = 100 * null; //0，null 转成了0
var box = 100 * 'Lee'; //NaN，Lee 转成了NaN

除法运算符:

var box = 100 / 70; //1.42....
var box = 100 / NaN; //NaN
var box = Infinity / Infinity; //NaN
var box = -Infinity / Infinity ; //NaN
var box = -Infinity / -Infinity; //NaN
var box = 100 / true; //100，true 转成1
var box = 100 / ''; //Infinity，
var box = 100 / null; //Infinity，
var box = 100 / 'Lee'; //NaN

求模运算符（求余数）:

var box = 10 % 3; //1，余数为1
var box = 100 % NaN; //NaN
var box = Infinity % Infinity; //NaN
var box = -Infinity % Infinity ; //NaN
var box = -Infinity % -Infinity; //NaN
var box = 100 % true; //0
var box = 100 % ''; //NaN
var box = 100 % null; //NaN
var box = 100 % 'Lee'; //NaN

JS里面的算数运算规则：

任意数据类型和字符串进行加法运算,都是字符串的拼接
任意数据类型和NaN进行四则运算,结果都是NaN
当true和false参与运算,true转换为1,false转换为0
除+运算外,数值类型字符串参与运算,都转换为数值;
但是非数值类型字符参与运算,结果都是NaN
除+运算外,空字符串转换为0,null转换为0
0可以作为除数,得到结果都是无穷大
0参与取余运算,得到结果都是NaN

1.3、一元运算符

递增和递减运算符概述：

如果需要反复给数字变量添加或减去1，可以使用递增（++）和递减（ – ）运算符来完成。
在 JavaScript 中，递增（++）和递减（ – ）既可以放在变量前面，也可以放在变量后面。放在变量前面时，我们可以称为前置递增（递减）运算符，放在变量后面时，我们可以称为后置递增（递减）运算符。
递增和递减运算符必须和变量配合使用。

递增运算符：

前置递增运算符 ++num 前置递增，就是自加1，类似于 num = num + 1，但是 ++num 写起来更简单。
num++ 后置递增，就是自加1，类似于 num = num + 1，但是 num++ 写起来更简单。
使用口诀：++在前，整体是一个新值，++在后，整体是一人旧值

示例代码：

前置++

var num1 = 5;
++ num1; // num1 = 6;
var num2 = 6;
console.log(num1 + ++ num2); // 13

后置++

var num1 = 5;
num1 ++; // num1 = 6
var num2 = 6
console.log(num1 + num2 ++); // 12

进阶版（结合前置与后置的区别来理解为什么结果不同）

var a = 1; var b = ++a + ++a; console.log(b);//5
var a = 1; var b = a++ + ++a; console.log(b);//4
var a = 1; var b = a++ + a++; console.log(b);//3
var a = 1; var b = ++a + a++; console.log(b);//4

前置和后置的区别

在没有赋值操作，前置和后置是一样的。但在赋值操作时，如果递增或递减运算符前置，那么前置的运算符会先累加或累减再赋值，如果是后置运算符则先赋值再累加或累减。运算的时候也是一样

其他类型应用一元运算符的规则：

var box = '89'; box++; //90，数值字符串自动转换成数值
var box = 'ab'; box++; //NaN，字符串包含非数值转成NaN
var box = false; box++; //1，false 转成数值是0，累加就是1
var box = 2.3; box++; //3.3，直接加1

注：如果数值字符串使用一元运算符，即使是加法运算,也直接转换为数值。

1.4、赋值运算符

用来把数据赋值给变量的运算符。前面我们使用的 = 其实也是一个运算符，被称之为赋值（ assignments ）运算符。

在这里插入图片描述

在JavaScript中，赋值运算符是“=”，其含义就是把赋值运算符的右边的数值或表达式的值赋给赋值运算符的左边的变量或表达式。

例如：

var t=5; // 其意义就是把数值5赋给变量t;
var k=x+y+5; // 其意义就是把表达式x+y+5最后的值赋给变量k。
var box = 100；
box += 100; // 200，+=代替box+100

1.5、关系运算符（比较运算符）

比较运算符（关系运算符）是两个数据进行比较时所使用的运算符，比较运算后，会返回一个布尔值（true / false）作为比较运算的结果。

在这里插入图片描述

比较原则:

若一个是数值字符串，一个是数值，字符串会自动转换成数值进行比较。
若两个都是数值字符串，则比较首个数字的大小。
布尔值的false和true会转换成0和1。
两个操作数都是数值，则数值比较。
两个操作数都是字符串，则比较两个字符串对应的字符编码值。

在相等和不等的比较上，如果操作数是非数值，则遵循以下规则：

一个操作数是布尔值，则比较之前将其转换为数值，false 转成0，true 转成1；
一个操作数是字符串，则比较之前将其转成为数值再比较；
不需要任何转换的情况下，null 和undefined 是相等的；
一个操作数是NaN，则==返回false，!=返回true；并且NaN 和自身不等；
在全等和全不等的判断上，比如值和类型都相等，才返回true，否则返回false。

特殊值对比表:

表达式                        值
null == undefined           true
'NaN' == NaN                false
5 == NaN                    false
NaN == NaN                  false
false == 0                  true
true == 1                   true
true == 2                   false
undefined == 0              false
null == 0                   false
'100' == 100                true
'100' === 100               false

相等运算符 == ：判断两个操作数是否相等。不同的数据类型会自动转换为相等的数据类型再做比较。

等同运算符=== ：全等（值和类型），严格意义的相等，两个操作数的值和他们的类型必须完全一致。

var result = '55' == 55; // true
var result = '55' === 55; // false 值相等，类型不相等
var result = 55 === 55; // true

1.6、逻辑运算符

逻辑运算符通常用于布尔值的操作，一般和关系运算符配合使用，有三个逻辑运算符：

逻辑与(AND)、逻辑或(OR)、逻辑非(NOT)。

在这里插入图片描述

逻辑与运算符属于短路操作，顾名思义，如果第一个操作数返回是false，第二个数不管是true 还是 false 都返回的false。
和逻辑与运算符相似，逻辑或运算符也是短路操作。当第一操作数的求值结果为true，就不会对第二个操作数求值了。
逻辑非运算符可以用于任何值。无论这个值是什么数据类型，这个运算符都会返回一个布尔值。它的流程是：先将这个值转换成布尔值，然后取反。

注：JavaScript虽说也有& 和 |，但是这里不是做逻辑运算符，而是位运算符

1.7、三目运算符

三目运算符，又叫三元条件运算符

三元条件运算符其实就是后面将要学到的if 语句的简写形式。

根据条件在两个语句中执行其中的一个，使用符号？：

语法如下：条件表达式？语句1：语句2

参数说明：

条件表达式，结果会被作为布尔值处理
语句1：如果条件表达式返回true则执行
语句2：如果条件表达式返回false则执行

var box = 5 > 4 ? '对' : '错'; //对，5>4 返回true 则把'对'赋值给box，反之，把错赋给box。
// 判断一个年龄是否成年, 当年龄超过18 返回 成年 否则返回未成年
var age = 19;
// console.log( age >= 18 ? '成年' : '未成年' );
var msg = age >= 18 ? '成年' : '未成年';
console.log(msg);