ES6之函数的扩展

基本用法

function log(x,y = 'World') {
   console.log(x,y);
}
log('hello');   //hello World
log('hello', 'china');//hello china
log('hello',''); //hello 

与解构赋值默认值结合使用

# demo1
function foo({x, y = 5}) {
    console.log(x, y);
}

foo({});    //undefined, 5
foo({x:1}); //1,5
foo({x:1,y:2});//1,2
foo();  //x of undefined

ps:foo()参数为对象,变量x和y才会通过解构赋值而产生
   foo()参数不是对象,变量x和y就不会产生,从而报错


# demo2
function foo({x = 0, y = 0} = {}) {
 return [x, y];
}

function foo1({x, y} = {x: 0, y: 0}) {
 return [x, y];
}

foo()           //[0,0];
foo1()          //[0,0]

foo({x:3,y:8})  //[3,8]
foo1({x:3,y:8}) //[3,8]

foo({x:3})      //[3,0]
foo1({x:3})     //[3,undefined]

foo({})         //[0,0]
foo1({})        //[undefined,undefined]

foo({z:3})      //[0,0]
foo1({z:3})     //[undefined,undefined]


ps: foo()参数默认值是空对象,但是设置了对向解构赋值的默认值;
    foo1()参数默认值是一个有具体属性的函数,但是没有设置对象解构赋值的默认值  

参数默认值的位置

function foo(x = 1, y) {
    return [x, y];
}

foo();  //[1,undefined]
foo(2); //[2,undefined]
foo(,1);//error
foo(undefined,1);//[1,1]
ps:有默认值的参数都不是尾参数,无法只省略该参数而不省略其后的参数,除非显示输入undefined

function foo(x=5,y=6) {
    return [x,y];
}
foo(undefined,null);//[5,null]

ps:上面代码中,x==>undefined,处罚默认值,y==>null,并不触发默认值

函数的length属性

(function(a) {}).length;        //1
(function(a=5) {}).length;      //0
(function(a,b=5) {}).length;    //1
(function(...rest) {}).length;    //0   

ps:指定默认值后,函数的length属性将返回没有设置默认值得参数的个数,也就是参数设置默认值后,length的属性失效,rest参数也不计入length属性

rest参数


# 用于获取函数的多余参数
function add(...value) {
    let sum = 0;
    for (var val of value){
        sum += val;
    }
    return sum;
}

console.log(add(2, 5, 3));          //10

# 用rest参数代替arguments变量
const sortNumber = () => Array.prototype.slice.call(arguments).sort();  //arguments写法

const sortNumbers = (...numbers) => numbers.sort();                     //rest写法


# rest参数写成数组push方法
function push(arr, ...values) {
    values.forEach(function (item) {
        arr.push(item);
        console.log(item);          
    });
}

var a = [];
push(a, 1, 2, 2, 3, 4, 5);

# rest参数之后不能再有其他参数(即他只能是最后一个参数),否则会报错
//报错
function fn(a,...items, c) {
    // ... code
}

# 函数的length属性不包括rest参数
(function (a) {}).length;       // 1
(function (...a) {}).length;    // 0
(function (a,...b) {}).length;  // 1
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章