1.关于函数
在JS中，函数是被设计为执行特定任务的代码块，通过function关键字定义，格式为：function funName (arguments) { code }
在被调用时执行，函数可以接受参数，即在调用时可以给函数传参。
2.ES6的扩展
（1）函数参数默认值
在ES6之前，不支持给函数参数设置默认值，只能采取变通方式的方式，在函数体内给变量赋值之前判断参数是否被赋值：
function demo(x,y){
y=y||"world";
console.log(x,y);
}
demo("hello");//hello world
demo("hello","hi");//hello hi
demo("hello"," ");//hello world
//如果参数被赋予了对应的布尔值为false的值，则该赋值不起作用 ,可以在赋值之前用typeof检测
function demo1(x,y){
if (typeof y === 'undefined') {
y = 'World';
}
console.log(x,y);
}
demo1("hello");//hello world
demo1("hello","hi");//hello hi
demo1("hello"," ");//hello
- ES6允许对函数的参数设置默认值
function demo(x,y="world"){
console.log(x,y)
}
demo("hello");//hello world
demo("hello","hi");//hello hi
demo("hello"," ");//hello
- 参数变量x是默认声明的，在函数体中，不能用let或const再次声明
- 使用参数默认值时，函数不能有同名参数。
- 参数默认值是惰性求值的。
let x = 99;
function foo(p = x + 1) {
console.log(p);
}
foo() // 100
- 函数参数默认值还可以与解构赋值结合使用: 双重默认值
function demo({a="",b="b",c=""}={}){
console.log(b)
}
demo()//b
demo({a:2,b:3,c:4})//3
参数默认值的位置
一般来说，定义了默认值的参数，应该是函数的尾参数
如果非尾部的参数设置默认值，实际上这个参数是没法省略的，即无法只省略该参数而不省略其后面的参数，除非显示的传入undefined
function demo(x=1,y){
console.log([x,y])
}
demo()//[1,undefinded]
demo(,2)//报错
函数的length属性
函数length属性的含义是该函数预期传入的参数个数。 指定了默认值之后，该参数可以省略不传，所以函数的length属性只会返回没有指定默认值的参数个数，但是如果指定了默认值的参数不是尾参数，那么该参数及其之后的参数都不会计入length属性
(function(a,b,c=1){}).length//2
(function(a,b=1,c){}).length//1
(function(a=1,b,c){}).length//0
作用域
设置了参数默认值，在函数声明初始化的时候，函数的参数会形成一个单独的作用域，该作用域在初始化结束时消失。
let x = 1;
function fn(x,y=x){
console.log(y);
}
function fn1(y=x){
let x=3;
console.log(y);
}
fn();// undefined
fn(2);//2 y=x的x指向参数的x x=2,故y=x=2
fn1();//1 y=x的x指向外层的全局变量x,故y=x=1
在上面的fn()中，参数y的默认值等于变量x，调用函数fn(2)时，参数形成一个单独的作用域,在这个作用域里面，默认值变量x指向第一个参数x，而不是全局变量x，所以输出是2。若是在函数参数的作用域中未定义变量想，则会向外层作用域找变量x,所以fn1()输出的是1，此时y=x的x指向的是全局变量x
（2）rest参数
ES6 引入 rest 参数（形式为...变量名），用于获取函数的多余参数，这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。
// arguments变量的写法
function sortNumbers() {
return Array.prototype.slice.call(arguments).sort();
}
// rest参数的写法
const sortNumbers = (...numbers) => numbers.sort();
arguments对象不是数组，而是一个类似数组的对象。所以为了使用数组的方法，必须使用Array.prototype.slice.call先将其转为数组。rest 参数就不存在这个问题，它就是一个真正的数组，数组特有的方法都可以使用。
- rest 参数之后不能再有其他参数（即只能是最后一个参数），否则会报错
- 函数的length属性，不包括 rest 参数
（3）严格模式
从ES5开始，函数内就可以设定为严格模式，ES6 对此做了一点修改，即只要函数参数使用了默认值、解构赋值、或者扩展运算符，那么函数内部就不能显式设定为严格模式，否则会报错。
// 报错
function doSomething(a, b = a) {
'use strict';
// code
}
// 报错
const doSomething = function ({a, b}) {
'use strict';
// code
};
// 报错
const doSomething = (...a) => {
'use strict';
// code
};
函数内部的严格模式，同时适用于函数体和函数参数。但是，函数执行的时候，先执行函数参数，然后再执行函数体。这样就有一个不合理的地方，只有从函数体之中，才能知道参数是否应该以严格模式执行，但是参数却应该先于函数体执行。
- 解决办法
- 设定全局性的严格模式
- 把函数包在一个无参数的立即执行函数里面
（4）name属性
函数的name属性，返回该函数的函数名。此属性早就被浏览器支持，但是ES6才将其写入标准，并做了一些修改。
- 如果将一个具名函数赋值给一个变量，则 ES5 和 ES6 的name属性都返回这个具名函数原本的名字。
- 如果将一个匿名函数赋值给一个变量，ES5 的name属性，会返回空字符串，而 ES6 的name属性会返回实际的函数名。
var f = function () {};
// ES5
f.name // ""
// ES6
f.name // "f"
- Function构造函数返回的函数实例，name属性的值为anonymous
- bind返回的函数，name属性值会加上bound前缀。
function foo() {};
foo.bind({}).name // "bound foo"
(function(){}).bind({}).name // "bound "
(5)箭头函数
ES6允许使用箭头(=>)定义函数，x => x*x 等价于 function (x) { return x * x; }
箭头函数简化了对函数的定义，连{ ... }和return都省略掉了，但是当包含多条语句时就不能省略{ ... }和return，有多个参数的时候也需要把参数用()括起来
- 注意：当返回的单表达式是一个对象的时候，需要用()把该对象括起来，否则会报错，因为{ }会被解释为代码块
x => { foo: x }//报错
x => ({foo:x})
- 箭头函数另一作用：简化了回调函数
- 箭头函数可以与rest参数配合使用
function headAndTail = (head,...tail) => [head,tail]
function fun = (head,second,...tail)=>[head,second,tail];
headAndTail (1,2,3,4,5);//[1,[2,3,4,5]]
fun(1,2,3,4,5)//[1,2,[3,4,5]]
箭头函数有几个使用注意点。
（1）函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
（2）不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。
（3）不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用 rest 参数代替。
（4）不可以使用yield命令，因此箭头函数不能用作 Generator 函数。
上面四点中，第一点尤其值得注意。this对象的指向是可变的，但是在箭头函数中，它是固定的。原因是箭头函数根本没有自己的this，导致内部的this就是外层代码块的this。正是因为它没有this，所以也就不能用作构造函数。
（6）尾调用优化
尾调用
在函数的最后一步调用另一个函数
//尾调用
function f(x) {
return g(x);
}
//尾调用不一定出现在函数尾部，只要是最后一步操作即可
function f(x) {
if (x > 0) {
return m(x)//尾调用
}
return n(x);//尾调用
}
//以下三种情况并非尾调用
function f(x){
let y = g(x);
return y; // 情况一 调用函数g之后，还有赋值操作
}
function f(x){
return g(x) + 1; // 情况二 也属于调用后还有操作，即使写在一行内
}
function f(x){
g(x); // 情况三
}
//等价于
function f(x){
g(x);
return undefined;
}
尾调用优化
函数调用会在内存形成一个“调用记录”（也叫“调用帧”），保存的是函数的调用位置和内部变量等信息。
在函数A内部调用函数B，会在A的调用帧上方形成B的调用帧，以此类推，最后会形成一个“调用栈”。
尾调用是函数的最后一步操作，外层函数的调用位置、内部变量等信息不会再用到，所以可以直接用内层函数的调用帧取代外层函数。
尾调用优化，即只保留内层函数的调用帧，可节省内存。
function f() {
let m = 1;
let n = 2;
return g(m + n);
}
f();
// 等同于
function f() {
return g(3);
}
f();
// 等同于
g(3);
注意：只有不在用到外层函数的内部变量，才可以用内层函数的调用帧取代外层函数的调用帧。
function addOne(a){
var one = 1;
function inner(b){
return b + one;
}
return inner(a);
}
//内层函数inner用到了外层函数的内部变量one，不会进行尾调用优化
目前只有 Safari 浏览器支持尾调用优化，Chrome 和 Firefox 都不支持。
（7）尾递归优化
尾递归，即函数尾调用自身。
递归需要同时保存的调用帧很多，容易发生“栈溢出”，对于尾递归来说，只存在一个调用帧，永远不会“栈溢出”。
尾递归的实现往往需要改写递归函数，把所有用到的内部变量改写成函数参数，确保最后一步能调用自身
示例1：阶乘函数
//计算n的阶乘，最多需要保存n个调用记录，复杂度 O(n)
function factorial(n) {
if (n === 1) return 1;
return n * factorial(n - 1);
}
factorial(5) // 120
//尾递归实现 只保留一个调用记录，复杂度 O(1)
function factorialTail(n, total) {
if (n === 1) return total;
return factorial(n - 1, n * total);
}
factorialTail(5,1)// 120
//柯里化(currying)，即将多参数函数转换成单参数函数
function currying(fn,n){
return function(m){
return fn.call(this,m,n);
}
}
function tailFactorial(n,total){
if(n===1) return total;
return tailFactorial(n-1,n*total)
}
const factorial = currying(tailFactorial,1);
factorial(5)//120
//采用ES6函数默认值，轻松实现
function factorial(n,total=1){
if(n===1) return total;
return tailFactorial(n-1,n*total)
}
factorial(5)//120
示例2： Fibonacci 数列（1, 1, 2, 3, 5, 8, 13, 21, 34，55......）
//普通写法
function Fibonacci (n) {
if ( n <= 1 ) {return 1};
return Fibonacci(n - 1) + Fibonacci(n - 2);
}
Fibonacci(10) // 89
Fibonacci(100) // 超时
Fibonacci(500) // 超时
//尾递归优化过的 Fibonacci 数列实现
function Fibonacci2 (n , ac1 = 1 , ac2 = 1) {
if( n <= 1 ) {return ac2};
return Fibonacci2 (n - 1, ac2, ac1 + ac2);
}
Fibonacci2(100) // 573147844013817200000
Fibonacci2(1000) // 7.0330367711422765e+208
Fibonacci2(10000) // Infinity
ES6尾调用优化只在严格模式下生效，正常模式下，函数内部的arguments和caller变量可以跟踪函数的调用栈，尾调用优化时，函数调用栈会改写，会导致这两个变量失真，严格模式会禁用这两个变量。
正常模式下实现尾调用优化的方法：用“循环”代替“递归”
示例：累加函数
function sum(x,y){
if(y>0){
return sum(x+1,y-1);
}else{
return x;
}
}
sum(1.100000)//报错 超出调用栈的最大次数
蹦床函数，将递归转为循环，接受一个函数f作为参数，f执行后返回一个函数继续执行
function sum(x,y){
if(y>0){
return sum.bind(null,x+1,y-1)
}else{
return x;
}
}
真正的尾递归优化实现
//active在尾递归开始时被激活，每一轮sum返回都是undefined，而accumulated中放的是每一轮sum的参数，保证每一轮while循环可执行，后一轮参数取代前一轮参数，调用栈只有一层
function tco(f) {
var value;
var active = false;//巧妙之处
var accumulated = [];
return function accumulator() {
accumulated.push(arguments);
if (!active) {
active = true;
while (accumulated.length) {
value = f.apply(this, accumulated.shift());
}
active = false;
return value;
}
};
}
var sum = tco(function(x, y) {
if (y > 0) {
return sum(x + 1, y - 1)
}
else {
return x
}
});
sum(1, 100000)//100001
（8）尾逗号、toString()、catch命令参数省略
ES2017 允许函数的最后一个参数有尾逗号
ES2019 对函数实例的toString()方法做出了修改，toString()方法返回函数代码本身，以前会省略注释和空格。
JS 语言的try...catch结构，以前明确要求catch命令后面必须跟参数，接受try代码块抛出的错误对象。ES2019做出了改变，允许catch语句省略参数。
