博客列表 >回调函数,偏函数和闭包原理 - 简单易懂有实例

回调函数,偏函数和闭包原理 - 简单易懂有实例

Jerry
Jerry原创
2021年01月05日 18:29:34787浏览

1 变量与常量的区别

  1. //变量
  2. let user; //可以先声明 不用初始化
  3. user = "张明"; //初始化变量
  4. console.log(user);
  5. user = "韩梅梅"; //变量的赋值可以修改
  6. console.log(user);
  7. //常量
  8. const price = 2998; //声明时必须初始化
  9. console.log(price);
  10. //price = 1995; 再次给常量price赋值会报错

2.函数与匿名函数的区别

  1. //普通函数;
  2. function sum(a, b) {
  3. console.log(a + b);
  4. }
  5. sum(15, 30);
  6. //普通函数通过定义一个函数名,在下面可以直接完成调用
  7. //匿名函数
  8. let sum2 = function (a, b) {
  9. console.log(a + b);
  10. };
  11. sum2(2, 5);
  12. // 匿名函数通过定义一个变量直接来定义 然后通过变量调用

3.箭头函数的参数特征

  1. // 箭头函数主要用来简化匿名函数
  2. sum2 = function (a, b) {
  3. return a + b;
  4. };
  5. console.log(sum2(1, 2));
  6. // 匿名函数function也可以简化掉,加一个胖箭头 等价于
  7. sum2 = (a, b) => {
  8. return a + b;
  9. };
  10. console.log(sum2(3, 4));
  11. // 继续简化 如果函数体只有一条语句时,可以省略大括号和rutrun
  12. sum2 = (a, b) => a + b;
  13. console.log(sum2(5, 6));
  14. //有多条语句时,函数体的大括号不能省 有多个参数时, 圆括号必须要写
  15. //当参数只有一个时,圆括号可以省略,如果没有参数,反而不能省
  16. sum2 = (a) => a + 10;
  17. console.log(sum2(5));
  18. // 箭头函数参数总结
  19. // 1. 匿名函数function也可以简化掉,加一个胖箭头
  20. // 2. 如果函数体只有一条语句时,可以省略大括号和rutrun
  21. // 3. 当有多条语句时,函数体的大括号不能省
  22. // 4. 当有多个参数时, 圆括号必须要写
  23. // 5. 当参数只有一个时,圆括号可以省略,如果没有参数,反而不能省

5.回调函数

  1. //回调函数: 回头再调用函数,等主干事情干完了,再回头干分支上的事情。
  2. //函数B作为参数(函数引用)传递到函数A中,并且这个函数A执行函数B。我们就说函数B叫做回调函数;
  3. // A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.
  4. // 回调是一个函数,它作为参数传递给另一个函数,并在其父函数完成后执行。
  5. //定义主函数,回调函数作为参数
  6. function A(callback) {
  7. callback();
  8. console.log("我是主函数");
  9. }
  10. //定义回调函数
  11. function B() {
  12. setTimeout("console.log('我是回调函数')", 100); //模仿耗时操作
  13. }
  14. //调用主函数,将函数B传进去
  15. A(B);
  16. //输出结果

6.偏函数

  1. //偏函数应用,英文是partial application,也可以译作“局部应用”、“部分应用”、“偏应用”
  2. //就是固定一个函数的一个或者多个参数,返回一个新的函数,这个函数用于接受剩余的参数。
  3. //接受一个入参函数,返回一个新的函数,
  4. function makeAdder(a) {
  5. return function (b) {
  6. return a + b;
  7. };
  8. }
  9. let addOne = makeAdder(1);
  10. console.log(addOne(2));
  11. addTen = makeAdder(10);
  12. console.log(addTen(2));

7.柯里化

  1. //柯里化 接收多个参数的函数变换成接收一个单一参数的函数,并返回接受剩余的参数而且返回结果的新函数
  2. let sum = function (a) {
  3. return function (b) {
  4. return function (c) {
  5. return function (d) {
  6. return a + b + c + d;
  7. };
  8. };
  9. };
  10. };
  11. console.log(sum(2)(4)(6)(8));

8.纯函数

  1. //纯函数
  2. //函数的返回结果只依赖于它的参数。
  3. //函数执行过程里面没有副作用。
  4. let a = 1;
  5. let foo = (b) => a + b;
  6. foo(2); // => 3
  7. console.log(foo(2));
  8. //foo 函数不是一个纯函数,因为它返回的结果依赖于外部变量 a,我们在不知道 a 的值的情况下,并不能保证 foo(2) 的返回值是 3。虽然 foo 函数的代码实现并没有变化,传入的参数也没有变化,但它的返回值却是不可预料的,现在 foo(2) 是 3,可能过了一会就是 4 了,因为 a 可能发生了变化变成了 2。
  9. a = 1;
  10. foo = (x, b) => x + b;
  11. foo(1, 2); // => 3
  12. console.log(foo(1, 2));
  13. //现在 foo 的返回结果只依赖于它的参数 x 和 b,foo(1, 2) 永远是 3。今天是 3,明天也是 3,在服务器跑是 3,在客户端跑也 3,不管你外部发生了什么变化,foo(1, 2) 永远是 3。只要 foo 代码不改变,你传入的参数是确定的,那么 foo(1, 2) 的值永远是可预料的。
  14. //这就是纯函数的第一个条件:一个函数的返回结果只依赖于它的参数。

9.闭包原理

  1. //JS函数内部可以直接读取全局变量
  2. //在函数外部自然无法读取函数内的局部变量
  3. //如何从外部读取局部变量,我们有时候需要得到函数内的局部变量
  4. //那就是在函数的内部,再定义一个函数。这个函数就叫闭包
  5. //闭包就是能够读取其他函数内部变量的函数
  6. function f() {
  7. let n = 50;
  8. // 这个返回的子函数就是闭包
  9. return function () {
  10. return n;
  11. };
  12. }
  13. console.log(f()());
  14. //闭包可以用在许多地方。它的最大用处有两个,
  15. //一个是前面提到的可以读取函数内部的变量,
  16. //另一个就是让这些变量的值始终保持在内存中。
  17. function f1() {
  18. let m = 60;
  19. return function () {
  20. m = m + 1;
  21. return m;
  22. };
  23. }
  24. let f2 = f1();
  25. console.log(f2()); //原来的m内存为60 加1后结果为61 新m内存变为61
  26. console.log(f2()); //此时结果为61+1 同时m变量更新为62
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议