【JavaScript】Lengthプロパティの使い方｜実例付き

（最終更新月：2023年11月）

✔このような方へ向けて書かれた記事となります

✔当記事を通じてお伝えすること

• JavaScriptのlengthプロパティの基本理解
• lengthプロパティの独自な使用方法とその実用性
• lengthプロパティ使用時の具体的な事例

当記事では、JavaScriptのlengthプロパティの基礎から、独自的かつ効果的な使い方までを、実例を交えて詳しく解説しています。

ぜひ最後までご覧いただき、lengthプロパティの可能性を最大限に引き出しましょう。

Lengthの解説、用途と例

こちらでは、Lengthプロパティの詳しい解説やその用途、具体的な例を見ていきます。

• Lengthプロパティとは？
• Lengthプロパティの応用例

Lengthプロパティとは？

Lengthプロパティは、文字列や配列などのオブジェクトの長さや要素数を示すプロパティです。

これは読み取り専用のプロパティであり、その値を変更することはできません。

let fruits = ["apple", "banana", "cherry"];
console.log(fruits.length);  // 3

Lengthプロパティの応用例

Lengthを使って、入力値の文字数制限を設けたり、配列における最後の要素を取得したりなど、さまざまな操作が可能です。

let input = "itc.tokyo";
if (input.length > 5) {
  console.log("The input is too long!");
}

文字列におけるLengthの使い方

文字列の操作はWeb開発の中心であり、Lengthプロパティはその中でも特に頻繁に使われるツールのひとつです。

• 基本的な文字列でのLengthの使用法
• 文字列の長さをLengthで計測するやり方
• Number型での取扱いに関する特記

基本的な文字列でのLengthの使用法

文字列の長さを取得する最も簡単な方法は、lengthプロパティを使用することです。

これは文字列のキャラクタ数を返します。

let greeting = "Hello, world!";
console.log(greeting.length);  // 13

文字列の長さをLengthで計測するやり方

特定の文字列が必要な長さを持っているかどうかを確認する際に、lengthプロパティは非常に有用です。

let name = "Alice";
if (name.length < 5) {
  console.log("Name is too short!");
}

Number型での取扱いに関する特記

数値はlengthプロパティを直接持っていません。

そのため、数値を文字列に変換してから長さを取得する必要があります。

let number = 12345;
console.log(String(number).length);  // 5

配列でLengthを利用する方法

配列はJavaScriptの中心的なデータ構造のひとつです。

ここでは、配列とLengthプロパティの関連に焦点を当てて解説します。

• 配列の基本とLengthの書き方
• 配列の要素数をLengthで求める手段
• Lengthを使って配列要素を修正するテクニック
• 固定長の空配列の作成方法

配列の基本とLengthの書き方

配列は複数の値をリストとして格納するデータ構造です。

Lengthプロパティを使用して、その要素数がわかります。

let animals = ["dog", "cat", "bird"];
console.log(animals.length);  // 3

配列の要素数をLengthで求める手段

配列の中の要素数を取得するのは、ループの繰り返し回数を設定する際や、要素を追加・削除する際のインデックスを決定するのに役立ちます。

let colors = ["red", "blue", "green", "yellow"];
for (let i = 0; i < colors.length; i++) {
  console.log(colors[i]);
}

Lengthを使って配列要素を修正するテクニック

配列においては、Lengthプロパティは読み取りだけでなく、書き込みも可能です。

これを利用して、配列のサイズを変更できます。

let numbers = [1, 2, 3, 4, 5];
numbers.length = 3;
console.log(numbers);  // [1, 2, 3]

固定長の空配列の作成方法

Lengthプロパティを使って、指定した長さの空配列を作成できます。

let newArray = new Array(5);
console.log(newArray.length);  // 5

Lengthの関数での利用法

関数が受け取る引数の数は、関数オブジェクトのlengthプロパティで確認できます。

function sampleFunction(a, b, c) {
  // Do something
}
console.log(sampleFunction.length);  // 3

オブジェクトにおけるLengthの特性

JavaScriptのオブジェクトはLengthプロパティを持っていませんが、要素数を知る方法があります。

• オブジェクトが持つ特性とLength
• Object.keys()を利用した要素数の取得

オブジェクトが持つ特性とLength

オブジェクトはキーと値のペアで構成されています。

Lengthプロパティは配列や文字列に固有のものであり、オブジェクトには存在しません。

Object.keys()を利用した要素数の取得

オブジェクトの要素数を知るためには、Object.keys()メソッドを使います。

このメソッドはオブジェクトのすべてのキーを配列として返すので、キー配列にlengthプロパティが使えます。

let obj = {
  name: "Alice",
  age: 25,
  city: "Tokyo"
};
console.log(Object.keys(obj).length);  // 3

まとめ

当記事では、JavaScriptのlengthプロパティについて学習してきました。

• Lengthプロパティの多様性を学んだ後、どのようにそれを効果的に活用するかを再確認することが大切
• Lengthプロパティは文字列や配列の要素数を知るのに役立つ
• 関数の引数やオブジェクトのキー数を知るための手段としても利用できる

JavaScriptのLengthプロパティは、非常にシンプルながら強力なツールです。

当記事を通じて、その真価と多様な利用法を学び、あなたの日々のコーディングに役立てることを期待しています。