【九月打卡】第19天前端工程师2022版函数

本文主要是介绍【九月打卡】第19天前端工程师2022版函数，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

课程名称：前端工程师2022版
课程章节：函数
课程讲师：慕课网
课程目标：掌握函数的基本用法，尤其是递归和闭包
课程内容：
1.函数的定义于作用
2.函数拓展-算法面试题
3. 递归与克隆
4. 作用域和闭包

1. 函数的定义于作用

JavaScript 使用关键字 function 定义函数。
函数可以通过声明定义，也可以是一个表达式。
带参数的函数

function calcPerimeter(a, b, c) {
  // a, b, c 分别代表三条边
  var sum = a + b + c;

  return sum;
}

// 调用函数 并将返回值赋值给perimeter
var perimeter = calcPerimeter(3, 4, 5);

不带参函数（匿名函数）
函数表达式：就是把函数存到变量里。

匿名函数：没有名字的函数；

匿名函数在使用时只有两种情况：

匿名函数自执行：声明后不需要调用就直接执行

//2，函数表达式：把函数存到变量或数组等里，调用时通过变量进行调用
var fn = function(){
    console.log("函数表达式：将函数存到变量里");
};
fn();//调用时需要写括号
 
//2，函数表达式：把函数存到数组第0位，调用时通过数组第0位进行调用
var arr = [];
arr[0] = function(){
     console.log("函数表达式：将函数存到数组的对应位置");
};
arr[0]();//调用时需要写括号要写括号

函数的作用域
函数有他自己的作用域，函数内声明的变量等通常情况下不能被外部访问，但是函数可以访问到外部的变量或者其他函数等

var a = 1;

function fn() {
    var b = 2;

    console.log(a); // 输出：1
    console.log(b); // 输出：2
}

fn();

console.log(b); // ReferenceError: b is not defined

递归

递归函数介绍
递归是函数的高级用法，本质上是函数自已调用自已
递归函数特性
重复执行
调用自身
【必须】要有条件控制，避免死循环

<!DOCTYPE html>
<html lang="zh-CN">

<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>
        // 利用递归函数求1-100的和
        let i = 0
        let sum = 0
        function getSum() {
            if (i >= 100) { return sum } // 后边只有一句话,可以省略大括号
            i++
            sum += i
            getSum()
        }
        getSum()
        console.log(sum);

    </script>
</body>

</html>

JS闭包

闭包是javascript中的一个重要知识点，面试经常问到，需要我们熟练掌握。根据javascript高级程序设计中解释：闭包是指有权访问一个函数作用域中局部变量的函数。

要认知闭包，就要知道js中有两种作用域：全局作用域，局部作用域，与之对应的是全局变量和局部变量。我们都知道在函数内部中可以访问到全局作用域中的全局变量，但是在全局作用域中一般却无法访问某个函数的局部变量。为了解决这个问题，我们必须知道闭包。

 <script>
    // 闭包
    function fn() {
      var arr = [];
      for(var i=0;i<5;i++) {
        arr[i] = function() {
          return i;
        }
      }
      return arr
    }
    var list = fn()
    for(var i =0;i<list.length;i++) {
      console.log(list[i]());
    }
  </script>

课程截图

这篇关于【九月打卡】第19天前端工程师2022版函数的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

HTML5教程