JavaScript 运算符

简介: JavaScript 运算符

JavaScript 运算符

本章描述了 JavaScript 的表达式和运算符,包括了赋值,比较,算数,位运算,逻辑,字符串,三元等等。

运算符

JavaScript 拥有如下类型的运算符。本节描述了运算符和运算符的优先级。

  • 赋值运算符(Assignment operators)
  • 比较运算符(Comparison operators)
  • 算数运算符(Arithmetic operators)
  • 位运算符(Bitwise operators)
  • 逻辑运算符(Logical operators)
  • 字符串运算符(String operators)
  • 条件(三元)运算符(Conditional operator)
  • 逗号运算符(Comma operator)
  • 一元运算符(Unary operators)
  • 关系运算符(Relational operator)

JavaScript 拥有二元和一元运算符,和一个特殊的三元运算符(条件运算符)。一个二元运算符需要两个操作数,分别在运算符的前面和后面:

操作数 1 运算符 操作数 2

例如,3+4 或 x*y。

一个一元运算符需要一个操作数,在运算符前面或后面:

运算符 操作数

或者

操作数 运算符

例如,x++ 或 ++x。

赋值运算符

一个 赋值运算符 (assignment operator) (en-US) 将它右边操作数的值赋给它左边的操作数。最简单的赋值运算符是等于(=),它将右边的操作数值赋给左边的操作数。那么 x = y 就是将 y 的值赋给 x。

还有一些复合赋值操作符,它们是下表列出的这些操作的缩写:
| 名字 |简写的操作符 | 含义|
| ---- | ---- | ----|
|赋值 (Assignment) (en-US) |x = y |x = y|
|加法赋值 (Addition assignment) (en-US)| x += y |x = x + y|
|减法赋值 (Subtraction assignment) (en-US) |x -= y| x = x - y|
|乘法赋值 (Multiplication assignment) (en-US)| x = y |x = x y|
|除法赋值 (Division assignment) (en-US) |x /= y |x = x / y|
|求余赋值 (Remainder assignment) (en-US) |x %= y |x = x % y|
|求幂赋值 (Exponentiation assignment) (en-US) |x = y |x = x y|
|左移位赋值 (Left shift assignment) (en-US)| x <<= y| x = x << y|
|右移位赋值 (Right shift assignment) (en-US)| x >>= y |x = x >> y|
|无符号右移位赋值 (Unsigned right shift assignment) (en-US)| x >>>= y| x = x >>> y|
|按位与赋值 (Bitwise AND assignment) (en-US)| x &= y |x = x & y|
|按位异或赋值 (Bitwise XOR assignment) (en-US) |x ^= y |x = x ^ y|
|按位或赋值 (Bitwise OR assignment) (en-US) | x |= y | x = x | y|

解构

对于更复杂的赋值,解构赋值语法是一个能从数组或对象对应的数组结构或对象字面量里提取数据的 Javascript 表达式。

var foo = ["one", "two", "three"];

// 不使用解构
var one   = foo[0];
var two   = foo[1];
var three = foo[2];

// 使用解构
var [one, two, three] = foo;

Null 判断运算符

读取对象属性的时候,如果某个属性的值是 null 或 undefined,有时候需要为它们指定默认值。常见做法是通过 || 运算符指定默认值。

const text = data.text || 'Hello, world!'

上面的代码都通过 || 运算符指定默认值,但是这样写可能和预期的结果不一致。
开发者的原意是,只要属性的值为 null 或 undefined,默认值就会生效,但是属性的值如果为空字符串或 false 或 0,默认值也会生效。

为了避免这种情况,ES2020 引入了一个新的 Null 判断运算符??。它的行为类似 ||,但是只有运算符左侧的值为 null 或 undefined 时,才会返回右侧的值。

const text = data.text ?? 'Hello, world!'

上面代码中,默认值只有在属性值为 null 或 undefined 时,才会生效。
这个运算符的一个目的,就是跟链判断运算符 ?. 配合使用,为 null 或 undefined 的值设置默认值。

const animationDuration = settings?.animationDuration ?? 300

上面代码中,settings 如果是 null 或 undefined,就会返回默认值300。

字符串运算符

并没有专用的字符串运算符,只是有些运算符在遇到字符串运算数的时候,表现不同。

(I)“+”连接2个字符串;

1)当2个运算数都是字符串的时候,连接起来;

2)当其中有一个是数字的时候,将数字转换成字符串,连接起来;

(II)“>”这样的比较运算符通过比较确认两个字符串的顺序,比较采用字符的顺序,较小的位于教大的前面,大写字母位于小写字母之前。

(III)“+”的作用方法取决于计算顺序,

如:s = 1 + 2 +"var" 则:返回结果3var; 因为先计算1+2,然后将结果3转换成字符串与"var"连接;

如:s = "var" + 1 + 2 则:返回结果var12; 因为先计算var与1的连接,在将结果var1与转换成字符串的2连接起来。

赋值运算符

(I)“=”是赋值运算符;他总是期望左边的运算数是一个变量、数组的一个元素或对象的一个属性;

期望右边是一个任意类型的任意的值;

从右到左的结合性,如果一个表达式中有多个赋值运算符,则从最右边开始计算。

注意:每一个赋值表达式都有一个值,就是运算符右边的值;

(II)可以使用带操作的赋值运算

“+=” 左边的值加上右边的值后,赋值于左边的值。“-=”“/=”“*=”方法一样;

位操作符

现代计算机中数据都是以二进制的形式存储的,即0、1两种状态,计算机对二进制数据进行的运算加减乘除等都是叫位运算,即将符号位共同参与运算的运算。

JavaScript中所有的数字都是以IEEE 754 64位格式存储,但是位操作并不直接应用到64位,而是先将值转化为32位整数,再进行位操作。之后再把运算结果转化为64位,所以我们只需要考虑32位整数即可。位操作是在数值的底层完成的,所以运算速度会相对于其他运算符快很多。
常见的位运算有以下几种:

在这里插入图片描述
在说这些操作符之前,先来看几个相关的概念。计算机中的有符号数有三种表示方法,即原码、反码和补码。三种表示方法均有符号位和数值位两部分,符号位都是用0表示“正”,用1表示“负”,而数值位,三种表示方法各不相同。

(1)原码
原码就是一个数的二进制数。例如:10的原码为0000 1010
(2)反码

  • 正数的反码与原码相同,如:10 反码为 0000 1010
  • 负数的反码为除符号位,按位取反,即0变1,1变0。

例如,-10的反码如下:

原码:1000 1010
反码:1111 0101

(3)补码

  • 正数的补码与原码相同,如:10 补码为 0000 1010
  • 负数的补码是原码除符号位外的所有位取反即0变1,1变0,然后加1,也就是反码加1。

例如,-10的补码如下:

原码:1000 1010
反码:1111 0101
补码:1111 0110
相关文章
|
1月前
|
JavaScript 前端开发 开发者
混淆赋值运算符(=)和相等比较运算符(==, ===)(js的问题)
混淆赋值运算符(=)和相等比较运算符(==, ===)(js的问题)
15 0
|
1月前
|
JavaScript 前端开发 Java
JavaScript基础语法(运算符)
JavaScript基础语法(运算符)
38 0
|
1月前
|
存储 JavaScript 前端开发
【JavaScript技术专栏】JavaScript基础入门:变量、数据类型与运算符
【4月更文挑战第30天】本文介绍了JavaScript的基础知识,包括变量(var、let、const)、数据类型(Number、String、Boolean、Undefined、Null及Object、Array)和运算符(算术、赋值、比较、逻辑)。通过实例展示了如何声明变量、操作数据类型以及使用运算符执行数学和逻辑运算。了解这些基础知识对初学者至关重要,是进阶学习JavaScript的关键。
|
10天前
|
JavaScript 前端开发 开发者
JavaScript进阶-解构赋值与展开运算符
【6月更文挑战第19天】ES6的解构赋值与展开运算符增强了JS开发效率。解构允许直接从数组或对象提取值,简化数据提取,而展开运算符则用于合并数组和对象或作为函数参数。解构时注意设置默认值以处理不存在的属性,避免过度嵌套。展开运算符需区分数组与对象使用,勿混淆于剩余参数。通过示例展示了这两种操作在数组和对象中的应用,提升代码可读性与简洁度。
|
17天前
|
JavaScript 前端开发
JavaScript基础-运算符与条件语句
【6月更文挑战第11天】本文探讨了JavaScript中的运算符和条件语句,包括算术、比较、逻辑、赋值及三元运算符。强调了使用严格等于`===`避免类型转换错误,理解逻辑运算符短路特性和优化条件结构以提高代码可读性。通过示例展示了正确使用这些概念,以提升代码质量和维护性。
|
7天前
|
JavaScript 前端开发
JS常见的运算符有哪些?
JS常见的运算符有哪些?
7 0
|
1月前
|
JavaScript 前端开发
JS中运算符的算术、赋值、+、比较(不同类型之间比较)、逻辑
JS中运算符的算术、赋值、+、比较(不同类型之间比较)、逻辑
19 1
|
1月前
|
JavaScript 前端开发
js的运算符
js的运算符
29 2
|
1月前
|
JavaScript
js的一些运算符规则
js的一些运算符规则
17 1
|
1月前
|
JavaScript
js的比较运算符
js的比较运算符
20 1