博主信息
博文 18
粉丝 1
评论 0
访问量 20664
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于JS函数的基本知识
空瓶子
原创
925人浏览过

作业内容:1. 实例演示变量与常量的区别; 2. 函数与匿名函数的区别 3. 箭头函数的参数特征 4. 闭包原理与实现并演示它 5. 四种高阶函数,全部实例演示,并理解回调和纯函数是什么,写出你的答案

1. 实例演示变量与常量的区别

变量:声明变量的关键字是let,声明变量后第一次给变量赋值叫做变量初始化。可以在声明变量的时候一起初始化变量。之后再给变量赋值叫做变量更新。
例如定义一个用户名为土豆的变量

  1. let userName = "土豆";
  2. console.log(userName);

常量:在 js 中没有传统意义的常量这个概念,我们把不变的变量立即成常量。通过关键字const关键字声明的变量称之为常量。声明常量后不能更新和删除,所以在声明常量的同时也要给常量赋值。
例如声明一个用户的身份证号码

  1. const ID_NUMBER = "350123199999999999";
  2. console.log(ID_NUMBER);

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

函数用来封装可复用的功能,定义一个函数有多种方式:1、函数声明,2、函数表达式(匿名函数),3、箭头函数,4、构造函数等等

函数声明由声明关键字function、函数名、传递给函数的参数和函数体注册。匿名函数顾名思义是没有函数名的函数。函数和匿名函数最大的区别定义了匿名函数的函数表达式不会提升,所以不能再定义之前调用。
demo 代码

  1. // 函数声明提升
  2. console.log(sum(3, 4));
  3. function sum(a, b) {
  4. return a + b;
  5. }
  6. // 将函数改写为匿名函数
  7. const SUM = function (a, b) {
  8. return a + b;
  9. };
  10. console.log(SUM(5, 4));
  11. // 如果在为声明匿名函数是调用匿名函数,将会出现错误
  12. console.log(demo(6 + 8));
  13. let demo = function (n, m) {
  14. return n + m;
  15. };

效果演示

3. 箭头函数的参数特征

箭头函数是简化匿名函数的语法糖,用来简化匿名函数的声明。
在没有参数或者多个参数事必须要写“()”,只有一个参数时可以省略“()”
有多条语句时函数体的“{ }”不能够省略,只有一个函数体是可以省略“{ }”
如果函数体只有一条语句,可不写 return。
箭头函数中的 this,始终与它的上下文绑定
demo 代码

  1. // 匿名函数
  2. let sum = function (a, b) {
  3. return a + b;
  4. };
  5. console.log(sum(5, 7));
  6. // 通过箭头函数改写匿名函数
  7. sum = (a, b) => {
  8. return a + b;
  9. };
  10. console.log(sum(9, 7));
  11. let number = (sum = (a, b) => a + b);
  12. console.log(number(66, 5));

效果演示

4. 闭包原理与实现并演示它

一个函数和对其周围状态(lexical environment,词法环境)的引用捆绑在一起(或者说函数被引用包围),这样的组合就是闭包(closure)。也就是说,闭包让你可以在一个内层函数中访问到其外层函数的作用域。在 JavaScript 中,每当创建一个函数,闭包就会在函数创建的同时被创建出来。
demo 代码

  1. let num = 10;
  2. function sum(a, b) {
  3. let i = 5;
  4. return i + a + b + num;
  5. }
  6. console.log(sum(2, 3));
  7. function f1() {
  8. let a = 3;
  9. // 这个返回的子函数就是闭包
  10. // a 相对于f1是私有变量,但是相对于返回的匿名函数就是一个自由变量
  11. return function () {
  12. return a++;
  13. };
  14. }
  15. // 通过闭包可以访问函数中的私有变量
  16. let f2 = f1();
  17. console.log(f2());

效果演示

5. 四种高阶函数

高阶函数: 使用函数为参数或者将函数做为返回值的函数

  1. 回调函数

    1. document.addEventListener("click", function () {
    2. alert("Hello World~~");
    3. });

  1. 偏函数
    简化了声明时的参数声明。其原理是先声明构成函数执行条件的的必要参数,在将函数作为返回值
  1. let sum = function (a, b) {
  2. return function (c, d) {
  3. return a + b + c + d;
  4. };
  5. };
  6. let f1 = sum(1, 2);
  7. console.log(f1(3, 4));

  1. 柯里化
    柯里化是偏函数的变态升级版
  1. sum = function (a) {
  2. return function (b) {
  3. return function (c) {
  4. return function (d) {
  5. return a + b + c + d;
  6. };
  7. };
  8. };
  9. };
  10. // 简化了调用参数
  11. let res = sum(10)(20)(30)(40);
  12. console.log(res);

  1. 纯函数
    完全独立于调用上下文,返回值只能受到传入的参数影响
    时间戳就是个电信的纯函数

    1. function getDate() {
    2. return Date.now();
    3. }
    4. console.log(getDate());
    5. // 是纯函数
    6. function add(a, b) {
    7. console.log(a + b);
    8. }

    5. 回调和纯函数

    回调函数是被作为一个实参传入到另外一个外部函数中,并且外部函数被调用。这个函数就被称为回调函数。
    纯函数就顾名思义,函数中没有其他函数为函数体的函数,他的返回值只受传入的参数影响。

批改老师:天蓬老师天蓬老师

批改状态:合格

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学