if語句如何重構較長的else？

Question

我的代碼段達到了循環極限，試圖考慮一種重構方法。

if(item.oldLabelType === 'Fruits') {
  item.newLabel = this._processFruitsLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Vegetables') {
  item.newLabel = this._processVegetablesLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Animals') {
  item.newLabel = this._processAnimalsLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Fish') {
  item.newLabel = this._processFishLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Birds') {
  item.newLabel = this._processBirdsLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Colors') {
  item.newLabel = this._processColorsLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Countries') {
  item.newLabel = this._processCountriesLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Drinks') {
  item.newLabel = this._processDrinksLabel(item.oldLabel);
}
else if(item.oldLabelType === 'Cars' || item.oldLabelType === 'Airplanes') {
  item.newLabel = this._processTransportationLabel(item.oldLabel);
}

提要-我正在重構代碼庫，后端返回不想要的值，即舊標簽可能是“僅$ 1000”，新標簽需要“今天只付$ 1000”。 標簽操作完全不同，具體取決於發送回的item.oldLabelType。 因此，我無法真正編寫一個將所有舊標簽轉換為新標簽的“一刀切”功能。

該怎么辦！？

Answer 1

通常的答案是：

1. 使用switch （但這並沒有多大改善，或者說完全沒有改善）
2. 使用查找Map或對象
3. 使用字符串串聯和方括號表示法

這是第三個人的樣子：

var functionName = item.oldLabelType === 'Cars' || item.oldLabelType === 'Airplanes'
    ? "_processTransportationLabel"
    : "_process" + item.oldLabelType + "Label";
if (this[functionName]) {
    item.newLabel = this[functionName](item.oldLabel);
}

Answer 2

如果您要調用的大多數函數只是彼此的重復，並且根據標簽類型在名稱上稍有變化，則可以創建正確的函數名稱以進行即時調用。 如果任何函數名稱都包含許多標簽類型，則可以使用switch語句指定組函數名稱。

if (item.oldLabelType) {
   let olt = item.oldLabelType;
   switch (olt) {
     case "Airplane":
     case "Car":
       olt = "Traffic"
       break;
   }
   let func = "_process" + olt + "Label";
   item.newLabel = this[func](item.oldLabel);
 }

Answer 3

由於函數是JavaScript中的一等公民，因此我們可以執行以下操作：

var labelMapping = {
  Fruits: this._processFruitsLabel,
  Vegetables: this._processVegetablesLabel,
  Animals: this._processAnimalsLabel,
  Fish: this._processFishLabel,
  Birds: this._processBirdsLabel,
  Colors: this._processColorsLabel,
  Countries: this._processCountriesLabel,
  Drinks: this._processDrinksLabel,
  Cars: this._processTransportationLabel,
  Airplanes: this._processTransportationLabel
};

var processFn = labelMapping[item.oldLabelType];

if (typeof processFn === 'function') {
  item.newLabel = processFn(item.oldLabel);
} else {
  // Handle when we can't find the process function.
}

一個需要注意的是，如果你使用this的各種處理功能里面，那么你就需要確保他們得到調用正確this背景下。

有兩種方法可以做到這一點：

1. .bind提前.bind功能

Fruits: this._processFruitsLabel.bind(this),

2. 使用.call並傳入當前this

item.newLabel = processFn.call(this, item.oldLabel);

---

Answer 4

像這樣開始，將一個對象構造為映射到正確的函數：

var targetFunctionMap = {
    "Fruits": this._processFruitsLabel,
    "Vegetables": this._processVegetablesLabel,
    "Animals": this._processAnimalsLabel
    .............
    .............
    .............
    "Cars": this._processTransportationLabel,
    "Airplanes": this._processTransportationLabel
}

然后從那里調用

item.newLabel = targetFunctionMap[item.oldLabelType].call(this);