JavaScript函数
什么是函数
MDN函数解释:函数是 JavaScript 中的基本组件之一。一个函数是 JavaScript过程(即一组执行任务或计算值的语句)。要使用一个函数,你必须将其定义在你希望调用它的作用域内。
菜鸟教程函数解释:函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
从定义上概括:JavaScript函数就是一段被封装的 、具有某些功能的、可重复使用的 代码块。
函数封装:就是根据需求将具有某些功能的代码块放在一起,对外提供一个函数调用接口。
函数作用过程:输入参数-内部处理-返回结果
函数的声明和调用
函数的使用方法
声明函数 + 调用函数
(1)自定义函数(命名函数)
// 声明函数:
function 函数名() {
函数体
return 返回值;
}
// 调用函数:
函数名();
自定义一个getSum函数:
// 声明一个getSum函数,计算两个数值的和
function getSum(num1,num2) {
var sum = 0;
sum = num1 + num2;
return sum;
}
//调用函数:
var res = getSum(1,2);
console.log(res);
// 控制台结果: 3
(2)利用函数表达式声明一个函数(匿名函数):
// 声明函数
var 变量名 = function() {
函数体
return 返回值;
}
// 调用函数:
变量名();
匿名函数使用简单举例:
var sum = function(num1,num2) {
return num1+num2;
}
console.log(sum(3,4));
// 控制台结果为: 7
可以看出匿名函数这个结构,就是声明了一个变量 sum ,赋给这个变量 sum 的不是一个具体的数值或字符串,而是一个函数。赋给 sum
预解析 的过程。
(3)可以在一个函数内调用另一个函数
function getNum1() {
console.log(333);
}
var Num2 = function() {
console.log(111);
getNum1();
}
Num2();
(4)小结
对于自定义函数的调用有3种方式:
- 使用函数名调用函数
- 在HTML中用超链接的方式来调用
- 在事件中与事件结合来调用函数
在本文中我只是对使用函数名调用函数举例,另外两种方法会在以后进一步学习中总结其使用方法。
行参实参
实参个数 ≤ 形参个数
function getSum(num1,num2,num3) {
var sum = 0;
sum = num1 + num2 + num3;
return sum;
}
console.log(getSum(1,2));
console.log(getSum(1,2,3));
形参可看做是一个没有声明的变量,变量没有接收值,在JavaScript中默认结果显示为 undefined
1+2+undefined 结果显示为 NaN (Not a Number)。控制台结果:
实参个数 > 形参个数
参数传递时,会根据形参的个数接收,多余的实参则储存在arguments空间中,可以通过调用arguments对象调用其他实参。
function getSum(num1,num2,num3) {
var sum = 0;
sum = num1 + num2 + num3;
console.log('未参与计算的数为:'+arguments[3]);
return sum;
}
console.log(getSum(1,2,3,4));
小结
形参和实参个数匹配总结:实参个数 ≥ 形参个数
利用arguments获取函数参数
什么是arguments
MDN解释:arguments 是一个对应于传递给函数的参数的类数组对象。arguments对象是所有(非箭头)函数中都可用的局部变量。你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数,第一个参数在索引 0 处。
定义概括:arguments 是一个伪数组 对象 ,数组里面放的是所传递的实参,每个函数都内置了一个arguments对象。
伪数组:属于object类型,具有数组length属性、按照索引方式存储。但不具有真正数组的一些内置方法。
function getSum() {
var sum = 0;
for (var i = 0; i < arguments.length; i++){
sum += arguments[i];
}
console.log('arguments数据类型:'+typeof arguments );
return sum;
}
console.log('计算结果:'+getSum(1,2,3,4));
扩展:伪数组和数组的区别
伪数组类型是object,数组类型是Arry。两者都可以用for in语句遍历,可以获取长度,可以用下标获取对应元素。伪数组不能使用数组方法(如增删改等),也不能改变长度。
伪数组转换为数组的方法:Array.prototype.slice.call(伪数组),Array.from(伪数组)等方法。