js基础之运算符，if语句

最新推荐文章于 2025-06-10 16:33:50 发布

原创最新推荐文章于 2025-06-10 16:33:50 发布 · 480 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#笔记

js笔记专栏收录该内容

28 篇文章

订阅专栏

本文详细介绍了编程中的基本运算符（算术、自增自减、关系、逻辑、短路和赋值），以及if语句的单分支、双分支、多分支和嵌套结构，以及如何通过实例应用到输出成绩和星期的场景中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、运算符

1、算术运算符

算术运算符有：算术运算符 + - * / ++ -- %

% 取模运算符

 console.log(1 + 2)
      console.log('1' + 2) // 字符串参与的加其实是拼接 '1'  + '2'   -> '12'
      console.log(+8)
      console.log('12' - 2) // 12 - 2 -> 10
      console.log(20 * 2)
      console.log(4 / 3)
      console.log(4 / 2)

% 取模运算符

 console.log(4 % 2) // 0
      console.log(4 % 3) // 1

2、自增自减运算符

递增运算符：

递增：给一个数加一操作 num

前置递增： ++num ，先自增再进行运算用自增后的值进行运算

后置递增： num++ ，先运算再进行自增先用原来的值进行运算

递减运算符：

递减：给一个数减一操作 num

前置递减： ++num ，先自减再进行运算用自减后的值进行运算

后置递减： num++ ，先运算再进行自减先用原来的值进行运算

    let x = 5
      //let y = x++ // x++整体赋值给y，用的是x原有的值
      let y = ++x // ++x整体赋值给y，用的是x加1后的值
      // x++ // 让x在原有基础上加1
      // ++x // 让x在原有基础上加1
      console.log(x) // 6
      console.log(y) // 6

  let i = 3,
        j = 4,
        k
      ++i
      j++
      k = j++
      console.log(i, j, k) // 4 6 5

3、关系运算符

关系运算符有： >， < ，>=， <= ， ==， ===， != ， !==

console.log(3 > 2) // true
      console.log(10 <= 10) // true
      // == 不严格等于，只要内容相同即可
      console.log(5 == 5) // true
      console.log(5 == '5') // true
      // === 严格等于，内容与类型都需要一样

比较运算符：== === 用比较运算符做判断时，返回的值是true或false

= 是赋值

== 相等首先先把两个的数据类型转换为同一种数据类型，在进行值的对比，如果值不相等就返回false，否则返回true

=== 完全想等不会进行数据类型的转换，只有数据类型和值全部相等才会返回true

true只有在不加引号的时候才会转换为1

    console.log(5 === 5) // true
      console.log(5 === '5') // false
      console.log(null == null) // true
      console.log(NaN == NaN) // false
      console.log(undefined == undefined) // true
      console.log(null === null) // true
      console.log(NaN === NaN) // false
      console.log(undefined === undefined)
      console.log(null == undefined) // true
      console.log(null === undefined) // false

  console.log(5 != '5') // false 对==的否定
      console.log(5 !== '5') // true 对===的否定

null与undefined的区别？

1、含义：null代表一个空值，以后会指向一个引用类型
undefined表示没有值，默认是undefined
2、用Number转换把null转换成0，把undefined转换成NaN
3、null==undefined // true
null === undefined // false

3、逻辑运算符

逻辑运算符：主要是布尔值之间的运算，返回结果是布尔值

                      &&逻辑与    || 逻辑或        ! 逻辑非

                      逻辑与：全部为真才为真，否则为假

                      逻辑或：全为假才为假，否则是真

                      逻辑非：主要针对布尔值的取反操作

&&逻辑与：表达式1&&表达式2

判断表达式1的值，转布尔类型假如为true，直接返回表达式2的值

表达式1的值转布尔类型假如为false,直接返回表达式1的值

  console.log(5 > 3 && 10 < 5) // true&&false  false
      console.log(5 > 3 && 10 > 5) //  true&&true true
      console.log(5 == 3 && 10 < 5) // false&& false false
      console.log(5 && 6) // 6
      console.log(10 > 8 && 0) // 0
      console.log('' && 100) //''

逻辑或 || 判断表达式1的值，转布尔类型假如为true，直接返回表达式1的值

 console.log(5 > 3 || 10 < 5) //
      console.log(5 > 3 || 10 > 5) //
      console.log(5 == 3 || 10 < 5) //
      console.log(5 || 6) // 5
      console.log(10 > 8 || 0) // true
      console.log('' || 100) // 100

4、短路运算符

短路运算符：逻辑与 && 逻辑或 ||

逻辑与 &&: 如果遇到表达式为假时直接返回假，如果表达式中都为真则返回最后一个为真的表达式

逻辑或||：如果第一个表达式的值为真，则返回表达式1；如果第一个表达式的值为假，则返回表达式2

逻辑与短路现象

表达式1的值转布尔类型假如为false,直接返回表达式1的值,此时不会执行表达式2的值

      let i = 3
      console.log(null && ++i)
      console.log(i) //3

逻辑或短路现象

表达式1的值转布尔类型假如为false,直接返回表达式2的值,

let j = 3
      console.log(null || ++j)
      console.log(j) //4

5、赋值运算符

6、三目运算符

三元表达式：表达式1 ? 表达式2 : 表达式3

如果表达式1成立，就返回表达式2，如果不成立就返回表达式3

 //  求两个数最大值
      let num1 = 10,
        num2 = 20
      num3 = 32
      // console.log(num1 > num2 ? num1 : num2)
      let max = num1 > num2 ? num1 : num2
      max = max > num3 ? max : num3
      console.log(`max=${max}`)

二、if语句

1.if单分支语句

if 语句

// 条件成立执行代码，否则什么也不做

if (条件表达式) {

// 条件成立执行的代码语句

}

 if (1 !== 1) {
       console.log('1等于1')
       console.log('end')
      }

2.if双分支语句

if else语句（双分支语句）

// 适合于检查多重条件。

if (条件表达式1) {

语句1；

} else {

// 上述条件都不成立执行此处代码

}

 const score = +prompt('请输入你的成绩')
      if (score >= 90) {
        alert('一朵小红花奖励')
      } else {
        alert('继续加油')
      }

3.if多分支语句

if else语句（多分支语句）

// 适合于检查多重条件。

if (条件表达式1) {

              语句1；

} else if (条件表达式2) {

             语句2；

} else if (条件表达式3) {

             语句3；

....

} else {

         // 上述条件都不成立执行此处代码

}

 >=90  80~90 B 60~80 C <60  D
      const score = +prompt('请输入你的成绩')
      if (score >= 90) {
        alert('您的等级为A!!!')
      } else if (score >= 80) {
        alert('您的等级为B!!!')
      } else if (score >= 60) {
        alert('您的等级为C!!!')
      } else {
        alert('准备补考😭')
      }

4.if嵌套if

  const score = +prompt('请输入你的成绩')
      if (score >= 90) {
        alert('非常棒!!!')
        if (score >= 95) {
          alert('等级为A+')
        } else {
          alert('等级为A')
        }
      } else if (score >= 80) {
        alert('您的等级为B!!!')
      } else if (score >= 60) {
        alert('您的等级为C!!!')
      } else {
        alert('准备补考😭')
      }

案例

输出成绩

接收用户输入的分数，根据分数输出对应的等级字母A、B、C、D、E，。

90分(含)以上，输出︰A

80分(含)~ 90分(不含)，输出︰B

70分(含)~80分(不含)，输出:C

60分(含)~70分(不含)，输出:D

60分(不含)以下，输出E

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
 
  <script>
    let score = prompt('请输入你的分数')
    if(score>=90){
        console.log('A')
    }else if(score>=80){
        console.log('B')
    }else if(score >=70){
        console.log('C')
    }else if(score>=60){
        console.log('D')
    }else{
        console.log('E')
    }
  </script>
</body>
</html>

输出星期

题目描述:
请用户输入1个星期数.就将对应的英文的星期打印出来.

o比如用户输入'星期一'，则页面可以打印monday

o英文自己查有道。比如星期一是monday星期二是tuesday

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
 
  <script>
    let number=+prompt('请输入1~7之间数字')
    if(number===1){
        console.log('monday')
    }else if(number===2){
        console.log('tuesday')
    }else if(number===3){
        console.log('wednesday')
    }else if(number===4){
        console.log('thursday')
    }else if(number===5){
        console.log('friday')
    }else if(number===6){
        console.log('saturday')
    }else{
        console.log('sunday')
    }



  </script>
</body>
</html>