JavaScriptで文字列の長さを取得する方法

文字列の長さを知ることは、プログラムにおいてよく行われる操作です。特にフォームのバリデーションやテキストのカットオフなど、多岐にわたるシナリオで必要になります。本記事では、JavaScriptを用いて文字列の長さを取得する方法を詳細に解説します。

length プロパティの基本

var str = "こんにちは";
console.log(str.length); // 出力: 5

length プロパティは、最も基本的でシンプルな方法です。これを使えば、指定した文字列の長さ、すなわちその中の文字数を返してくれます。このプロパティは読み取り専数字として簡単に取得することができます。

var str = new String("こんにちは");
console.log(str.length); // 出力: 5

String.prototype.length プロパティも同じく、文字列の長さを取得する方法です。new String() コンストラクタを使って文字列オブジェクトを生成する場合にも、length プロパティは利用可能です。

var emoji = "😀";
console.log(emoji.length); // 出力: 2

JavaScript の length プロパティは、サロゲートペアを2つの個別の文字として数えます。例えば、絵文字は通常、サロゲートペアとしてエンコードされるため、length プロパティはそれを2文字として数えます。これには注意が必要です。

length プロパティは、文字列の「文字数」を返します。これはバイト数ではありません。日本語や他の多バイト文字セットを使っている場合、これは非常に重要な点です。

これらのサンプルコードは、JavaScriptで文字列の長さを取得するいくつかの一般的なシナリオをカバーしています。特に、サロゲートペアを考慮した文字数のカウントは、現代のWeb開発において重要なテーマですので、注意が必要です。

この例では、普通の文字列の長さを取得しています。

var greeting = "こんにちは";
console.log(greeting.length); // 出力: 5

この例では、new String() コンストラクタを使って作成したStringオブジェクトの長さを取得しています。

var greetingObject = new String("こんにちは");
console.log(greetingObject.length); // 出力: 5

この例では、サロゲートペア（例えば絵文字）が含まれる文字列の長さを取得しています。

var textWithEmoji = "こんにちは😀";
console.log(textWithEmoji.length); // 出力: 6

この例では、サロゲートペアを1文字としてカウントするための関数を定義し、それを使って文字列の長さを取得しています。

function countCharacters(str) {
    return [...str].length;
}

var textWithEmoji = "こんにちは😀";
console.log(countCharacters(textWithEmoji)); // 出力: 5

このcountCharacters関数では、ES6のスプレッド演算子を使って文字列を分解し、各文字（サロゲートペアを含む）を要素とした配列を生成しています。この配列の長さを返すことで、サロゲートペアを1文字としてカウントします。

この例では、文字列が空かどうかを判定しています。

var emptyString = "";
if (emptyString.length === 0) {
    console.log("この文字列は空です。"); // この文字列は空です。
} else {
    console.log("この文字列は空ではありません。");
}

JavaScriptで文字列の長さを取得するには、length プロパティが一番シンプルで効率的な方法です。しかし、サロゲートペア（例えば絵文字）が含まれている場合には注意が必要です。この場合、length プロパティは期待した値と異なる場合があるため、実際の使用状況に応じて対処が必要です。

文字列の長さを操作する基本的なテクニックを理解し、それを活用することで、より効果的なJavaScriptコーディングが可能になります。