zoukankan      html  css  js  c++  java
  • ES6的箭头函数 ( => )

    var f = v => v;
    //上面的箭头函数等同于:
    var f = function(v) {
      return v;
    };



    如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。
    var f = () => 5;
    // 等同于
    var f = function () { return 5 };
    var sum = (num1, num2) => num1 + num2;
    // 等同于
    var sum = function(num1, num2) {
      return num1 + num2;
    };



    如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用 return 语句返回。
    var sum = (num1, num2) => { return num1 + num2; }

    由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号,否则会报错。
    // 报错
    let getTempItem = id => { id: id, name: "Temp" };
    // 不报错
    let getTempItem = id => ({ id: id, name: "Temp" });



    如果箭头函数只有一行语句,且不需要返回值,可以采用下面的写法,就不用写大括号了。
    let fn = () => void doesNotReturn();



    箭头函数使得表达更加简洁。
    const isEven = n => n % 2 == 0;
    const square = n => n * n;

     


    以上摘自阮一峰的《ES6标准入门一书》,下面再来一个具体例子:

    export default connect ( state =>({
                  items : state.items,
                  selectedItems :state.selectedItems }),
                  
                  dispatch => ({ actions: bindActionCreators(ItemsActions, dispatch)}))(App)

    上面这段代码虽然简洁,但咋一看上去不好理解,等同于如下的形式

    let data = function getData(state){
        return {
                  items : state.items,
                  selectedItems :state.selectedItems }
    }
    
    let action = function getAction(dispatch){
         return {actions: bindActionCreators(ItemsActions, dispatch)}
    }
    
    
    export default connect ( data , action)(App)
  • 相关阅读:
    [atAGC052D]Equal LIS
    [atAGC052C]Nondivisible Prefix Sums
    [atAGC052B]Tree Edges XOR
    [gym103055H]Grammy and HearthStone
    Vector底层结构和源码剖析
    ArrayList的底层源码分析及注意事项
    Collection接口
    集合介绍
    用户管理底层实现
    什么是Mybatis
  • 原文地址:https://www.cnblogs.com/hzhuxin/p/9877991.html
Copyright © 2011-2022 走看看