無法理解React語法

Question

我想了解React & Redux更好。最近我已經使用這裏的例子：https://github.com/reactjs/redux/blob/master/examples/shopping-cart/src/reducers/products.js
我有困難把持這些行： ... action.products.reduce（（OBJ，產品）=> { OBJ [product.id] =產品 返回物鏡 }，{}）

和的[ProductID]：產品（州的[ProductID]，動作）

有人能解釋發生了什麼嗎？

const byId = (state = {}, action) => { 
    switch (action.type) { 
    case RECEIVE_PRODUCTS: 
     return { 
     ...state, 
     ...action.products.reduce((obj, product) => { 
      obj[product.id] = product 
      return obj 
     }, {}) 
     } 
    default: 
     const { productId } = action 
     if (productId) { 
     return { 
      ...state, 
      [productId]: products(state[productId], action) 
     } 
     } 
     return state 
    } 

Answer 1

你的問題是評價人不清楚，但我會盡力回答我的最佳能力。 ...（三個點）被稱爲spread operator，它是將對象（或數組）合併到另一個對象（或數組）中的一種方法。這裏有一個例子：

const objA = { 
    field_1: "my value", 
    field_2: "my other value" 
}; 
const newObject = { 
    ...objA, 
    field_3: "my third value" 
}; 
console.log(newObject); // { 
         // field_1: "my value", 
         // field_2: "my other value", 
         // field_3: "my third value" 
         // } 

這基本上等同於以下內容：

const objA = { 
    field_1: "my value", 
    field_2: "my other value" 
}; 
const newObject = Object.assign({}, objA, { field_3: "my third value" }); 

還有很多更給它比我的例子，所以請參考相關文檔。

[productId]: products(state[productId], action)是一種使用變量作爲對象鍵的方法。這大致相當於：

let objA = { 
    field_1: "my value", 
}; 
const myKey = "field_2"; 
objA[myKey] = "my other value"; 

從技術上講，它不是React語法，而是評估者ES6-7語法。