JavaScript（五）——函数

JavaScript（五）——函数

前言

函数在JavaScript中占据很大的地位（其实哪门语言中函数和方法都是很重要的）。但是在原生的JavaScript中，所有的操作都是由函数来完成的，包括我们经常使用的触发器和绑定事件都是由函数来编写，甚至到后面的Vue里面都有很多函数的存在，所以一定要把函数学好。

JavaScript中的函数并不难，只是在书写上会繁琐一些，但是在掌握基本语法以后就没有什么难度了。

函数

函数的定义

大家最开始接触函数的概念是从数学中接触，数学中的函数定义是什么呢？

在数学领域，函数是一种关系，这种关系使一个集合里的每一个元素对应到另一个（可能相同的）集合里的唯一元素。

在JavaScript中，函数同样是一种关系，是一种针对两个状态之间转化的特定关系。这么说可能不太理解，那么我们再次回到编程语言的概念中来。

大家都听说过抽象，无论在生活中还是编程语言中，大家都无法准确描述什么是“抽象”，它好像是一个很模糊的概念。其实这种很模糊的概念也是抽象的一种。那么抽象到底是什么呢？如下解释：

抽象指的是，我们找到一个实际存在的物体，在其中找到这个物体独有的特性或者能代表这个物体的特性，只要一提到这些特性就能联想到这个物体的特性的集合；将这个特性的集合抽取出来，编纂成概念，这就是抽象。比如：

汽车的特性有什么？

• 有车轮；
• 有能源动力；
• 有座椅；
• 可以运送物体（无论是人还是货物）。

好了，现在我们把汽车的特性抽取出来了，现在我们尝试改变这些特性的表现形式或者状态，就可以得出其他种类的汽车。比如：

• 小型车的车轮数量一般在3——4之间；
• 车的动力有油车和电车；
• 超跑一般只有两个座椅；
• 按照交通法来分析，有些车只能载客，有些车可以载货。

这就是抽象。

而函数为什么和抽象有关系呢，函数是一种关系，一种行为。比如我们为了遍历一个数组中的所有的数据，一般会采用循环的方式来执行，但是数组很多的时候就需要一个一个的写循环，这就是一种代码冗余。在编程范式中也称之为高耦合（不理解的同学可以去看一看编程范式的知识点）。

高耦合是不可取的，所以我们要尝试不写这么多循环就能遍历任意一个数组的方式。所以函数诞生了，我们可以把数组作为一个参数传递到函数中，而在函数中只完成作为参数的数组的遍历循环，，这样我们就可以在需要遍历数组的时候用一行代码调用函数就可以了。

let arrs1 = [1,2,3,4,5,6,7,8,9];
let arrs2 = [9,8,7,6,5,4,3,2,1];

// 如果需要分别遍历输出这两个数组就需要书写两个循环
//arrs1.forEach(arr => (document.write(arr)));
//document.write('&nbsp');
//arrs2.forEach(arr => (document.write(arr)));

// 使用函数就可以只写一次循环即可
function write_arrs(arrs){
  arrs.forEach(arr => (document.write(arr)));
  document.write('&nbsp');
}
write_arrs(arrs1);
write_arrs(arrs2);

【注】：所以说，在大学期间学习到的编程知识中，很少有人能吧函数具体的作用说明白；函数并不是随便写的，它是有严格地编程逻辑支撑的。至于编程逻辑大家可以去找找对应的书看看。我这边有，但是懒得上传到CSDN中了，有需要的同学可以私信我，我给你百度网盘链接，或者加我扣扣/微信沟通。

函数的组成

• 定义函数关键字：function；
• 函数名；
• 参数列表（无参数则为空括号）：function test_fun()；
• 函数体（被划括号围起来）：

function test_fun(){
    // 这里面是函数体;
}

上述代码中的函数定义方式为匿名函数定义，完整的函数定义方式如下：

// fun为函数变量名（引用名）
let fun = function test_fun(){
    // 这里面是函数体;
}
// 这种情况下无法使用函数名来调用函数，需要用到引用名来调用函数
fun();

参数

和其他语言不太一样，JavaScript的参数列表并不会十分严格，调用函数时传递的参数与函数的参数列表数量不一致也是可以的，具体如下：

function test1(a,b,c){
// 函数会按照顺序输出对应的参数，其余的参数就不会被函数的参数列表接收
  document.write(a + '  ');
  document.write(b + '  ');
  document.write(c + '  ');
  document.write('\n');
// 不过多余的参数也不是消失不见，它在另一个地方完整的存放着，这个地方叫做实参列表
  for(let i = 0; i < arguments.length; i ++){
    document.write(arguments[i]);
  }
// 返回函数的参数列表长度（形式参数个数）
  document.write(test1.length)
}
test1(1,2,3,4,5,6);

返回值

返回值语句是return。这个语句有两个功能。

• 执行到return的时候表示函数结束的时候返回一个数据给函数调用处：

function test2(){
  let num = 1;
  return num;
}
// 该函数执行结束之后，会在将num的值返回到函数调用处
// 此时可以理解为将函数调用处的代码替换为 num 的值
test2();  // 等同于     1;
// 如果定义了变量接收返回值，则变量的值为返回值
let re_num = test2();

• return语句后没有参数表示结束当前函数的执行：

function test2(){
  let num = 1;
  return;
// return语句后面的语句不会被执行，因为当前函数已经被强制结束了
  document.write(num);
}

总结

本篇笔记先记录到这里，函数的具体使用以及和函数相关的逻辑、算法将在下一篇笔记中说明。