非零基础自学前端最后一遍二 JavaScript基础 7 JavaScript函数 7.9 函数的递归调用案例

忘是亡心i 2024-03-24 13:15 19阅读 0赞

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

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

*   *   *  非零基础自学前端最后一遍
         *  二 JavaScript基础
         *  7 JavaScript函数
         *   *  7.9 函数的递归调用案例
             *   *  7.9.1 实现自己的幂函数
                 *  7.9.2 递归的实现思路

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

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

#### 7 JavaScript函数 ####

##### 7.9 函数的递归调用案例 #####

###### 7.9.1 实现自己的幂函数 ######

案例：实现一个自己的幂函数pow（pow单词可以表示指数的意思）

*  我们可以先用for循环来实现；
    
    ![在这里插入图片描述][095c6fd66906453481afe3810c56064c.png_pic_center]

<!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>
    
        // 需求: 封装一个函数, 函数可以实现x的n次方法
        function pow1(x, n) {
          
          return x ** n
        }
    
        // console.log(pow1(2, 3))
        // console.log(pow1(3, 3))
    
        // console.log(Math.pow(2, 3))
        // console.log(Math.pow(3, 3))
    
        // 一. for循环实现方式 
        // x² = x * x
        // x³ = x * x * x
        function pow2(x, n) {
          
          var result = 1
          for (var i = 0; i < n; i++) {
          
            result *= x
          }
          return result
        }
    
        console.log(pow2(2, 3))
        console.log(pow2(3, 3))
    
        // 二. 递归实现方式(必须有一个结束条件)
        // 缺点: 性能是比较低(占用过多的栈内存)
        // 优点: 写出来的代码非常简洁
        function pow(x, n) {
          
          return x * pow(x, n - 1)
        }
    
        console.log(pow(2, 3))
        console.log(pow(3, 3))
    
      </script>
    
    </body>
    
    </html>

###### 7.9.2 递归的实现思路 ######

*  另一种实现思路是递归实现：
    
     *  这是因为在数学上：$x^n = x \* x^\{n-1\} $
     *  那么对于函数的调用，我们也可以进行划分：
     *  这里需要有一个结束的条件，就是当n已经等于1的时候就不需要拆分了；
    
    ![在这里插入图片描述][ff30304e4b8342fab49991190ff8fabd.png_pic_center]
 *  所以最终的代码如下：
    
    ![在这里插入图片描述][c85afb9e00e14a2b8677ec185fca1bd9.png_pic_center]
    
    递归的代码第一次接触会有点绕，对于初次接触函数的同学，可以先跳过去。
    
    后续我们讲解数据结构与算法时，会使用递归来解决一些算法问题；

[f58b08fbfbd94eb28b92e72d58119df2.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/3c6122d758f045d088276ac43b9623ac.png
[095c6fd66906453481afe3810c56064c.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/adcc82b5fdee4572822f161e8a880682.png
[ff30304e4b8342fab49991190ff8fabd.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/71826858eedb4b879eb3ee56ff2a528e.png
[c85afb9e00e14a2b8677ec185fca1bd9.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/bf88bb4e9f4d4d7a8c35ba1ca830a4a2.png