博客列表 >变量与常量的区别、函数与匿名函数的区别 、箭头函数的参数特征 、闭包原理、四种高阶函数

变量与常量的区别、函数与匿名函数的区别 、箭头函数的参数特征 、闭包原理、四种高阶函数

a.
a.原创
2021年01月04日 23:22:181128浏览

变量与常量区别

  1. 变量用var(弃用)、let声明;常量用const声明
  2. 变量可以声明后再初始化,常量声明时必须出始化
  3. 变量与常量都不能重复申明(var声明的除外);变量的傎可以更新,常量的值不能被更新
  1. //声明一个变量
  2. let userName;
  3. userName = "誓言";
  4. //声明一个常量
  5. const USERNAME = "誓言";
  6. //更新一个变量
  7. userName = "八戒";
  8. //更新一个常量就会报错
  9. USERNAME = "常量初始化后就不能被更新了";

函数与匿名函数的区别

  1. 函数有函数名,匿名函数没有,需要赋值给一个变量调用
  2. 匿名函数可以简化为箭头函数,而普通函数不行
  1. //声明一个函数
  2. funtion fun(){
  3. return console.log('我是一个函数');
  4. }
  5. //调用函数
  6. fun();
  7. //声明一个匿名函数
  8. let fun1 = funtion(){
  9. return console.log('我是一个匿名函数');
  10. }
  11. //调用匿名函数
  12. fun1();
  13. //简化为箭头函数
  14. fun1 = () => console.log('我是一个匿名函数');

箭头函数的参数特征

  • 箭头函数参数不同写法也不同

1.没有参数时,只写一个小括号

fun1 = () => console.log('我是一个匿名函数');

2.一个参数时,不用写小括号

fun2 = a => console.log(a);

3.几个参数肯定要写小括号了,如果只有一条语句可以省略return 和 {}

  1. let fun1 = funtion(name){
  2. return console.log('我是一个' + name );
  3. }
  4. //可简化为
  5. fun1= name => console.log('我是一个' + name );

闭包原理与实现

  • 能访问自由自由变量的的函数,所以理论上讲,任何函数都是闭包
  • 自由变量:即不是函数参数变量 ,也不是私有变量,它存在于函数调用上下文中
  1. function a(){
  2. let n = 100;
  3. //相对于子函数来说,n就是自由变量
  4. return function(){
  5. return n;
  6. }
  7. }
  8. //返回的子函数就是闭包
  9. //此时用闭包实现了访问私有变量
  10. console.log(a()());

高阶函数

  • 什么是高阶函数:使用函数为参数或者将函数作为返回值

1. 回调函数

  • 将函数作为参数
  • 理解:回调函数就是一个被作为参数传递的函数

2. 偏函数

  • 先把函数调用中的个别参数先固定下来,剩下的参数交给子函数来处理
  • 简化声明

3. 偏函数偏激版柯里化

  • 简化调用参数

4. 纯函数

  • 完全独立与调用上下文,返回值只能受到传入的参数影响
  • 理解:不依赖上下代码的声明的一切,他返回的值只有调用时传入的参数能影响,比如函数中引用了全局变量,全局变量的的更新会影响函数,那么这个函数就不是一个纯函数

code

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <script>
  10. function a() {
  11. let n = 100;
  12. return function () {
  13. return n;
  14. };
  15. }
  16. console.log(a()());
  17. //回调函数
  18. document.addEventListener("click", function () {
  19. alert("参数中使用了函数");
  20. });
  21. //偏函数
  22. function sum(x, y) {
  23. return function (z, e) {
  24. return x + y + z + e;
  25. };
  26. }
  27. let fn1 = sum(2, 3);
  28. console.log(fn1(4, 5));
  29. //偏函数偏激版
  30. function sum1(n) {
  31. return function (m) {
  32. return function (o) {
  33. return n + m + o;
  34. };
  35. };
  36. }
  37. //纯函数
  38. let sumVlue = sum1(1)(3)(5);
  39. console.log(sumVlue);
  40. let add = (p, q) => console.log(p + q);
  41. add(3, 5);
  42. </script>
  43. </body>
  44. </html>
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议