如何避免破壞格局

Question

我注意到我傾向於在分解並返回帶有值的對象時執行以下結構。

const { isLoading, fieldValues, stage } = state.personalInformation
return {
  isLoading,
  fieldValues,
  stage,
};

僅使用三個參數就可以了，但是當我需要傳遞很多參數時，它很快就會變得討厭。

如果不進行破壞，它會顯得過於冗長。

return {
  isLoading: state.personalInformation.isLoading,
  fieldValues: state.personalInformation.fieldValues,
  stage: state.personalInformation.stage,
};

有辦法避免這種情況嗎？

Answer 1

如果目標是避免重復屬性名稱，那么現在唯一的方法就是給自己一個可重用的輔助函數，類似於以下內容：

function grab(obj, ...props) {
  const result = {};
  props.forEach(prop => result[prop] = obj[prop]);
  return result;
}

用法：

return grab(state.personalInformation, "isLoading", "fieldValues", "stage");

例：

 var state = { personalInformation: { isLoading: true, fieldValues: "bar", stage: 14, other: "something" } }; function grab(obj, ...props) { const result = {}; props.forEach(prop => result[prop] = obj[prop]); return result; } function foo() { return grab(state.personalInformation, "isLoading", "fieldValues", "stage"); } console.log(foo()); 

（但是有18種不同的方法來旋轉該grab功能，這只是一種方法。）

您還可以擁有一個grabAllBut ，它會復制除列出的屬性外的所有屬性，以grabAllBut 。