了解 JavaScript 运算符：带有示例的完整指南

### JavaScript 中的运算符

JavaScript 中的运算符是用于对值和变量执行运算的特殊符号。这些操作可以涉及算术、赋值、比较、逻辑和其他操作。了解运算符对于执行基本计算、比较和控制代码流程至关重要。

JavaScript 支持多种运算符，它们分为以下类型：

---

### 1. **算术运算符**
算术运算符用于对数字进行数学计算。

Operator	Description	Example
	Addition	5 3 → 8
-	Subtraction	5 - 3 → 2
*	Multiplication	5 * 3 → 15
/	Division	5 / 3 → 1.666...
%	Modulus (Remainder)	5 % 3 → 2
**	Exponentiation	5 ** 2 → 25

例子：

let a = 10;
let b = 2;
console.log(a + b);  // Output: 12
console.log(a - b);  // Output: 8
console.log(a * b);  // Output: 20
console.log(a / b);  // Output: 5
console.log(a % b);  // Output: 0
console.log(a ** b); // Output: 100

---

**

2. 赋值运算符**

赋值运算符用于为变量赋值。

Operator	Description	Example
=	Assign value	x = 5
=	Add and assign	x = 3 → x = x 3
-=	Subtract and assign	x -= 2 → x = x - 2
*=	Multiply and assign	x *= 4 → x = x * 4
/=	Divide and assign	x /= 2 → x = x / 2
%=	Modulus and assign	x %= 3 → x = x % 3
**=	Exponentiation and assign	x **= 2 → x = x ** 2

例子：

let a = 10;
let b = 2;
console.log(a + b);  // Output: 12
console.log(a - b);  // Output: 8
console.log(a * b);  // Output: 20
console.log(a / b);  // Output: 5
console.log(a % b);  // Output: 0
console.log(a ** b); // Output: 100

---

### 3. **比较运算符**
比较运算符用于比较值并根据条件返回布尔值（true 或 false）。

Operator	Description	Example
==	Equal to (loose)	5 == '5' → true
===	Equal to (strict)	5 === '5' → false
!=	Not equal to (loose)	5 != '5' → false
!==	Not equal to (strict)	5 !== '5' → true
>	Greater than	5 > 3 → true
<	Less than	5 < 3 → false
>=	Greater than or equal	5 >= 5 → true
<=	Less than or equal	5 <= 3 → false

例子：

let x = 10;
x += 5;  // x = x + 5 -> 15
x *= 2;  // x = x * 2 -> 30
console.log(x);  // Output: 30



<hr>

<p><strong>### 4. **逻辑运算符</strong>**<br>
逻辑运算符用于执行逻辑运算，返回布尔值。</p>

<div><table>
<thead>
<tr>
<th>Operator</th>
<th>Description</th>
<th>Example</th>
</tr>
</thead>
<tbody>
<tr>
<td>&&</td>
<td>Logical AND</td>
<td>
true && false → false
</td>
</tr>
<tr>
<td>`</td>
<td></td>
<td>`</td>
</tr>
<tr>
<td>!</td>
<td>Logical NOT</td>
<td>
!true → false
</td>
</tr>
</tbody>
</table></div>

<p><strong>#### 示例：</strong><br>
</p>

<pre class="brush:php;toolbar:false">console.log(5 == '5');  // Output: true (loose comparison)
console.log(5 === '5'); // Output: false (strict comparison)
console.log(10 > 5);    // Output: true
console.log(3 <= 2);    // Output: false

---

### 5. **一元运算符**
一元运算符对单个操作数进行运算以执行特定操作。

Operator	Description	Example
	Increment	x → x = x 1
--	Decrement	x-- → x = x - 1
typeof	Type of operand	typeof x → number
void	Evaluates expression without returning a value	void(0)

#### 示例：

let a = true;
let b = false;
console.log(a && b);  // Output: false
console.log(a || b);  // Output: true
console.log(!a);      // Output: false

---

### 6. **三元（条件）运算符
**三元运算符是 if...else 语句的简写。它评估一个条件并根据条件是真还是假返回两个值之一。

Operator	Description	Example
condition ? expr1 : expr2	If condition is true, return expr1; otherwise, return expr2	x > 10 ? 'Greater' : 'Lesser'

*#### 示例：
*

let a = 10;
let b = 2;
console.log(a + b);  // Output: 12
console.log(a - b);  // Output: 8
console.log(a * b);  // Output: 20
console.log(a / b);  // Output: 5
console.log(a % b);  // Output: 0
console.log(a ** b); // Output: 100

---

### 7. **位运算符
**按位运算符对二进制数进行运算。

Operator	Description	Example
&	AND	5 & 3 → 1
`	`	OR
^	XOR	5 ^ 3 → 6
~	NOT	~5 → -6
<<	Left shift	5 << 1 → 10
>>	Right shift	5 >> 1 → 2
>>>	Unsigned right shift	5 >>> 1 → 2

*#### 示例：
*

let x = 10;
x += 5;  // x = x + 5 -> 15
x *= 2;  // x = x * 2 -> 30
console.log(x);  // Output: 30

---

### 8. **扩展运算符 (...)
**扩展运算符允许您将数组或对象中的元素解压到新的数组或对象中。

*#### 示例：
*

console.log(5 == '5');  // Output: true (loose comparison)
console.log(5 === '5'); // Output: false (strict comparison)
console.log(10 > 5);    // Output: true
console.log(3 <= 2);    // Output: false

---

### 结论

JavaScript 运算符是执行计算、比较和逻辑运算的基础。无论您是操作值、比较它们还是控制程序流程，理解这些运算符对于高效编码都至关重要。根据您的任务使用正确的运算符，以确保代码干净且可读。

嗨，我是 Abhay Singh Kathayat！
我是一名全栈开发人员，拥有前端和后端技术方面的专业知识。我使用各种编程语言和框架来构建高效、可扩展且用户友好的应用程序。
请随时通过我的商务电子邮件与我联系：kaashshorts28@gmail.com。

以上是了解 JavaScript 运算符：带有示例的完整指南的详细内容。更多信息请关注PHP中文网其他相关文章！