Naughty1029のブログ

エンジニアリングのこととか、日々の学びとか

あなたのJavaScriptコードをシンプルにする:let、if、constの理解と活用

「letが多くなるとifが多くなる。そうするとコードが複雑になっていく傾向がある」

先日、JavaScriptを書いていたら、先輩からこんなレビューをもらいました。
最初はいまいちピンときませんでしたが、自分なりに、その意味を考え、まとめてみました。

ということで、JavaScriptの基本的な構文であるlet、if、そしてconstの使用について、わたし自身の学びと考えを共有します。

それでは、まずはなぜletとifが多くなるのか、そしてそれがどのようにコードの複雑さに繋がるのかから話を始めます。

なぜletとifが多くなるのか?

まず、なぜ多くの初心者がletとifを多用するのでしょうか?
それは、状況に応じて変数の値を変えるためや、特定の条件下で何かを行うためによく使われます。

例えば次のようなコードを考えてみます。

let temperature = 22;
let weather = "";

if (temperature > 30) {
  weather = "暑い";
} else if (temperature > 20) {
  weather = "適温";
} else {
  weather = "寒い";
}

console.log(weather);

ここで、letとifはそれぞれ2つずつ使用されています。
これはあくまで一例ですが、このようなパターンは非常に一般的だと思います。

constの利用

一方、constは定数を宣言するときに使います。
これは、一度値が設定されると変更できない変数です。

しかし、constを適切に利用することで、letとifの数を減らし、コードをシンプルにすることができます。

同じ機能を持つ先ほどのコードをconstを使って書き換えてみます。

const temperature = 22;
const weather = temperature > 30 ? "暑い" : temperature > 20 ? "適温" : "寒い";

console.log(weather);

ここではconstと三項演算子(条件演算子)を使っています。
三項演算子(条件演算子)はif-else文のより短いバージョンのようなもので

条件 ? 真の場合の値 : 偽の場合の値

という形で書くことができます。

letとifを使うよりもかなりシンプルになったように思います。

constのメリット

constで宣言された変数は、一度設定されるとその後は変更することができません。
この性質によってどんなメリットがあるのでしょうか?

  • 予測可能性: 一度設定された値が変わらないため、プログラムがどのように動作するかを理解しやすくなります。これは特に大規模なプロジェクトや複数人での開発で有利です。

  • バグの防止: 変数の値が意図せず変更されることによるバグを防ぐことができます。

  • 可読性: 一度設定した値が再び変更されないことで、他の開発者がコードを読んで理解するのが容易になります。

constを使った配列の操作

さて、次に配列に関する例を考えてみます。

以下のコードでは、配列内の特定の条件を満たす要素を新しい配列に追加します。

let numbers = [1, 2, 3, 4, 5];
let evenNumbers = [];

for(let i = 0; i < numbers.length; i++) {
  if(numbers[i] % 2 === 0) {
      evenNumbers.push(numbers[i]);
  }
}

console.log(evenNumbers);

上記コードについては実はletをconstにしても動作はしますが、冗長な感じが否めません。

このコードをconstと配列のメソッドfilterを使って書き換えてみます。

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(number => number % 2 === 0);

console.log(evenNumbers);

ここではfilterメソッドを使用しています。

これは配列の各要素に対してテスト関数を実行し、その結果がtrueとなる要素からなる新しい配列を生成します。

このように書くことで、letとifの使用がなくなり、さらに簡潔になりました。

まとめ

プログラミング初心者がJavaScriptを書く際、状況に応じて変数の値を変更したり、特定の条件で何かを実行したりするために、letとifを多用することがよくあります。

しかし、constと条件演算子や配列のメソッドを適切に使用することで、コードをよりシンプルで簡潔にでき、保守も容易になります。

また、constの使用はコードの予測可能性を高め、意図せずに変数の値が変更されるバグを防ぎ、可読性を高めることがわかりました。
今後もJavaScriptの学習を続ける上で、let、if、constなどの基本的な構文の理解と使い分けを意識していこうと思います。