非零基础自学前端最后一遍二 JavaScript基础 7 JavaScript函数 7.8 函数调用自己以及递归的理解

ゝ一纸荒年。 2024-03-24 13:15 45阅读 0赞

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

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

*   *   *  非零基础自学前端最后一遍
         *  二 JavaScript基础
         *  7 JavaScript函数
         *   *  7.8 函数调用自己以及递归的理解
             *   *  7.8.1 函数中调用函数
                 *  7.8.2 函数的递归

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

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

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

##### 7.8 函数调用自己以及递归的理解 #####

###### 7.8.1 函数中调用函数 ######

*  在开发中，函数内部是可以调用另外一个函数的。
    
    ![在这里插入图片描述][ec91244004e542eab7fe8d570d8273d0.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>
        
            function bar() {
                
              console.log("bar函数被执行了~")
              console.log("----------")
            }
        
            function foo() {
                
              // 浏览器默认提供给我们的其他函数
              console.log("foo函数执行")
              console.log("Hello World")
              // alert("Hello Coderwhy")
        
              // 调用自己定义的函数
              bar()
        
              // 其他代码
              console.log("other coding")
            }
        
            foo()
        
          </script>
        
        </body>
        
        </html>
    
    运行结果
    
    ![在这里插入图片描述][6dec53af4c0d4ff0aee6c2b0059b8981.png_pic_center]
 *  既然函数中可以调用另外一个函数，那么函数是否可以调用自己呢？
    
     *  当然是可以的；
     *  但是函数调用自己必须有结束条件，否则会产生无限调用，造成报错；
    
    ![在这里插入图片描述][9c6a76c8f1054a4c88eaf8ca9106b54a.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>
        
            function bar() {
                
        
            }
        
            // 递归调用
            // 默认情况下会产生无限调用的情况
            function foo() {
                
              console.log("foo函数被执行了")
              foo()
            }
        
            foo()
        
          </script>
        
        </body>
        
        </html>
    
    别试

###### 7.8.2 函数的递归 ######

*  事实上，函数调用自己还有一个专业的名词，叫做递归（Recursion）
 *  在语言学方面，我们也可以描述为递归：
    
     *  从前有座山，山里有座庙，庙里有个老和尚，正在给小和尚讲故事呢！故事是什么呢？
     *  递归读取上面的话；
 *  递归是一种重要的编程思想：
    
     *  将一个复杂的任务，转化成可以重复执行的相同任务；

[f5703b8346c04480a8ae9b1081ae1961.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/f827d7df993a400fa317fb6889630e4b.png
[ec91244004e542eab7fe8d570d8273d0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/bee99af877404906909205e3d28678c5.png
[6dec53af4c0d4ff0aee6c2b0059b8981.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/dfc4cafdb5664686b8f2e7ed4b3f94c2.png
[9c6a76c8f1054a4c88eaf8ca9106b54a.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/24/6157394950ca43e4b7c7da5064408a6e.png