非零基础自学前端最后一遍二 JavaScript基础 4 JavaScript基础运算符 4.5 自增和自减的用法和位置

川长思鸟来 2024-03-25 16:40 8阅读 0赞

#### 非零基础自学前端最后一遍 ####

#### 文章目录 ####

*   *   *  非零基础自学前端最后一遍
         *  二 JavaScript基础
         *  4 JavaScript基础运算符
         *   *  4.5 自增和自减的用法和位置
             *   *  4.5.1 自增、自减
                 *  4.5.2 ++和—的位置

![在这里插入图片描述][ff220bbfd9454af7ac9f1a67511970fe.png_pic_center]

#### 二 JavaScript基础 ####

#### 4 JavaScript基础运算符 ####

##### 4.5 自增和自减的用法和位置 #####

###### 4.5.1 自增、自减 ######

*  对一个数进行加一、减一是最常见的数学运算符之一。
 *  所以，对此有一些专门的运算符：
    
     *  自增 ++ 将变量加1；
     *  自减 – 将变量减1；
 *  自增/自减只能应用于变量。
    
     *  将其应用于数值（比如 5++）则会报错。

<!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>
    
        var currentIndex = 5
    
        // 方法一:
        // currentIndex = currentIndex + 1
    
        // // 方法二:
        // currentIndex += 1
    
        // 方法三: 自增
        currentIndex++
        console.log(currentIndex)
    
        // 自减
        // currentIndex -= 1
        currentIndex--
        console.log(currentIndex)
    
      </script>
    
    </body>
    
    </html>

渲染结果

![在这里插入图片描述][7ed9a240be0f45dc8abc967188b5228c.png_pic_center]

###### 4.5.2 ++和—的位置 ######

*  运算符 ++ 和 – 可以置于变量前，也可以置于变量后。
    
     *  当运算符置于变量后，被称为“后置形式”（postfix form）：counter++。
     *  当运算符置于变量前，被称为“前置形式”（prefix form）：++counter。
     *  两者都做同一件事：将变量 counter 与 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>
    
        var currentIndex = 5
        // 自己自增或者自减是没有区别
        // ++currentIndex
        // console.log(currentIndex)
        // --currentIndex
        // console.log(currentIndex)
    
        // 自增和自减表达式本身又在其他的表达式中, 那就有区别
        // var result1 = 100 + currentIndex++
        // console.log(currentIndex)
        // console.log("result1:" + result1)
    
        var result2 = 100 + ++currentIndex
        console.log(currentIndex)
        console.log("result2:" + result2)
    
      </script>
    
    </body>
    
    </html>

渲染结果

![在这里插入图片描述][c1dfab0b87244b8eaf69b0c80c1a34f0.png_pic_center]

[ff220bbfd9454af7ac9f1a67511970fe.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/8be4e028b83e4ef3bd46b0c37f2561e8.png
[7ed9a240be0f45dc8abc967188b5228c.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/855c99161d17471f837e7c5a4eed33c9.png
[c1dfab0b87244b8eaf69b0c80c1a34f0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/ef5935d300124f0db6cdbee436081460.png