核心提示:1. 为函数参数指定默认值在ES5中有这种情况function fn(a, b){a = a || 10;b = b || 20;console.log(a + b);}fn();//30fn(0, ...
1. 为函数参数指定默认值
在ES5中有这种情况 function fn(a, b){ a = a || 10; b = b || 20; console.log(a + b); } fn();//30 fn(0, 10);//20因为a=0,所以将10赋给它
在ES6中
function fn(a = 10, b = 20){ console.log(a + b); } fn();//30 fn(0, 10);//10
2. 函数的 rest 参数
rest 参数形式为(“…变量名”),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。
在ES5中
function sum(){ var args = arguments; var res = 0; for(var i=0; iES6中,不提倡使用arguments对象
function sum(...arr){ var res = 0; for(var i=0; i3. 使用“箭头”(=>)定义函数。
1) 认识箭头函数
const fn = a => a; //相当于 const fn2 = function (a){ return a; }; console.log(fn(1));//1 console.log(fn2(2));//22) 箭头函数的其他语法
一般情况const fn = (a, b) => a + b; console.log(fn(1, 2));//3表达式
const fn = (a, b) => { a = a * 2; b = b * 2; return a + b; }; console.log(fn(1, 2));//3对象
const fn = (a, b) => ({a, b}); console.log(fn(1, 2));//{a:1,b:2}数组
//在ES5中从小到大排序 var arr = [5, 2, 3, 4, 1]; arr.sort(function (a, b){ return a - b; }); console.log(arr);//[1,2,3,4,5] arr.sort((a, b) => a - b); console.log(arr);//[1,2,3,4,5]3) 注意点
① 箭头函数体内没有自己的this对象,所以在使用的时候,其内部的this就是定义时所在环境的对象,而不是使用时所在环境的对象。function fn(){ setTimeout(function (){ console.log(this); }, 1000); setTimeout(() => { console.log(this); },1000); } var obj = {a: 1}; fn.call(obj);//分别打印出window和object以上说明不能给箭头函数使用 call apply bind 去改变其内部的this指向
② 箭头函数体内没有arguments对象,如果要用,可以用Rest参数代替。function fn(){ setTimeout(() => { console.log(arguments); }, 1000) } fn(1, 2, 3);//1,2,3 const fn = (...arr) => arr; console.log(fn(1, 2, 3, 4));//[1,2,3,4]③ 不可以当作构造函数,不可以使用new命令,否则会抛出一个错误。
const Fn = (a, b) => a + b; const f = new Fn(1, 2);//报错