JavaScript-函数（调用参数returnarguments匿名回调递归函数）函数案例

Posted 2021-06-18 速速逃离月球表面

文章目录

• 1. 函数
• • 1.1 定义/声明函数
  • 1.2 调用函数
  • 1.3 函数的参数
  • • 1.3.1 函数形参和实参个数不匹配问题
  • 1.4 函数的返回值
  • 1.5 arguments的使用
  • 1.6 函数的两种声明方式
  • • 1.6.1 自定义函数方式（命名函数）
    • 1.6.2 函数表达方式（匿名函数）
  • 1.7 回调函数
  • 1.8 递归函数
• 2. 函数的案例题
• • return语句
  • arguments的使用
  • 回调函数
  • 递归函数

1. 函数

就是封装了一段可被重复调用执行的代码块，通过此代码块可以实现大量代码的重负使用

1.1 定义/声明函数

function 函数名 ([])   ---->中括号表示可选，可有可无
{
	函数体语句
}

• function是一个关键字，全部小写
• 函数名：是一个标识符（按照标识符的命名规则），建议使用驼峰命名，做到见名知意
• 由于函数是为了实现某个功能才定义，通常将函数名命名为动词，如getSum
• 函数可以有参数也可以没有参数，可以有多个参数，若有多个参数，参数之间用逗号分隔
• "{ }"表示函数的控制范围，不能省略
• 函数体语句可以是一条也可以是多条，通常建议一个函数只完成一个功能即可
• ”高内聚，低耦合“

内聚：模块内部结合的紧密程度
耦合：模块之间结合的紧密程度

1.2 调用函数

函数名([参数])
事件名 = 函数名([参数])

• 调用时一定要加小括号

函数的封装：
指把一个或多个功能通过函数的方式封装起来，对外只提供一个简单的函数接口（类似于将电脑配件整合组装到机箱中）

练习：利用函数计算1-100之间的累加和

function getSum(n) {
		var sum = 0
		for (var i = 1; i <= n; i++) {
			sum += i
		}
		console.log(sum)
	}
	getSum(100)

1.3 函数的参数

参数	说明
形参	形式上的参数 函数定义的时候传递的参数 出现在函数首部的参数 只是一个占位符 无确定的值
实参	实际上的参数 函数调用的时候传递的参数 出现在函数首部 是实际的值 实参是传递给形参的

• 参数的作用：在函数内部某些值不能固定，可以通过参数在调用函数时传递不同的值进去
• 参数的传递方式：实参将数据传递给形参（单向传递），实参向形参传递是按照从左到右的顺序依次进行参数匹配，和参数的名称没有关系
• 形参可以理解为：不用声明的变量
• 实参向形参传递数据是单向的，形参的改变不会影响到实参
• 多个参数用（,）连接

function sort(a) {
		for (var i = 0; i < a.length; i++) {
			for (var j = 0; j < a.length - 1; j++) {
				if (a[j] > a[j + 1]) {
					var t = a[j]
					a[j] = a[j + 1]
					a[j + 1] = t
				}
			}
		}
	}

	function showArray(a) {
		var str = ''
		for (var i = 0; i < a.length; i++) {
			str += a[i] + '\\t'
		}
		console.log(str)
	}

	var arr = [89, 66, 45, 98, 12, 6]
	console.log('排序前的数组是：')
	showArray(arr)

	sort(arr)

	console.log('排序后的数组是：')
	showArray(arr)

1.3.1 函数形参和实参个数不匹配问题

function sum(num1, num2) {
    console.log(num1 + num2);
}
sum(100, 200);             // 形参和实参个数相等，输出正确结果
sum(100, 400, 500, 700);   // 实参个数多于形参，只取到形参的个数
sum(200);                  // 实参个数少于形参，多的形参定义为undefined，结果为NaN

• 函数可以不带参数
• 形参默认值为undefined
• 形参个数可以和实参个数不匹配，但结果不可预计，要尽量匹配

1.4 函数的返回值

其实就是函数的处理结果，将函数的处理结果返回，将值返回给调用者，使用return来实现

// 声明函数
function 函数名（）{
    ...
    return  需要返回的值；
}
// 调用函数
函数名();    // 此时调用函数就可以得到函数体内return 后面的值

• 在使用 return 语句时，函数会停止执行，并返回指定的值
• 如果函数没有 return ，返回的值是 undefined
• return语句之后的代码不被执行
• return只能返回一个值，如果用逗号隔开多个值，以最后一个为准
• 函数如果没有return返回undefined

break、continue、return的区别

返回值	描述
break	结束当前的循环（如for、while）
continue	跳出本次循环，继续执行下次循环（如for、while）
return	不仅可以退出循环，还能够返回return语句中的值，同时还可以结束当前函数体内的代码

1.5 arguments的使用

当不确定有多少个参数传递时，可以用arguments来获取
函数的内置对象：arguments，保存了函数接收的所有实参，arguments以数组的方式存放所有接收的实参
arguments展示形式是一个伪数组，因此可以进行遍历，伪数组具有以下特点：

• 具有length 属性
• 按索引方式储存数据
• 不具有数组的 push , pop 等方法

1.6 函数的两种声明方式

1.6.1 自定义函数方式（命名函数）

利用函数关键字function自定义函数方式

// 声明定义方式
function fn() {...}
// 调用  
fn();  

• 因为有名字所以叫命名函数
• 调用函数的代码既可以放在声明函数之前，也可以放在之后

1.6.2 函数表达方式（匿名函数）

将声明的函数赋给一个变量，然后由该变量来完成函数的调用和参数的传递

// 这是函数表达式写法，匿名函数后面跟分号结束
var fn = function(){...}；
// 调用的方式，函数调用必须写到函数体下面
fn();

• 没有名字，故叫匿名函数
• fn中存储的是一个函数
• 函数调用的代码必须写到函数体之后

1.7 回调函数

将一个函数A作为参数传递给函数B，在函数B内部对A进行调用，函数A就是回调函数
因为每一个函数都是独立的代码块，由于完成特殊任务，因此经常会用到函数相互调用的情况

function fn1() {
  console.log(111);
  fn2();
  console.log('fn1');
}
function fn2() {
  console.log(222);
  console.log('fn2');
}
fn1();

1.8 递归函数

即函数自己调用自己

• 递归的使用前提：
  1. 问题可以分解（即复杂的问题逐步分解成简单的问题）
  2. 分解得到的新问题解法和原来老问题的解法是一样的
  3. 问题必须有明确的终止条件
• 递归解决问题的过程
  1. 自上而下分解问题
  2. 自下而上回溯得到问题的解

例：阶乘就是一个很好地递归（要熟练掌握）

function fun(n) {
	if (n == 1) {   //递归结束的条件
		return 1
	}
	return n * fun(n - 1)    //递归调用：函数自己调用自己
	}
var k = prompt('请输入一个整数')
var n = parseInt(k)
if (isNaN(n)) {
	console.log('输入的值不合法！')
} else {
	console.log(n + '的阶乘=' + fun(n))
}

2. 函数的案例题

return语句

1. 利用函数求任意两个数的最大值

function getMax(num1, num2) {
		return num1 > num2 ? num1 : num2
	}
	console.log(getMax(1, 2))

2. 利用函数求任意一个数组的最大值

function getMax(arr) {
		var max = 0
		for (var i = 0; i < arr.length; i++) {
			if (max < arr[i]) {
				max = arr[i]
			}
		}
		return (max)
	}
	var arrNum = [5, 2, 99, 101, 67, 77]
	var maxN = getMax(arrNum)
	console.log('最大值是' + maxN)

3. 创建一个函数，实现两个数之间的加减乘除运算，并将结果返回

var a = parseFloat(prompt('请输入第一个数：'))
	var b = parseFloat(prompt('请输入第二个数：'))
	function count(a, b) {
		var arr = [a + b, a - b, a * b, a / b]
		return arr
	}
	var result = count(a, b)
	console.log(result)

4. 定义一个函数，功能是判断一个数是否是素数： 调用该函数，找到100以内的所有素数并输出

function fun(n) {
		for (var i = 2; i < n; i++) {
			if (n % i == 0) {
				return 0
			}
		}
		return true
	}
	for (var i = 2; i <= 100; i++) {
		if (fun(i)) {
			console.log(i + '是素数')
		}
	}

5. 定义一个函数，是判断传入的年份是否是闰年。调用该函数输出公元1500-2020之间的所有闰年，要求每行输出10个年份

function fun(y) {
		if ((y % 400 == 0) || (y % 4 == 0 && y % 100 != 0)) {
			return true
		} else {
			return false
		}
	}
	var count = 0
	var str = ''
	for (var i = 1500; i <= 2020; i++) {
		if (fun(i)) {
			count++
			str += i + '\\t'
		}
		if (count % 10 == 0) {
			str += '\\n'
		}
	}
	console.log(str)

arguments的使用

6. 利用函数求任意个数的最大值

function maxValue() {
		var max = arguments[0]
		for (var i = 0; i < arguments.length; i++) {
			if (max < arguments[i]) {
				max = arguments[i]
			}
		}
		return max
	}
	console.log(maxValue(2, 4, 5, 9))
	console.log(maxValue(12, 4, 9))

回调函数

7. 输出2月份的天数：用户输入年份，输出当前年份2月份的天数
   如果是闰年，则2月份是29天，如果是平年，则2月份是28天

function backDay() {
		var year = prompt('请输入一个年份：')
		if (isRunYear(year)) {
			console.log(year + '年2月的天数是29天')
		} else {
			console.log(year + '年2月的天数是28天')
		}
	}
	backDay()
	function isRunYear(year) {
		if ((year % 4 == 0 && year % 100 != 0) || year % 400 == 0) {
			return true
		} else {
			return false
		}
	}

递归函数

（要熟练掌握）

8. 使用递归函数，输出斐波那契数列的前20项

function fun(a) {
	if (a==1 || a==2) {
		return 1
	}
	return fun(a-1)+fun(a-2)
}
var str =''
for (var i=1;i<=20;i++) {
	str = str + fun(i)+'\\t'
}
console.log('菲波那切数列前20项是'+str)

9. 使用递归函数计算1+2+3+…+100的值

function fs(n) {
	if (n == 1) {
		return 1
	}
	return fs(n - 1) + n
}
console.log('1+2+3+...+100的值为'+fs(100))