初心者向け：length の基本
length は「長さ（要素数や文字数）」を表すプロパティです。配列や文字列でよく使います。読み取り専用で、基本的に数値を返します。
文字列の length（文字数）
const str = "JavaScript";
console.log(str.length); // 10
console.log(str[0]); // "J"（インデックスは0始まり）
- ポイント: 改行や空白も「1文字」として数えます。
- 絵文字の注意: 見た目1文字でも length が 2 になることがあります（ユニコードの仕組み）。
const emoji = "😊";
console.log(emoji.length); // 2
- 対策（文字単位で数えたいとき）:
console.log(Array.from("😊a").length); // 2（見た目の文字数）
配列の length（要素数）
const nums = [10, 20, 30];
console.log(nums.length); // 3
- 0始まりのインデックス: 最後の要素は
nums[nums.length - 1]。
console.log(nums[nums.length - 1]); // 30
- length は書き換え可能（配列のサイズ操作）:
const arr = [1, 2, 3, 4];
arr.length = 2; // 末尾を切る → [1, 2]
arr.length = 5; // 末尾に空要素ができる → [1, 2, <3 empty items>]
- 要素の追加で length が増える（push など）:
const fruits = ["apple"];
fruits.push("banana");
console.log(fruits.length); // 2
- インデックスを飛ばすと“穴”ができる（length は最大インデックス+1）:
const a = [];
a[3] = "x"; // 0〜2は空
console.log(a.length); // 4（穴を含む長さ）
length と size の違い（よく混同する）
- 配列・文字列: length
- Map / Set: size
const set = new Set([1, 2, 2]);
console.log(set.size); // 2（重複は除外）
よくあるつまずきと注意点
- Label: 文字列は不変。length を増減しても文字列が変わることはない（そもそも書き換え不可）。
- Label: 配列の length を直接短くすると「破壊的」な変更。元の要素は消える。
- Label: “穴”がある配列は扱いにくい。
pushを使うと安全。 - Label: ループは length を使って範囲を決めると定番で書ける。
const arr = [1, 2, 3];
for (let i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
実用パターン
- 最後の要素を取り出す:
const items = ["a", "b", "c"];
const last = items[items.length - 1]; // "c"
- 空配列・空文字列のチェック:
const list = [];
if (list.length === 0) console.log("空です");
const s = "";
if (s.length === 0) console.log("空文字です");
- 固定長の配列を作る（後で埋める）:
const buf = new Array(3); // [ <3 empty items> ]
buf.fill(0); // [0, 0, 0]
- 見た目の文字数を数えたい（絵文字対応）:
const text = "😊abc";
const count = Array.from(text).length; // 4
ミニ練習
- 問1: 配列の最後の値を安全に取得して表示せよ。
const arr = [5, 7, 9];
const last = arr.length ? arr[arr.length - 1] : undefined;
console.log(last); // 9
- 問2: 配列の長さを2にして短くし、結果を確認せよ。
const a = [1, 2, 3, 4];
a.length = 2;
console.log(a); // [1, 2]
- 問3: 文字列 “Hello\nWorld” の文字数は？
const s = "Hello\nWorld";
console.log(s.length); // 11（改行も1文字）
- 問4: 絵文字を含む文字列の「見た目の文字数」を数えよ。
const s = "😊a";
console.log(Array.from(s).length); // 2
まとめ
- length は文字列の文字数、配列の要素数を返す基本プロパティ。
- 配列の length は書き換え可能でサイズ操作に使えるが、破壊的なので注意。
- 絵文字などは length と見た目の文字数がずれることがある。必要なら Array.from を使う。
- Map/Set は length ではなく size。用途に応じて正しいプロパティを使う。