小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
路难行,行路难,一身汗水,满心长。脚下百里路,头顶艳阳天。坚定如磐石,信念似火烧。好男儿,人穷志不缺,天道也酬勤。四方走,走四方,一身是胆,豪气壮。前方坎坷途,千难万般阻。心若有明灯,身似般若行。好男儿,大志存高远,四海皆为家。
函数参数指定默认值
ECMAScript 5的标准中是不允许对函数的参数设置其默认值的。如果定义了形参,而不传递实参时,导致形参的值为undefined。
当然,也可以通过变通的方式来实现默认值的功能。
function fn(arg){
arg = arg || 0;
console.log(arg);// 0
}
fn();
ECMAScript 6的标准新增了对函数的参数设置其默认值的内容。
function fn(arg = 0}{
console.log(arg);//0
}
fn();
与解耦赋值配合使用
函数的参数同样可以通过解耦赋值进行操作,而解耦赋值也具有默认值的功能。两者可以结合在一起使用。
function fn([a, b = O]){
console.log(a, b);// 10
}
fn([1]);
函数参数的作用域
如果为函数的参数设置默认值的话,当函数声明进行初始化时,参数会形成一个独立的作用域。这个作用域会在函数初始化完毕时消失。
let x =1;
function f(y = x){
let x= 2;
console.log(y);
}
f();//1
rest参数
ECMAScript 6新增了 rest 参数(…变量名),用于获取函数多余的参数,替代 argurnents 对象。与 rest 参数配合的变量是一个数组,该变量将多余的参数放入数组中。
function add(...values){
let sum = 0;
for (var val of values){
sum += val;
return sum;
}
}
console.log(add(2,5.3);//10
值得注意的是:
- rest 参数之后不能再有其他参数(即只能是最后一个参数),否则会报错。
- 函数的 length 属性,不包含 rest 参数。
箭头函数是什么
ECMAScript 6新增了箭头函数(又称胖箭头函数),相比函数表达式具有较短的语法井以词法的方式绑定 this。箭头函数总是匿名的。
var f=()=> 5;
//等同于
var f = function () { return 5 };
var sum = (num1, num2) =>num1 + num2;
//等同于
var sum = function(num1, num2){
return num1 + num2;
};
有两个因素会影响引人箭头函数:更简洁的函数和 this。
箭头函数的语法结构
基本语法结构
(参数1,参数2,...,参数N)=>{函数声明}
(参数1,参数2,.....参数N)=>表达式(单一)
//相当于:(参数1,参数2,.....参数N)=>{return表达式;}
//当只有一个参数时,圆括号是可选的:
(单一参数)=>{函数声明}
单一参数=>{函数声明}
//没有参数的函数应该写成一对圆括号。
()=>{函数声明}
高级语法结构
//支持剩余参数和默认参数
(参数1,参数2, ...rest)=>{函数声明}
(参数1=默认值1,参数2,...,参数N=默认值N)=>{函数声明}
箭头函数的注意事项
使用箭头函数时,需要注意以下几点:
- 函数体内的 this,就是定义时所在的对象,而不是使用时所在的对象。
function foo(){
setTimeout(()=>{
console.log("id:", this.id);
},100);
}
var id = 21;
foo.call({ id: 42 });// id: 42
- 不可以当作构造函数。也就是说不可以使用 new 命令,否则会抛出一个错误。
- 不可以使用 argurments 对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。