みかづきブログ・カスタム

基本的にはちょちょいのほいです。

JavaScriptで絵文字を含んだ文字列のlengthを取得する ✏️

f:id:kimizuka:20200602074742p:plain

JavaScriptで文字列の長さを取得するときは、String.prototype.lengthにアクセスすればOKです。

const text = 'こんにちは';

console.log(text.length); // => 5

ただし、絵文字を含む文字列の場合は、String.prototype.lengthでは期待通りの値が返ってこないときがあります。

const text = '😊';

console.log(text.length); // => 2

何故こういう現象が起こるかというと、絵文字は内部的には2文字を1文字として使うことによって表現されているからです(サロゲートペア)。

絵文字を含んだ文字列の長さを正しく取得するためには、こちらの npm などを使うと良いでしょう。

www.npmjs.com


が。簡易的な処理で良いのであれば、

const text = '😊';

console.log([...text].length); // => 1

といった具合に、一旦配列に収納してから配列の長さを計測することによって、期待した値を取得することができます。

ただしこの方法だと、

let text = '✌️';

console.log([...text].length); // => 2

のように、いくつかうまくいかない絵文字が出てくるので、あくまで簡易的な方法としてご活用ください。