WEBSTORM前端 —— 第4章：JavaScript —— 第4节：运算符

航Hang*

914人浏览 · 2025-08-14 14:38:46

航Hang* · 2025-08-14 14:38:46 发布

1.1赋值运算符

赋值运算符：对变量进行赋值的运算符

已经学过的赋值运算符：=将等号右边的值赋予给左边,要求左边必须是一个容器

其他赋值运算符：

使用这些运算符可以在对变量赋值时进行快速操作

我们以+=赋值运算符来举例

1.以前我们让一个变量加1如何做的？

2.现在我们有一个简单的写法啦~~~

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>

    let num = 1
    // num = num + 1
    // 采取赋值运算符
    // num += 1
    num += 3
    console.log(num)
  </script>
</body>

</html>

1.2一元运算符

众多的JavaScript的运算符可以根据所需表达式的个数，分为一元运算符、二元运算符、三元运算符

二元运算符：

一元运算符：

例：正负号

问题：我们以前让一个变量每次+1，以前我们做的呢？

我们可以有更简便的写法了~~~

自增：

符号：++
作用：让变量的值+1

自减：

符号：--
作用：让变量的值-1
使用场景：经常用于计数来使用。比如进行10次操作，用它来计算进行了多少次了

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

自增运算符的用法：

前置自增： 先自加再使用（记忆口诀：++在前先加）

每执行1次，当前变量数值加1
其作用相当于num+=1

后置自增： 先使用再自加（记忆口诀：++在后后加）

每执行1次，当前变量数值加1
其作用相当于num+=1

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // let num = 10
    // num = num + 1
    // num += 1
    // // 1. 前置自增
    // let i = 1
    // ++i
    // console.log(i)

    // let i = 1
    // console.log(++i + 1)
    // 2. 后置自增
    // let i = 1
    // i++
    // console.log(i)
    // let i = 1
    // console.log(i++ + 1)

    // 了解 
    let i = 1
    console.log(i++ + ++i + i)
  </script>
</body>

</html>

1.3比较运算符

比较运算符的介绍

使用场景：比较两个数据大小、是否相等
实际运用例：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>

    console.log(3 > 5)
    console.log(3 >= 3)
    console.log(2 == 2)
    // 比较运算符有隐式转换 把'2' 转换为 2  双等号 只判断值
    console.log(2 == '2')  // true
    // console.log(undefined === null)
    // === 全等 判断 值 和 数据类型都一样才行
    // 以后判断是否相等 请用 ===  
    console.log(2 === '2')
    console.log(NaN === NaN) // NaN 不等于任何人，包括他自己
    console.log(2 !== '2')  // true  
    console.log(2 != '2') // false 
    console.log('-------------------------')
    console.log('a' < 'b') // true
    console.log('aa' < 'ab') // true
    console.log('aa' < 'aac') // true
    console.log('-------------------------')
  </script>
</body>

</html>

1.4 逻辑运算符

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 逻辑与 一假则假
    console.log(true && true)
    console.log(false && true)
    console.log(3 < 5 && 3 > 2)
    console.log(3 < 5 && 3 < 2)
    console.log('-----------------')
    // 逻辑或 一真则真
    console.log(true || true)
    console.log(false || true)
    console.log(false || false)
    console.log('-----------------')
    // 逻辑非  取反
    console.log(!true)
    console.log(!false)

    console.log('-----------------')

    let num = 6
    console.log(num > 5 && num < 10)
    console.log('-----------------')
  </script>
</body>

</html>

1.5练习1

判断一个数是4的倍数，且不是100的倍数

需求：用户输入一个，判断这个数能被4整除，但是不能被100整除,满足条件，页面弹出true，否则弹出 false

分析：

①：用户输入

②：判断条件，看余数是不是0，如果是0就是能被整除，余数不是0，则不能被整除

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 1. 用户输入
    let num = +prompt('请输入一个数字:')
    // 2. 弹出结果
    alert(num % 4 === 0 && num % 100 !== 0)
  </script>
</body>

</html>

1.6运算符优先级

一元运算符里面的逻辑非优先级很高
逻辑与比逻辑或优先级高

1.7练习2

AI Agent技术社区

Agent 垂直技术社区，欢迎活跃、内容共建。

更多推荐

UX、DX、AX：设计对象的三次扩张，你的产品到底为谁设计？

AI Agent技术社区

AI Agent 面试题 583：多Agent系统中的任务分配公平性保证

任务分配与调度是 AI Agent 技术体系中的重要组成部分。简单来说，它涉及到 Agent 如何在多智能体系统层面实现智能化的行为和决策。在实际应用中，任务分配与调度的核心目标是让 Agent 能够更加高效、准确地完成特定任务。这需要我们深入理解其底层原理和实现机制。从学术角度来看，任务分配与调度的研究可以追溯到人工智能的早期阶段。早在 1950 年代，Alan Turing 就提出了