ES6笔记01：函数之默认值、剩余参数，以及拓展运算符

1.带参数默认值的函数：

🌟ES5带默认值的函数写法

function add(a, b) {
      a = a || 10;
      b = b || 20;
      return a + b;
  }
 console.log(add()); // 30

🌟🌟ES6中带默认值参数的函数的写法

 function add(a, b = 20) {
     return a + b;
 }
 console.log(add(30)); //50

🌟🌟🌟ES6中函数参数支持函数表达式

 function add(a, b = getVal(5)) {
     return a + b;
 }

 function getVal(val) {
     return val + 5;
 }
 console.log(add(10));

2.剩余参数

🤖预定义场景：想要遍历出一个对象的里面的定义的属性

🌟ES5中实现的方法如下：

         //定义的一个book对象
        let book = {
             title:'es6的教程',
             author:'小马哥',
             year:2019
         }
         
         function pick(obj) {
             let result = Object.create(null);
             for(let i = 1;i < arguments.length;i++){
                 result[arguments[i]] = obj[arguments[i]]
             }
             return result;
         }

         let bookData = pick(book,'title','year','author');
         console.log(bookData);  //{title: "es6的教程", year: 2019, author: "小马哥"}

• Object.create(null)--这里是个知识点
  • Object.cerate() 必须接收一个对象参数，创建的新对象的原型指向接收的参数对象，可以通过**Object.create(null) 创建一个干净的对象，也就是没有原型。 而 new Object() 创建的对象是 Object的实例，原型永远指向Object.prototype.
• 函数内部通过arguments可以获得函数的实参（箭头函数除外）

🌟🌟ES6剩余参数的解决办法：

        let book = {
            title: 'es6的教程',
            author: '小马哥',
            year: 2019
        }
        
        function pick(obj, ...keys) {
            // ...keys 解决了arguments 的问题
            let result = Object.create(null);
            for (let i = 0; i < keys.length; i++) {
                result[keys[i]] = obj[keys[i]];
            }
            return result;
        }

       let bookData = pick(book, 'year', 'author');
        console.log(bookData);//{year: 2019, author: "小马哥"}

        function checkArgs(...args) {
            console.log(args);       //["a", "b", "c"]
            console.log(arguments);  //Arguments(3) ["a", "b", "c", callee: (...), Symbol(Symbol.iterator): ƒ]  
        }
        checkArgs('a', 'b', 'c');

• 剩余参数：由三个点...和一个紧跟着的具名参数指定 ...keys，把多个独立的合并到一个数组中，这里的重点是---🌵数组~！是数组~！！是数组~！！！
• arguments获得的是类数组，而不是真实是的数组

3.拓展操作符

• 剩余运算符：把多个独立的合并到一个数组中
• 扩展运算法：将一个数组分割，并将各个项作为分离的参数传给函数

        const maxNum = Math.max(20,30);
        console.log(maxNum);  //30

        //处理数组中的最大值，使用apply
        const arr = [10, 20, 50, 30, 90, 100, 40];
        console.log(Math.max.apply(null,arr)); //100

        // es6 扩展运算法更方便
        console.log(Math.max(...arr));//100