IF、SWTICH判断、赋值&&取模等问题(基础)

本文详细介绍了JavaScript中的条件判断结构,包括if、if...else、if...elseif...else以及switch语句的用法。还讲解了赋值、自增自减运算符以及取模、比较运算符的概念和应用。此外,提到了null的使用以及布尔值在条件判断中的作用。
摘要由CSDN通过智能技术生成

 语法大全:

    1:if (条件) {

           条件为真做的事情 

        }

    2:if (条件) {

           条件为真做的事情

        } else {

          条件为假做的事情

        }

    3:if (条件1) {

           条件1为真做的事情

        }else if (条件2) {

              条件1为假,条件2是真做的事情

        }

    ... 

    else {所有条件都是假做的事情}

    4:switch (值1) { 

      case 值2: 值1===值2时做的事情;

break;

      case 值3: 值1===值3时做的事情;

break;

      case 值4: 值1===值4时做的事情;

break;

      default: 前面所有的case都不等于值1做的事情.

    }

 1.0 赋值的本质就是复制

<script>

    // 把x变成10,把10放入x中.
    let x = 10;
    // 把x的值复制一份,再放入y中
    let y = x;
    // 有的值改变,x的值是不会改变的.
    y = 100;

    console.log('x', x);// 10
    console.log('y', y);// 100

    // let和var的区别.
    // js数据类型.

  </script>

 1.1 取模

   取模 2%3 == 2 4%2 == 0

    ++m => 返回+1后的值

    m++ => 返回+1前的值

<script>

    // 算术运算符,比较运算符,布尔值,判断,隐式转换

    // %,++,--

    // % => 取余,取模

    let x = 3 / 2;
    console.log(x);

    // 取余. 3 % 2 商1余1
    let y = 3 % 2;
    console.log(y);

    // 2 % 3 得 2 商0余2
    let z = 2 % 3;
    console.log(z);

    // 余0 能整除,余数就是0
    let z = 0 % 3;
    console.log(z);

  </script>

1.3 自增自减

<script>

    // ++ => 自增
    // -- => 自减

    // 自增自检的操作数不能是常量.

    let m = 10;
    // m = m + 1;
    // m = m + 1;

    // m++其实就是 m = m + 1的语法糖 (某个逻辑的简写形式)
    m++;
    m++;
    console.log(m);

    let x = 10;

    // x = x - 1;
    // x = x - 1;
    x--;
    x--;

    console.log(x);

    // 不能操作常量数字.
    // 10++ => 10 = 10 +1

  </script>

1.4 前自增和后自增

<script>

    // m++ => 后自增.
    // ++m => 前自增.

    // m-- => 后自减 => 返回-1之前的值.
    // --m => 前自减 => 返回-1之后的值.

    // 不管是前自增还是后自增, m的值都加1
    // 那前自增和后自增的区别是什么?
    // 答:返回值不一样.
    // m++ 返回 m+1前的值.
    // ++m 返回 m+1后的值.

    let m = 10;

    // 把x变成m++的返回值.
    // let x = m++;

    // 后++ 先赋值后+1
    // let x = m;
    // m = m + 1;

    // 把x变成++m的返回值.
    // let x = ++m;

    // 前++ 是先+1再赋值.
    // m = m + 1;
    // let x = m;
   
    console.log(x); // 11
    console.log(m); // 11

  </script>

1.5 赋值运算符

<script>

    let m = 10;

    m = m + 1;
    以上写法可以简写成以下形式。
    m += 1;

    m = m - 1;
    以下是简写
    m -= 1;
 
    m = m * 2;
    m *= 2;

    m = m / 2;
    m /= 2;

    m = m % 3;
    m %= 3;

    m = m * typeof m
    m *= typeof m

    m = m * (3 + 2);
    m *= 3 + 2;
    console.log(m);



  </script>

1.6 null

<body>
  
  <div id='wrap'></div>

  <script>

    // 获取不到标签,则oDiv表示一个不存在的标签对象,则默认oDiv就是null
    const oDiv = document.getElementById('wrap1');
    console.log(oDiv);

    // undefined和null都不能设置和访问任何属性.(它们后面不能接.)
    // Cannot set property 'innerText' of null
    // 不能设置null的innerText属性.
    oDiv.innerText = '我要出现';

    // null 和 undefined类似
    // null 一般用于表示一个不存在的对象.或者进行一个object数据类型的初始化.

    // 对一个字符串进行初始化.
    // let str = '';

    // 对一个object类型的变量进行初始化,用null.
    // let obj = null;

  </script>

1.7 布尔值和比较和运算符

boolean => 用于判断 => 表示对错,真假,有无

    布尔值只有两个常量 => 分别是true和false

    true => 对,真,有

    false => 错,假,无

    1,2,3 => 数字常量

    '你','我','它' => 字符串常量

    true,false => 布尔值常量

    比较运算符表达式都会返回布尔值.

    以下运算符都返回布尔值.

    <,>,>=,<=,==,===,!=,!==

    1小于2,这是对的,真的

    1 < 2 => 返回true

    1 > 2 => 返回false

    小于2或者=2都是true

    1 <= 2 => true

    2 <= 2 => true

2.0 判断是否相等

== => 值等 判断两个操作数的值是否相等

    === => 全等 判断两个操作数的值和数据类型是否同时一致

    全等要比值等更严谨.

    js认为 undefined和null的值是相等.

    undefined == null => true

    undefined === null => false

    1 == 1 => true

    1 === 1 => true

    '1' == 1 => true

    '1' === 1 => false

2.1 判断不等

 我是对的

    我不是错的

    != => 值不等都返回true. 值不等返回false

    !== => 值或者类型不等返回true. 值和类型全等返回false

    1 != 2 => true

    1 != '1' => false

    1 !== '1' => true

    1 !== 1 => false

2.2 判断

<script>

    // 考100分,就给你10块钱.

    let score = 100;

    // 判断的语法 => if (条件) { 条件成立时做的事情 }
    // 判断语句的()前后要有空格

    // if (考100分) {
    //   就给你10块钱
    // }
    
    // () 内的表达式返回true,就执行{}内的代码.
    // () 内的表达式返回false,就不执行{}内的代码.

    if (score === 100) {
      console.log('就给你10块钱');
    }

    // 判断一个数是不是小于5,大于5,等于5,不等于5

  </script>

2.3 判断.if else

IF ELSE 判断语法:if (条件) {

              条件为成立做的事情

           } else {

              条件不成立做的事情

          }
else 的前后需要有空格.

<script>

    // 如果你考100分,就给你10块钱.没考到100分,就抄试卷10次.

    // if (你考100分) {
    //   就给你10块钱
    // } else {
    //   就抄试卷10次.
    // }

    let score = 89;
    
    // if (score === 100) {
    //   console.log('就给你10块钱');
    // } else {
    //   console.log('就抄试卷10次');
    // }
    
    // 条件不一样,{} 内的代码顺序要修改。
    if (score !== 100) {
      console.log('就抄试卷10次');
    } else {
      console.log('就给你10块钱');
    }

  </script>

2.4 写多个if还是if else

<script>

    // 如果你是男的,就给你买电脑。
    // 如果你是女的,就给你买包包。

    // 当有多个条件需要判断时:
    // 1:条件是互斥的,使用 if else
    // 2:条件不是互斥的,可以同时成立的,使用多个if判断.

    if (你是男的) {
      给你买电脑
    }

    if (你是女的) {
      给你买包包
    }

    // ------------------------------------------------

    if (你是男的) {
      给你买电脑
    } else {
      给你买包包
    }

    // ------------------------------------------------

    let sex = '女'

    if (sex === '男') {
      console.log('给你买电脑')
    }

    if (sex === '女') {
      console.log('给你买包包')
    }

    if (sex === '男') {
      console.log('给你买电脑')
    } else {
      console.log('给你买包包')
    }

    // 作为我生了个小孩.
    // 恭喜.男孩吗?
    // 不是
    // 那是女孩?

  </script>

2.5 数字整除

<script>

    // 12是否能整除3.能就弹能整除3.
    // 12是否能整除4.能就弹能整除4

    if (12 % 3 === 0) {
      alert('能整除3')
    }

    if (12 % 4 === 0) {
      alert('能整除4')
    }

    // 不能整除3就一定能整除4
    if (12 % 3 === 0) {
      alert('能整除3')
    } else {
      alert('能整除4')
    }

  </script>

2.6 判断里面的判断

<script>

    // 女朋友让男朋友上街买西瓜,如果看到橘子,就买两个.
    // 男朋友买回来两个西瓜.

    // 女朋友让男朋友去买水果
    // 1:如果有西瓜,就买1个.
    // 2:没有西瓜,看看有没有橘子,有橘子,就买2个橘子.
    // 3:如果橘子也没有,看看有没有葡萄,就就买.

    // 判断内套判断。(例子)
    if (有西瓜) {
      console.log(买1个)
    } else {
      if (有橘子) {
        console.log(买两个)
      } else {
        if (有葡萄) {
          console.log(买两斤)
        }
      }
    }

    // 毕业了:
    // 如果我工资有18k,就请大家吃饭,如果当时不下雨,就去大排档,下雨就不请客
    // 如果工资没到18k,如果到了10k,我就请大家吃包子,如果10k都没到,打算吃一个月泡面.

    if (工资到了18k) {
      if (没下雨) {
        去大排档
      } else {
        不请客
      }
    } else {
      if (工资到10k) {
        请大家吃包子
      } else {
        吃一个月泡面
      }
    }

  </script>

2.7 if else if

<script>

    // 女朋友让男朋友去买水果
    // 1:如果有西瓜,就买1个.
    // 2:没有西瓜,看看有没有橘子,有橘子,就买2个橘子.
    // 3:如果橘子也没有,看看有没有葡萄,就就买.

    // 判断内套判断。
    if (有西瓜) {
      console.log(买1个)
    } else {
      if (有橘子) {
        console.log(买两个)
      } else {
        if (有葡萄) {
          console.log(买两斤)
        } else {
          console.log(买包包)
        }
      }
    }

   // 没有西瓜判断,有没有橘子,没有橘子判断有没有葡萄.

  </script>

 语法: 

    if (条件1) { 

          条件1成立做的事情 

     }else if (条件2) {

          条件1不成立但是条件2成立做的事情

     }

    ... 

    else {所有条件都不成立做的事情}

 if (有西瓜) {
      console.log(买1个)
    } else if (有橘子) {
      console.log(买两个)
    } else if (有葡萄) {
      console.log(买两斤)
    } else {
      console.log(买包包)
    }

3.0 swtich(的各种写法)

IF语句判断写法。 

<script>

    // 多个else if 可以继续改写成switch判断

    // 判断人名
    // 判断是不是杨幂,是...
    // 如果不是杨幂,继续判断是不是超越..是...
    // 如果又不是超越,继续判断是不是郭德纲...

    let name = '杨幂';

    if (name === '杨幂') {
      console.log('凯威的前妻')
    } else if (name === '超越') {
      console.log('不会唱歌和跳舞')
    } else if (name === '郭德纲') {
      console.log('相声大师')
    } else {
      console.log('没有这人')
    }

  </script>

3.1 改写成SWITCH写法 。

switch (name) {
      case '杨幂':
        console.log('凯威的前妻');
        // 如果name === '杨幂',就不再做后续判断.
        break;
      case '超越':
        console.log('不会唱歌和跳舞');
        // 如果name === '超越',就不再做后续判断.
        break;
      case '郭德纲':
        console.log('相声大师');
        // 如果name === '郭德纲',就不再做后续判断.
        break;
      default:
        console.log('没有这人');
    }

 3.2 IF判断语句写法。 

<script>

    // 所有的else if 都可以改写成switch.

    if (true === 有西瓜) {
      console.log(买1个)
    } else if (true === 有橘子) {
      console.log(买两个)
    } else if (true === 有葡萄) {
      console.log(买两斤)
    } else {
      console.log(买包包)
    }

  </script>

 3.3 改写成SWITCH写法。

<script>

    // 所有的else if 都可以改写成switch.

    switch (true) {
      case 有西瓜:
        console.log(买1个);
        break;
      case 有橘子:
        console.log(买两个);
        break;
      case 有葡萄:
        console.log(买两斤);
        break;
      default:
        console.log(买包包)
    }
  </script>

3.4 IF判断写法 。

<script> 

    let num = 189;

    // 是否小于100,不小于100,判断是否小于150,不小于150,继续判断是否小于200

    if (num < 100) {
      console.log('这个数大于100')
    } else if (num < 150) {
      console.log('100<num<150')
    } else if (num < 200) {
      console.log('150<num<200')
    } else {
      console.log('num>=200');
    }

    // switch 写法是可选的.

  </script>

  3.5改写成SWITCH写法。

<script>

    let num = 189;

    // 是否小于100,不小于100,判断是否小于150,不小于150,继续判断是否小于200

    switch (true) {
      case num < 100:
        console.log('这个数大于100');
        break;
      case num < 150:
        console.log('100<num<150');
        break;
      case num < 200:
        console.log('150<num<200');
        break;
      default:
        console.log('num>=200');
    }

    // switch 写法是可选的.

  </script>

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值