JavaScript - 文字列の長さを取得(サロゲートペア対策を含む)

JavaScriptで文字列の長さを取得するには、 Stringオブジェクトのlengthプロパティを使います。

「変数名.length」や「文字列リテラル.length」で取得できます。

また、サロゲートペア対策として、 スプレッド演算子(...)を使った文字列の長さを取得する方法も紹介します。

lengthプロパティの使い方

変数名.length

lengthプロパティを使って文字列の長さを取得するには、 次のように、「変数名.length」で取得できます。


str = 'abcde';

str = str.length; // 5

文字列リテラル.length

次のように「文字列リテラル.length」という記述でも取得できます。


console.log('abcde'.length); // 5

console.log('あいうえお'.length); // 5

通常のプログラミングでは、「変数名.length」を使うことの方が多いと思います。

スプレッド演算子+lengthプロパティ

サロゲートペアの問題

サロゲートペアという特殊な文字を含む場合、 文字列の長さはうまく取得できません。

例えば、「」(ホッケ)の場合、lengthプロパティで長さを取得すると「2」となります。


console.log(''.length); // 2

console.log('を食べる'.length); // 6

スプレッド演算子+lengthで解決

サロゲートペアを含んだ問題を解決し、 正しい文字列の長さを取得するには、 スプレッド演算子(...)+lengthプロパティを使います。

スプレッド演算子(...)を使って文字列を配列に分割し、 配列の長さを数えています。


console.log([...''].length); // 1

console.log([...'を食べる'].length); // 5

文字列リテラルではなく、変数を使う場合も同様に記述できます。


str = 'を食べる';

console.log([...str].length); // 5

この方法だと、簡単にサロゲートペアの文字も正しく1文字と認識できます。