Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
0
Help us understand the problem. What is going on with this article?
@standard-software

JavaScript 文字列を反転させたい。結合文字とサロゲートペア対応。

文字列を反転させたい|nona|note
https://note.com/ttuusskk/n/n6f874b0274bd

反転させたい人は多いらしい。スジャータをタ~ジャスに変えたいとかなんとか。しらんけど。

こんなふうにやろうよね。ってことのようです。

const split = require('graphemesplit'); // npm i graphemesplit

const str0 = '👨‍👩‍👧‍👦🌕の夜に𩸽食べたい'
const str1 = str0 + 'がき';
const str2 = str0 + "\u304b\u3099\u304d";

console.log(str1);  // 👨‍👩‍👧‍👦🌕の夜に𩸽食べたいがき
console.log(str2);  // 👨‍👩‍👧‍👦🌕の夜に𩸽食べたいがき

console.log(
  '👨‍👩‍👧‍👦'.length,
  '🌕'.length,
  '𩸽'.length,
  str0.length, str1.length, str2.length
); // 11 2 2 11 13 14

// NG
console.log(str1.split('').reverse().join('')); // きがいたべ食��に夜の�🁦�‍��‍��‍��
console.log(str2.split('').reverse().join('')); // ぎかいたべ食��に夜の�🁦�‍��‍��‍��

// NG
console.log([...str1].reverse().join('')); // きがいたべ食𩸽に夜の🌕👦‍👧‍👩‍👨
console.log([...str2].reverse().join('')); // ぎかいたべ食𩸽に夜の🌕👦‍👧‍👩‍👨

// better
console.log([...str1.normalize()].reverse().join('')); // きがいたべ食𩸽に夜の🌕👦‍👧‍👩‍👨
console.log([...str2.normalize()].reverse().join('')); // きがいたべ食𩸽に夜の🌕👦‍👧‍👩‍👨

// good
console.log(split(str1).reverse().join('')); // きがいたべ食𩸽に夜の🌕👨‍👩‍👧
console.log(split(str2).reverse().join('')); // きがいたべ食𩸽に夜の🌕👨‍👩‍👧‍

参考

文字列を1文字ずつ配列化(サロゲートペアを考慮) - Qiita
https://qiita.com/sounisi5011/items/aa2d747322aad4850fe7

Unicode と JavaScript の文字列について - Object.create(null)
https://susisu.hatenablog.com/entry/2017/01/25/023338

JavaScriptで絵文字とサロゲートペアと結合文字とgrapheme clusterを正しく扱うのに少し苦労した話 - Qiita
https://qiita.com/amanoese/items/68bb9999829de4323302

文字とは何か?IchigoJam絵文字対応とUnicodeの旅、結合文字対応の文字分割ライブラリJavaScript対応版公開! #js #IchigoJam / 福野泰介の一日一創 / Create every day by Taisuke Fukuno
https://fukuno.jig.jp/2831

JavaScript における文字コードと「文字数」の数え方 | blog.jxck.io
https://blog.jxck.io/entries/2017-03-02/unicode-in-javascript.html

0
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
standard-software
JS便利関数ライブラリ Parts.js 作ってます。npmで公開しています。 ゴミ屋敷みたいになった汚いコードの山をきれいに整理整頓するのを専業にしています。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
0
Help us understand the problem. What is going on with this article?