Какова цель этого массива после возвращенного объекта?

Question

Может ли кто-нибудь описать назначение [this.props.currency], размещенного после возвращаемого объекта, или места, которое я могу прочитать об этом шаблоне, поскольку я не видел его раньше.

Я не спрашиваю, что такое this.props.currency, а скорее его цель после возвращаемого объекта.

При просмотре в этом блоге: https://javascriptplayground.com/react-extracting-logic/

export const getCurrencyData = currency => {
    return {
        GBP: { base: 100, symbol: '£' },
        USD: { base: 100, symbol: '$' },
      }[this.props.currency];
    };

Answer 1

Все, что он делает, это получает значение свойства с ключом this.props.currency - поэтому, если currency равно "GBP", возвращаемое значение равно { base: 100, symbol: "£" }. Вы можете написать это так, чтобы было понятнее:

export const getCurrencyData = currency => {
    const obj = {
        GBP: { base: 100, symbol: '£' },
        USD: { base: 100, symbol: '$' }
      };
      return obj[this.props.currency];
};

Вы также можете воспользоваться функцией явного возврата с функциями стрелок для удаления ключевого слова return:

export const getCurrencyData = currency => ({
    GBP: { base: 100, symbol: '£' },
    USD: { base: 100, symbol: '$' },
}[this.props.currency]);

Answer 2

Валюта является ключом той части объекта, которую вы ищете.

Вы можете переписать это как:

function getCurrencyData(currency) {
  const allAvailableData = {
    GBP: { base: 100, symbol: '£' },
    USD: { base: 100, symbol: '$' },
  }

  return allAvailableData[currency]
}

console.log(getCurrencyData('GBP'))
// { base: 100, symbol: '£' }
console.log(getCurrencyData('USD'))
// { base: 100, symbol: '$' }