ES6——箭头函数

2024年1月17日 182次阅读 来源: weeast

箭头函数

定义

定义一个箭头函数很简单，基础语法是：


    ([param] [, param]) => {
       statements
    }
    
    param => expression

param 是参数，依据参数个数差别，分这几种状况：
() => { … } // 零个参数用 () 示意；
x => { … } // 一个参数能够省略 ()；
(x, y) => { … } // 多参数不能省略 ()；
固然，和一般函数一样，箭头函数也能够运用 ES6 新增的「默许参数」和「盈余参数」（ Firefox15+ 最先支撑）：


    var func1 = (x = 1, y = 2) => x + y;
    func1(); // 获得 3
    
    var func2 = (x, ...args) => { console.log(args) };
    func2(1,2,3); // 输出 [2, 3]

箭头函数许可多行语句或许单行表达式作为函数体。多行语句要用 {} 括起来；单行表达式不需要 {}，并且会作为函数返回值：


    x => { return x * x }; // 函数返回 x * x
    x => x * x; // 同上一行
    x => return x * x; // SyntaxError 报错，不能省略 {}
    x => { x * x }; // 正当，没有定义返回值，返回 undefined

箭头函数也是 JS 函数的一种，所以之前的 instanceof 和 typeof 依旧可用：


    var func1 = () => {};
    func1 instanceof Function; // true
    
    var func2 = () => {};
    typeof func2; // "function"

特征

箭头函数内部没有 constructor 要领，也没有 prototype，所以不支撑 new 操纵。new (() => {}) 会触发 TypeError 报错。

new (() => {}) // Uncaught TypeError: () => {} is not a constructor(…)

箭头函数没有本身内部的 this 指针。在箭头函数中， this 指针是继续于其地点的作用域。(个人理解为箭头函数不具备函数作用域，相当于表达式，this即为箭头函数被调用时外层的this)


    var a = 1;
    var test = {
        a: 100,
        c: function(){
            console.log(this.a); 
        },
        d: ()=>{console.log(this.a)} 
    }
    test.c();//100
    test.d();//1
    原文作者：weeast
    原文地址: https://segmentfault.com/a/1190000004470909
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞