函数的定义和调用
arguments
arguments，它只在函数内部起作用，并且永远指向当前函数的调用者传入的所有参数，可以获得调用者传入的所有参数。arguments类似Array但它不是一个Array：
function foo(x) {
console.log(x); // 10
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]); // 10, 20, 30
}
}
foo(10, 20, 30);
那在什么情况下才会真正用到arguments呢，下面举个栗子：
函数的重载：
有时候函数根据传入的参数个数的不同，来执行不同的处理：
// 如果用户传入一个参数，求平方
function sum(a){
console.log(a*a);
}
//如果用户传入两个参数，就求和
function sum(a,b){
console.log(a+b);
}
sum(4); //？
sum(4,5); //？
上述例子中本意是想让同名函数sum()根据参数不同输出不同结果，但是sum是函数名字，本质也是个变量，
第二个会覆盖第一个，所以上述的正确输出答案是：NaN,9.所以这样显然不可以。
如果用arguments,就简单多了。
如下：
function calc(){
//如果用户传入一个参数，求平方
if(arguments.length===1){
console.log(arguments[0]*arguments[0]);
}else if(arguments.length===2){
//如果用户传入两个参数，就求和
console.log(arguments[0]+arguments[1]);
}
}
calc(4); //16
calc(4, 5); //9
多个参数的求和：
function add(){
//arguments:[]
//遍历arguments中每个元素，并累加
for(var i=0,sum=0;i<arguments.length;sum+=arguments[i++]);
return sum;//返回和
}
console.log(add(1, 2, 3)); //6
console.log(add(1, 2, 3, 4, 5, 6)); //21
这就是JS利用arguments重载的效果，简单理解就是一个函数重复利用.
arguments.length是有实参决定，即函数调用时候里面的参数个数决定！
arguments对象中还定义了callee属性，用来引用当前正在执行的函数，例如在递归中使用：
function factorial(num) {
// 参数的callee是函数自身
console.log(arguments.callee === foo); // true
if(num <=1 ) {
return 1;
} else {
return num*arguments.callee(num-1);
}
}
console.log(factorial(5));//120
需要注意的是如果一个函数的参数有3个,传递的实参只有2个,那么arguments[2]和第三个参数是不共享的.
function foo(x, y, z) {
// 声明的函数参数数量arguments (x, y, z)
console.log(foo.length); // 3
// 真正传进来的参数个数(only x, y)
console.log(arguments.length); // 2
// 参数共享
console.log(x === arguments[0]); // true
console.log(x); // 10
arguments[0] = 20;
console.log(x); // 20
x = 30;
console.log(arguments[0]); // 30
// 不过，没有传进来的参数z，和参数的第3个索引值是不共享的
z = 40;
console.log(arguments[2]); // undefined
arguments[2] = 50;
console.log(z); // 40
}
foo(10, 20);
rest参数
ES6标准引入了rest参数：
function foo(a, b, ...rest) {
console.log('a = ' + a);
console.log('b = ' + b);
console.log(rest);
}
foo(1, 2, 3, 4, 5);
// 结果:
// a = 1
// b = 2
// Array [ 3, 4, 5 ]
foo(1);
// 结果:
// a = 1
// b = undefined
// Array []
rest参数只能写在最后，前面用 ... 标识，从运行结果可知，传入的参数先绑定a、b，多余的参数以数组形式交给变量rest，所以，不再需要arguments我们就获取了全部参数。
如果传入的参数连正常定义的参数都没填满，也不要紧，rest参数会接收一个空数组（注意不是undefined）。
变量的作用域
我们知道在JavaScript中， 在函数内var一个变量，则该变量的作用域为整个函数体，在函数体外不可引用该变量；
不同的函数体声明同一个变量，相互不会影响，各自的作用域只在各自所在函数体内。也就是说不同函数内部的同名变量互相独立，互不影响；
上面描述了平行关系的函数内部变量及作用域的特点，JavaScript可以存在嵌套函数，此时的内部函数可以访问外部函数定义的变量，外部则不可访问外部;
'use strict';
function foo() {
var x = 1;
function bar() {
var y = x + 1;
}
var z = y + 1; // foo() 时这里会因为无法访问y而报错
}
如果内部函数和外部函数的变量名重名，则内部函数的变量将“屏蔽”外部函数的变量。由此说明JavaScript的函数在查找变量时从自身函数定义开始。
'use strict';
function foo() {
var i = 'a';
function fuc() {
var i = 'b';
console.log('fuc', i);
}
console.log('foo', i);
fuc();
}
foo();
// 'foo', a
// 'fuc', b
变量提升
JavaScript的函数定义有个特点，它会先扫描整个函数体的语句，把所有申明的变量“提升”到函数顶部：
'use strict';
function foo() {
var i = 'Hello, ' + j;
alert(i);
var j = 'Bob';
}
foo(); // Hello, undefined
JavaScript引擎自动提升了变量j的声明，但不会提升变量j的赋值;
因此，我们在函数内部定义变量时，请严格遵守“在函数内部优先申明所有变量”这一规则。
全局作用域
不在任何函数内定义的变量就具有全局作用域;
JavaScript实际上有一个默认（唯一一个）全局作用域 window;
全局作用域的变量实际上被绑定到window的一个属性:
'use strict';
var animal = 'White cat';
alert(animal); // 'White cat'
alert(window.animal); // 'White cat'
全局作用域有哪些需要注意的点
1、名字空间
全局变量会绑定到window上，如果再不同的js文件里定义了相同的全局变量（包括顶层函数，不在任何函数体内的变量等），都会引起冲突，而且在项目中很难被发现。为减少这种冲突，我们可以把所以的变量和函数绑定在一个全局变量中。
2、局部作用域
在for循环等语句块中是无法定义具有局部作用域的变量的：
'use strict';
function foo() {
for (var i=0; i<10; i++) {
//
}
i += 10; // 仍然可以引用变量i
}
ES6引入了新的关键字let，用let替代var可以申明一个块级作用域的变量，用来解决以上所诉问题。
3、常量
在ES6之前，我们通常用全部大写的变量来表示一个常量，ES6标准引入了新的关键字const来定义常量，const与let都具有块级作用域。
this指针
在一个方法内部，this是一个特殊变量，它始终指向当前对象。
没有绑定在对象上的函数，它的this指针指向全局对象，也就是window。
不知道设计者在设计之初是作何考虑的，ECMA想要优化这个“特性”，在strict模式下让函数的this指向undefined。但并没有根本解决this指向的问题。
因此有时我们需要用一个变量比如 that 来提前捕获this。
参考资料：廖雪峰的官方网站：https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000
网友评论