Javascript教程五——函数

5、 函数

5.1 函数的两种表达

1、函数声明

function abs(x) {
 	if (x >= 0) {
    	return x;
	} else {
    	return -x;
	}
}

2、函数表达式

var abs = function (x) {
	 if (x >= 0) {
    	return x;
	 } else {
    	return -x;
	 }
};

上述abs()函数的定义如下：

1、function指出这是一个函数定义
2、abs是函数的名称
3、(x)括号内列出函数的参数，多个参数以,分隔
4、{ ... }之间的代码是函数体，可以包含若干语句，甚至可以没有任何语句
5、上述两种方法完全等价

注意 如果把return语句拆成两行，一部分浏览器会自动在return后加上；造成返回永远是 undefined。

5.2 函数声明提升

在学习变量的时候，我们了解到var会发生变量提升的情况：变量通过var声明，会提升到作用域最上面。

声明提升在函数这里也是生效的

所以第一种的函数声明会提升到作用域最前面，也就是说，函数在哪里都可以使用；但是第二种的函数表达式，因为存在 = ，也就是定义，JS里面只有声明可以提升，所以用函数表达式创建的函数，只能在定义下方使用，否则会显示undefined，因为只有声明，没有定义，这是最大的区别。

5.3 参数

JS的参数有两种，形参与实参，形参是在函数参数那里声明的，实参则是真正传进来的，这里有两种情况：

形参 > 实参

当形参 > 实参时，没有被新赋值的形参，会使用自己定义的value，如果自己没有定义，那么就会时undefined。

形参 < 实参

而当形参 < 实参，那么就会直接把多出来的实参忽略，但是忽略归忽略，实际上的实参是有一个专门的数组来接受的，这就是arguments。

arguments

JS 函数中都会隐式生成一个 arguments[ ] 即实参表,不论传递多少个实参, 都会先将其放到函数的参数表中存放,所以, 在实参比形参的数量多的情况下,可以通过调用 arguments[ ] 来取出剩余的实参。

但是请注意：arguments只是类数组，如果要使用，需要进行转换，才可以利用forEach进行遍历。

var arr = Array.form(arguments);    // 进行转换

还可以通过ES6引入的扩展符... 来将类数组转换成数组：

var arr = [...arguments]; // 结果同上

注意一点，函数是有一个length属性的，这个属性表示的是形参的长度。

rest

ES6还提供了一种接收多余参数的方式，不用知道形参的名字，直接全部接受，也是利用了扩展符：

function find(name,age,...rest){
	// rest会以数组的形式接收剩余所有实参。
}

5.4 局部作用域

在JS里面，局部作用域存在于函数，在函数内部声明的变量在外部会失效，但是注意，JS起初是没有块级作用域，也就是说，最小的局部作用域就是函数了。

function a(){
	var x = '111111';
	console.log(x); // '111111'
	if(true){
		var x = '2222222';
	}
	console.log(x); //  2222222    这就是因为没有块级作用域
}
console.log(x); // undefined    这是因为有函数作用域

函数内部声明函数的情况下，内部函数可以使用外部声明变量，但外部仍然不可以使用内部变量。

function arr(){
	var x = '111111';
	function brr(){
		var y = x; // '111111'
	}
	console.log(x); // '111111'
	console.log(y); // undefined
}

由于JavaScript的变量作用域实际上是函数内部，我们在for循环等语句块中是无法定义具有局部作用域的变量的。

function foo() {
	for (var i=0; i<100; i++) {
    	//
 	}
 	i += 100; // 仍然可以引用变量i
}

为了解决块级作用域，ES6引入了新的关键字let，用let替代var可以申明一个块级作用域的变量。

function foo() {
	var sum = 0;
	for (let i=0; i<100; i++) {
    	sum += i;
	}
	// SyntaxError:
	i += 1;
}

5.5 全局作用域

不在任何函数内定义的变量就具有全局作用域。实际上，JavaScript默认有一个全局对象window，全局作用域的变量实际上被绑定到window的一个属性。

这说明JavaScript实际上只有一个全局作用域。任何变量（函数也视为变量），如果没有在当前函数作用域中找到，就会继续往上查找，最后如果在全局作用域中也没有找到，则报ReferenceError错误。

全局变量会绑定到window上，不同的JavaScript文件如果使用了相同的全局变量，或者定义了相同名字的顶层函数，都会造成命名冲突。

5.6 常量

ES6标准引入了新的关键字 const 来定义常量，const 与 let 都具有块级作用域。

const x = 111;

5.7 解构赋值（数组和对象）

从ES6开始，JavaScript引入了解构赋值，可以同时对一组变量进行赋值。

var [x, y, z] = ['hello', 'JavaScript', 'ES6'];
console.log('x = ' + x + ', y = ' + y + ', z = ' + z);

如果需要从一个对象中取出若干属性，也可以使用解构赋值，便于快速获取对象的指定属性。

var person = {
	name: '小明',
	age: 20,
	gender: 'male',
	passport: 'G-12345678',
	school: 'No.4 middle school'
};
const {name, age, passport} = person;

本文来源廖雪峰老师教程的笔记，有疑惑可以直接访问廖雪峰老师教程：https://www.liaoxuefeng.com/wiki/1022910821149312/1023022043494624