副队长JavaScript教程(36)-函数:经验的复用体

点此查看所有教程、项目、源码导航

文章目录

• 1. 经验
• 2. 程序世界的经验
• 3. 代码块的应用
• 4. 只用代码块存在的问题
• 5. 函数：用来复用经验的载体
• 6. 我们先推断函数的样子
• 7. 小结

1. 经验

在成长的过程中，我们会不断积累经验，遇到相似的事情，就可以直接拿之前的经验来处理。
简单来说，经验就是从多次实践中总结出来的一套步骤、知识或者技能。
有了经验之后，再次面对同类事情，我们就不用从头摸索，效率会高很多。

2. 程序世界的经验

我们一直在说，程序是用来解决现实问题的，很多编程概念，都是现实事物在代码里的一种映射。

比如我们可以用下面这段代码，把 “学习骑单车” 的整套步骤打印输出：

// 骑单车的操作步骤console.log("1.调整合理的座椅高度");console.log("2.坐到自行车座位上");console.log("3.尝试用脚蹬踏板，练习车感");console.log("4.感觉自行车要倒的时候，将车把向倾倒的方向慢慢转动，尝试找回平衡");

运行之后，就会在控制台输出这一套操作流程。

3. 代码块的应用

这一整套骑车步骤，属于同一件事情。为了逻辑更清晰，我们可以用代码块{}，把相关的代码包裹在一起，把这一组步骤收拢到一处。

// 骑单车的经验，放在同一个代码块中{console.log("1.调整合理的座椅高度");console.log("2.坐到自行车座位上");console.log("3.尝试用脚蹬踏板，练习车感");console.log("4.感觉自行车要倒的时候，将车把向倾倒的方向慢慢转动，尝试找回平衡");}

使用代码块之后，同一套事情的代码集中放一起，阅读起来条理更清楚。

4. 只用代码块存在的问题

代码块虽然可以收拢代码，但是它有一个短板：没法方便地重复使用。

举个场景：现在有张三、李四、赵五三个人，都要学习骑单车。如果只用代码块，我们只能重复抄写整套步骤：

console.log("张三学习骑单车:");{console.log("1.调整合理的座椅高度");console.log("2.坐到自行车座位上");console.log("3.尝试用脚蹬踏板，练习车感");console.log("4.感觉自行车要倒的时候，将车把向倾倒的方向慢慢转动，尝试找回平衡");}console.log("李四学习骑单车:");{console.log("1.调整合理的座椅高度");console.log("2.坐到自行车座位上");console.log("3.尝试用脚蹬踏板，练习车感");console.log("4.感觉自行车要倒的时候，将车把向倾倒的方向慢慢转动，尝试找回平衡");}console.log("赵五学习骑单车:");{console.log("1.调整合理的座椅高度");console.log("2.坐到自行车座位上");console.log("3.尝试用脚蹬踏板，练习车感");console.log("4.感觉自行车要倒的时候，将车把向倾倒的方向慢慢转动，尝试找回平衡");}

可以发现，骑车的步骤完全一样，我们却要反复复制粘贴大量重复代码。
放到生活里理解：我们不需要每次有人想学骑车，都从头到尾口述一遍全部流程。我们可以整理一份 “骑车秘籍”，谁想学，直接拿出这份秘籍给他就可以。

在程序里，承担这份 “秘籍” 角色的，就是函数。

5. 函数：用来复用经验的载体

生活里的经验，可以记在脑子里、写在本子上、录成视频。
而在 JS 中，我们可以把一套固定的操作步骤、一段经验，封装成函数。

函数里面存放着一组完成任务的代码，它有两个核心特点：

1. 内部由多行代码组成，对应一整套操作经验；
2. 它拥有一个名字，方便我们后续找到、使用这套经验。

6. 我们先推断函数的样子

顺着上面的思路推导：函数要有名字，还要有包裹步骤的代码块。
我们先按照这个逻辑，脑补它的结构：

函数名{步骤代码 步骤代码}

对应骑单车这个例子，大概就是这样：

骑单车{console.log("1.调整合理的座椅高度");console.log("2.坐到自行车座位上");console.log("3.尝试用脚蹬踏板，练习车感");console.log("4.感觉自行车要倒的时候，将车把向倾倒的方向慢慢转动，尝试找回平衡");}

等定义好之后，以后想要执行这套骑车流程，直接使用这个 “骑单车” 就可以。
当然，上面这个写法只是我们的猜想，并不是 JS 的真实语法。下一篇，我们再来学习 JS 规定的、标准的函数定义与调用写法。

7. 小结

简单总结本篇的核心思想：
现实中我们靠经验，避免重复摸索；
在 JS 中，函数就是用来封装一套经验、实现代码复用的工具。

补充预告：之前我们学习数组的时候用到的 push、includes 这些能力，本质上也都是 JS 提前帮我们写好的函数。