最近解いていた問題でよくforEach()を使っていたので、=>の後に{}を使うから癖でやってしまった。
ここで、改めて{}についてよくある失敗例や、ルールを整理したい！
{} の扱いに関するミス！ 気づいたきっかけ（実体験）
今日もいつも通りpaizaの問題に挑戦していた！
問題概要
- 最初に整数 N（行数）が与えられる。
- N 行のデータが与えられ、各行はスペース区切りの整数のリスト。
- 各行の 最初の数字はカウント（不要な情報） で、それを除いた残りの数字をそのまま出力する。
入力例
3
1 8
2 8 1
3 8 1 3
出力例
8
8 1
8 1 3
🌋ミスったコード
const rl = require('readline').createInterface({input:process.stdin});
const lines = [];
rl.on('line',(input)=>{
lines.push(input);
});
rl.on('close',()=>{
const N = Number(lines[0]);
const nums = lines.slice(1).map(num => {num.split(' ').map(Number)});
for(let i = 0; i < N; i++){
console.log(nums[i].slice(1).join(' '))
}
});
🌋ミスったポイント
const nums = lines.slice(1).map(num => {num.split(' ').map(Number)});
-
map()内で{}を使うと、関数の戻り値がundefinedになる（{}をブロックとして扱ってしまう）。 -
.map(Number)を適用しても結果をreturnしていないため、numsの中身がundefinedになってしまう。
✅修正
map() の中で {} を使わず、=> のすぐ後ろに式を記述。
lines.slice(1).map(line => line.split(' ').map(Number))
（このコードなら、別に数値型に変換しなくても良かったかもと、今更思ったり (´;ω;｀) ）
✅ {} の意味と使い方
JavaScript では{} は 2通りの意味 で使われる。
① ブロック（制御構造）
if や forEach などの制御構造で使われる {} は ブロック（処理のグループ化） の意味。
const arr = [1, 2, 3];
arr.forEach(num => {
console.log(num * 2); // {} はブロックなので return 必須
});
これは ブロック なので、関数の結果（戻り値）は 自動で return されない。
そのため、値を返したい場合は return を明示する必要がある。
② オブジェクトリテラル
{} は オブジェクト を表すこともある。
const obj = { name: "Alice", age: 25 }; // これはオブジェクト
❌ よくある失敗例
-
map()で{}を使ってreturnしない
間違い：
const nums = [1, 2, 3];
const squared = nums.map(num => {
num * 2; // return しないので undefined
});
console.log(squared); // [undefined, undefined, undefined]
正しくは：
const squared = nums.map(num => num * 2); // `{}` を省略
console.log(squared); // [2, 4, 6]
または return を明示：
const squared = nums.map(num => { return num * 2; });
console.log(squared); // [2, 4, 6]
2.オブジェクトを返したいのに {} がブロック扱いされる
間違い：
const users = ["Alice", "Bob"];
const userObjects = users.map(name => { name: name }); // {} がブロック扱いされる
console.log(userObjects); // [undefined, undefined]
正しくは：
const userObjects = users.map(name => ({ name: name })); // `()` でオブジェクトと明示
console.log(userObjects); // [{ name: "Alice" }, { name: "Bob" }]
✅ {} を使うかどうかのルール
📌 結論
- 処理が1行なら
{}なしでreturn省略OK -
{}を使うとreturn必須 - オブジェクトを返すときは
({ key: value })の形にする
✅ ブロック ({}) とは？
ブロック とは、 1つ以上のステートメント（処理）をまとめる構造 のこと。
JavaScript では{}（波かっこ）を使ってブロックを定義する。
📝 ブロックの主な用途
- 制御構造のブロック
- 関数のブロック
- スコープのブロック
① 制御構造のブロック
if や for などの制御構造で使われる {}
if (true) { // ← ここから
console.log("This is a block!"); // ここまでがブロック
}
for (let i = 0; i < 3; i++) { // ← ここから
console.log(i); // ここまでがブロック
}
- ブロックの中に複数の処理をまとめられる
- ブロック内の変数 (
letやconst) はブロック外からアクセス不可
② 関数のブロック
関数の処理を {} で囲む
function greet(name) { // ← ここから
console.log("Hello, " + name); // ここまでがブロック
}
greet("Alice");
- 関数の処理を
{}でまとめる - 関数のローカル変数もブロック内に閉じ込められる
③ スコープのブロック
ブロックごとに変数のスコープ（範囲）が決まる
{
let x = 10; // ブロック内の変数
console.log(x); // 10
}
console.log(x); // ❌ エラー (x is not defined)
- ブロック内で
letやconstを使うと、外からアクセスできない - ブロックごとに変数のスコープが独立
❌ よくあるミス
-
ifやforのブロックを省略して意図しない動作
if (true)
console.log("Hello");
console.log("World"); // ← `if` の外なので常に実行される
正しくは：
if (true) {
console.log("Hello");
console.log("World"); // これで意図通り
}
2. {} を使ったのに return し忘れる
const double = num => { num * 2 }; // `{}` を使ったので return 必須
console.log(double(5)); // undefined
正しくは：
const double = num => { return num * 2 };
console.log(double(5)); // 10
または：
const double = num => num * 2; // `{}` を省略すれば return 不要
console.log(double(5)); // 10
✅ まとめ
- ブロック
{}は処理をまとめるために使う -
ifや for でブロックを省略するとバグの原因になる - アロー関数で
{}を使うとreturnが必要
✅ ブロック {} vs. オブジェクト {} の違い
🔹 見分け方
-
ifやfunctionの後の{}→ ブロック -
=の右側にある{}→ オブジェクト
✅ まとめ
- ブロック
{}は処理をまとめる - オブジェクト
{}はデータをまとめる - 見た目は同じでも、用途とルールが異なるので注意！
おまけ 発端のforEach()について
✅ 省略形（1行なら {} なしでもOK）
array.forEach(a => console.log(a));
→ console.log(a); だけなら {} なしで書ける
✅{} を使った書き方（1行でも使える）
array.forEach(a => { console.log(a); });
→ {} を使っても動くが、1行なら省略できる
🌋どっちでもいいけど、短く書けるなら {} なしの方がスッキリする
map() では 1行でも {} を使うと意図しない動作になる ことがある。
🔴 map() で {} を使うと undefined が返る
const arr = [1, 2, 3];
const result = arr.map(num => { num * 2 });
console.log(result); // [undefined, undefined, undefined]
理由：
-
{}を使うと、ブロック（処理のまとまり） と解釈される。 -
returnを明示しないと、値を返さない（undefinedになる）。
✅ 正しい書き方（1行なら {} を省略）
const result = arr.map(num => num * 2);
console.log(result); // [2, 4, 6]
✅ ブロックを使うなら return を書く
const result = arr.map(num => { return num * 2; });
console.log(result); // [2, 4, 6]
forEach と map の違い
-
forEach()→ 返り値なし（処理を実行するだけ） -
map()→ 配列を返す（returnが重要）
だから、
✔ forEach() は {} を使っても問題なし
✔ map() は {} を使うなら return が必要
という違いがあるんだ！