テックコード -web関連の情報サイト- 
JavaScriptの練習問題を5つご紹介します。これらの問題は、基本的な構文やロジックを練習するのに役立ちます。問題に対する答えは最後に紹介しますので、まずは自分で挑戦してみてください。その後、解答と詳細な解説を確認し、理解を深めていきましょう。
JavaScript 練習問題 1: 数字の逆順
問題の説明:
この問題では、ユーザーが入力した数字を逆順に並び替える関数を作成します。例えば、ユーザーが 12345 を入力した場合、この関数は 54321 を返す必要があります。数字を扱う際の基本的な操作を理解し、数字を文字列に変換して操作する方法を学ぶことができます。
ポイント:
- 数字を文字列に変換して操作する
- 配列操作 (
split,reverse,join) を活用する - 逆順にした文字列を再び数値に変換する
JavaScript 練習問題 2: 回文チェック
問題の説明:
回文とは、前から読んでも後ろから読んでも同じ文字列のことを指します。この問題では、与えられた文字列が回文かどうかをチェックする関数を作成します。例えば、"madam" は回文ですが、"hello" は回文ではありません。入力の際に大文字小文字や空白、記号などを無視し、文字列そのものの対称性だけを評価します。
ポイント:
- 文字列のクレンジング（小文字変換、不要な文字の削除）
- 文字列を逆順にして比較する
- 正規表現を使ってアルファベットや数字以外の文字を削除する
JavaScript 練習問題 3: フィボナッチ数列
問題の説明:
フィボナッチ数列は、0と1から始まり、次の数が前の2つの数の和になる数列です。具体的には 0, 1, 1, 2, 3, 5, 8, 13, ... と続きます。この問題では、n番目のフィボナッチ数を求める関数を作成します。この問題を通じて、再帰関数や基本的な数学的アルゴリズムを理解することができます。
ポイント:
- 再帰関数を用いた計算
- 基本的な数学的アルゴリズムの理解
- 処理の効率化を考慮する
JavaScript 練習問題 4: 配列内の最大値を見つける
問題の説明:
与えられた配列から最大値を見つける関数を作成します。この問題は、配列操作や組み込み関数の使い方に慣れるのに役立ちます。配列には数値が格納されており、ユーザーはこの配列の中で最大の値を見つける必要があります。
ポイント:
- 配列操作に慣れる
- 組み込み関数
Math.max()の活用 - スプレッド構文を使った配列の展開
JavaScript 練習問題 5: 文字列の各単語を逆順にする
問題の説明:
この問題では、与えられた文字列内の各単語を逆順にする関数を作成します。例えば、"Hello World" を入力すると、出力は "olleH dlroW" になります。これにより、文字列操作や配列の基本操作を練習することができます。
ポイント:
- 文字列を分割し、各単語を配列に変換
- 配列操作 (
map,reverse,join) の活用 - 逆順にした単語を結合して再び文字列に戻す
解答と解説
問題 1: 数字の逆順
functionreverseNumber(num) {
let reversed = num.toString().split('').reverse().join('');
returnparseInt(reversed);
}
console.log(reverseNumber(12345)); // 54321解説: この関数では、まず数字を文字列に変換し、それを split メソッドで一文字ずつの配列に変換します。次に、reverse メソッドを使って配列を逆順にし、join メソッドで再び文字列に変換します。最後に、parseInt を使って文字列を数値に戻して返します。
問題 2: 回文チェック
functionisPalindrome(str) {
let cleanedStr = str.toLowerCase().replace(/[^a-z0-9]/g, '');
let reversedStr = cleanedStr.split('').reverse().join('');
return cleanedStr === reversedStr;
}
console.log(isPalindrome("madam")); // trueconsole.log(isPalindrome("hello")); // false解説: 文字列を小文字に変換し、正規表現を使ってアルファベットや数字以外の文字を削除します。次に、文字列を逆順にして、元の文字列と比較します。一致すれば回文であり、true を返します。
問題 3: フィボナッチ数列
functionfibonacci(n) {
if (n <= 1) return n;
returnfibonacci(n - 1) + fibonacci(n - 2);
}
console.log(fibonacci(7)); // 13解説: 再帰関数を使って、n番目のフィボナッチ数を計算します。nが1以下の場合、そのままnを返し、それ以外の場合は再帰的に n-1 番目と n-2 番目のフィボナッチ数を計算してその和を返します。
問題 4: 配列内の最大値を見つける
functionfindMax(arr) {
returnMath.max(...arr);
}
console.log(findMax([10, 20, 30, 40, 50])); // 50解説: この関数は、Math.max() を使って配列内の最大値を見つけます。スプレッド構文 ... を使って配列を展開し、Math.max() に渡すことで、配列内で最大の値を取得します。
問題 5: 文字列の各単語を逆順にする
functionreverseWords(str) {
return str.split(' ').map(word => word.split('').reverse().join('')).join(' ');
}
console.log(reverseWords("Hello World")); // "olleH dlroW"解説: まず、split メソッドを使って文字列を単語ごとの配列に分解します。次に、map メソッドを使って各単語を逆順にし、最後に join メソッドで再び単語を結合して文字列に戻します。
総括
これらの問題を通じて、JavaScriptの基本的な操作やアルゴリズムに対する理解を深めることができます。問題に取り組む際には、異なるアプローチも試し、自分自身の理解を深めるとよいでしょう。また、解答を見た後でも、再度自分で実装してみることをお勧めします。これにより、学んだことを確実に身につけることができます。
