ぽぴなび

知って感動した技術情報・生活情報や買ってよかったものの雑記です。

【Javascript】分割代入時に変数名を変える

Reactでカスタムフックなどを使っていると、状態を表す変数名(errorloadingなど)が同じ名前で定義されていたりします。
同じ名前の変数を分割代入で取ってくる際は、元の変数名: 変更後の変数名で取ってくることができます。

const useGetUsers = () => {
  const loading = false;
  const error = 'Failed getting users.';
  const result = [];
  const getUsers = () => {};
  
    return { getUsers, loading, error, result };
}

const useGetGroups = () => {
  const loading = false;
  const error = 'Failed getting groups.';
  const result = [];
  const getGroups = () => {};
  
    return { getGroups, loading, error, result };
}

//             元の変数名: 変更後の変数名
const { getUsers, error: errorUsers } = useGetUsers();
const { getGroups, error: errorGroups } = useGetGroups();

console.log(errorUsers);   // 'Failed getting users.'
console.log(errorGroups);  // 'Failed getting groups.'

参考

developer.mozilla.org