タイトル JavaScriptのlengthプロパティ徹底解説！文字列や配列の長さを取得するテクニック

JavaScriptでプログラミングをする際、文字列や配列の長さを知りたくなることがよくあります。そんなときに大活躍するのがlengthプロパティです。

lengthプロパティを使いこなせば、文字数のチェックや配列の要素数に応じた処理など、様々な場面で効果を発揮します。

しかし、lengthの使い方には少し癖があり、うっかりすると思わぬ落とし穴にハマってしまうことも。

そこで本記事では、JavaScriptのlengthプロパティについて基本からしっかり解説していきます。コードサンプルを交えて分かりやすく説明するので、初心者の方も安心してください。

これを読み終えれば、lengthプロパティの使い方が身につき、JavaScriptのスキルがグンとアップするはずです！それでは早速みていきましょう。

lengthプロパティとは

lengthプロパティは、主に以下の用途で使われます。

JavaScriptでは非常によく使われるプロパティなので、しっかりマスターしておきましょう。

lengthで文字列の長さを取得する

基本的な使い方

lengthで文字列の長さ（文字数）を取得するには、以下のように記述します。

// 文字列にそのままlengthを使う
"こんにちは".length; // 5

// 変数に代入した文字列にlengthを使う
const str = "こんにちは";
str.length; // 5

文字列の後ろに「.length」とつけるだけで、その文字列の文字数を取得できます。半角も全角も、1文字として数えられます。

数値はそのままでは使えない

数値型の値に対して、直接lengthプロパティを使うことはできません。lengthは文字列用のプロパティだからです。

ただし、数値と文字列を連結させれば、lengthが使えるようになります。

const num = 12345;
num.length; // エラー

const str = 12345 + "文字列"; 
str.length; // 8（数値の桁数 + 文字数）

このように数値と文字列を+で連結すると、数値が文字列に変換されるので、lengthプロパティが使えるようになるのです。

lengthで配列の要素数を取得する

基本的な使い方

配列でlengthを使うと、配列の要素数を取得することができます。

const arr = ["りんご", "ばなな", "みかん"];
console.log(arr.length); // 3

この例では、配列arrの要素数は3なので、lengthの値も3になっています。

配列の要素数を使って、for文などで配列を操作するのにとても便利です。

lengthで要素数を変更できる

実は配列のlengthプロパティには、値を代入して要素数を変更することもできます。

const arr = ["りんご", "ばなな", "みかん", "ぶどう"];

// 要素数を2に減らす
arr.length = 2;
console.log(arr); // ["りんご", "ばなな"] 

// 要素数を5に増やす
arr.length = 5; 
console.log(arr); // ["りんご", "ばなな", empty × 3]

要素数を減らすと、後ろの要素から削除されていきます。逆に要素数を増やした場合は、不足分の要素が追加されますが、中身は空になります。

lengthに負の数や小数を代入するとエラーになるので注意しましょう。

lengthで関数の引数の数を取得する

あまり知られていませんが、lengthプロパティは関数でも使うことができます。関数のlengthは、その関数の引数の数を表します。

function sum(a, b, c) {
  return a + b + c;
}
console.log(sum.length); // 3

関数sumは引数を3つ取るので、lengthの値は3になります。

引数の数に応じて関数の処理を変えたい場合などに使えそうですね。ただ、実際に使うケースはあまり多くないかもしれません。

オブジェクトにはlengthは使えない

lengthプロパティは、オブジェクト（連想配列）には使えません。

const obj = {
  name: "太郎",
  age: 24,
};
console.log(obj.length); // undefined

オブジェクトにlengthを使うと、undefinedが返ってきます。

オブジェクトのプロパティの数を数えるには、以下のようにObject.keys()を使う必要があります。

const obj = {
  name: "太郎",
  age: 24,
};
console.log(Object.keys(obj).length); // 2

Object.keys()でオブジェクトのキーを配列で取得し、その配列のlengthを見ることで、オブジェクトのプロパティ数がわかります。

まとめ

JavaScriptのlengthプロパティについて解説しました。ポイントをおさらいしましょう。

lengthプロパティは、JavaScriptでもかなり使用頻度が高いので、ぜひ使いこなせるようになりましょう！

今回の内容を理解すれば、文字数チェックや配列の操作などがスムーズにできるはずです。