ES6中函数的扩展

函数参数

// 参数默认值
    function fn(x="matrix", y="ES6") {
        console.log(x,y)
    }
    fn(0);

    // 参数使用结构赋值
    function fn1({name="matrix",age=100}={}) {
        console.log(name,age)
    }
    fn1();
    function fn1({name,age}={name:"matrix",age:100}) {
        console.log(name,age)
    }
    fn1();


    // length 属性,当前形参的个数,如果形参有默认值的情况length就是失真， length 是没有默认值的个数
    function fn2(x,y) {

    }
    fn2(1,2);
    console.log(fn2.length);
    
    
    // 参数默认值的位置：一般参数的默认值放在最后面
    function fn3(x=10, y=20) {
        
    }
    // fn3(,1) 会报错

    // arguments 类数组
    function fn4(...arg) {
        console.log(arguments);
        console.log(arg);
    }
    fn4(1,2,3,4,5);

    // 参数作用域的问题
    // 函数执行时候先给形参赋值，形参也是私有变量，如果给形参的默认值是 一个变量，先看是不是自己的私有变量，不是自己的在找全局中是否有这个变量，没有就报错
    // let x=10, y=100;
    // function fn5(x=x,y=y) {
    //     console.log(x);
    //     console.log(y);
    //     let x="matrix";
    //     let y="ES6";
    // }
    // fn5(1); //Identifier 'x' has already been declared

    let m=10, n=100;
    function fn5(x=m,y=n) {
        // 私有作用域：私有变量x,y,m,n
        console.log(x);
        console.log(y);
        let m="matrix";
        let n="ES6";
    }
    fn5(1); // 1 100

    let x=100;
    function fn6(x, y = x) {
        // x=1,y=x=1
        console.log(y);
    }
    fn6(1);

函数name问题

    function fn() {}
    console.log(fn.name); // fn
    console.log((function () {}).name); //  ""

    // 特殊情况
    // 1.通过bind方法得到一个新的额函数 name是 “bound 原来函数的名字”
    let fn1 = fn.bind(null);
    console.log(fn1.name);// bound fn

    // 2.通过构造函数创建一个函数 名字都叫做 "anonymous"

    // new Function("形参","函数体");
    // new Function("函数体");
    // function fn(形参) {函数体}
    let fn2 = new Function("x,y","console.log(x,y); return x+y");
    console.log(fn2(10,100));
    console.log(fn2.name); // anonymous

    // 面试题
    let str = '[{"name":"matrix"},{"age":100}]';
    // let arr = (new Function())();
    // 需要最后arr =>[{"name":"matrix"},{"age":100}]

    let arr = (new Function("return "+str))();
    console.log(arr);

扩展运算符

    // 扩展数组运算符 ...
    // 将非数组编程数组

    let str = "123";
    console.log([...str]);
    function fn() {
        console.log(...arguments);
    }
    fn(1,23,445);

    // 合并数组
    let arr1 = [1,2,3,4];
    let arr2 = [10,20,30,40];
    console.log(arr1.concat(arr2));
    console.log([...arr1, ...arr2]);

    // 求数组的最大值
    let ary = [10,20,30,40,1221];
    console.log(Math.max.apply(null, ary));
    console.log(Math.max(...ary));

箭头函数

箭头函数是匿名函数

    // let fn=(形参)=>{函数体}

    // 形参只有一个时候 可以省略()
    // 函数体只有一行代码 return  可以省略{}和return
    let fn = x => x+1;
    // let fn = x => {return x+1;};
    // 通常函数当做参数的时候使用箭头函数
    let ary = ["matrix",1,2,3];
    console.log(ary.filter(item => typeof item == "number")); // [1, 2, 3]
    // 注意箭头函数的几个特点
    // 1.箭头函数没有this指向，里面的this是上一级作用域下的this
    // 2.箭头函数没有arguments

    let f1=(...arg)=>{
        // console.log(arguments); // arguments is not defined
        console.log(arg); // [1, 2, 3, 4]
    };
    f1(1,2,3,4);

    // 3.箭头函数不可以用作构造函数 因为不可以使用new执行
    function FF() {}
    new FF;
    let F=()=>{};
    console.log(new F); //  F is not a constructor