《 10:30 AM 公開/更新》
文字列を何らかの規則で並び替えたい(ソートしたい)場合があります。データを規則的に並べておけば、量が多くても検索しやすくなりますし。JavaScriptでソートする場合は「文字コード順」ならとても簡単にソートできます。何も考えずに単にsortメソッドを使えば良いだけです。JavaScriptソースで文字コード順にソートする方法を解説。
ユーザからの入力文字列を蓄積していく場合などでは、「保存している文字列」を何らかの規則で並び替えたい(ソートしたい)場合があります。データを規則的に並べておけば、データ量が多くなったときに検索しやすくなりますから、検索時間の節約ができますし。
データを並び替える際には「どういう規則で並び替えるのか」を考える必要があります。おそらく最も楽なのは(何も考えずに並び替える場合は)「文字コード順」でしょうか。
漢字の場合だと文字コードはバラバラですけども、「ひらがな」・「カタカナ」・「数字」・「アルファベット」などであれば、一般的な文字の並び順(あいう……、アイウ……、123……、ABC……など)に文字コードが割り振られているので、文字コードを元にして並べ替えれば、ほぼ文字順(音順)に並び変わります。
JavaScriptでは、sortメソッドを使うことで、簡単に文字コード順に並べ替え(ソート)ができます。
sortメソッドには引数として比較用の関数を指定することもできるのですが、引数に何も指定せず実行すれば「文字コード順」に並べてくれます。楽々です。
以下は、JavaScriptを使って任意の配列を文字コード順に並び替えるサンプルと、それを実現するソースです。
以下のテキストエリアに適当な文字列を複数行ほど入力してから、下部の「文字コード順にソートする」ボタンを押すと、文字コードを元にして(文字コードの若い順に)並び変わります。
◆文字列リスト:
上記のサンプルを使うと、入力された文字列が文字コードの若い順に並び変わり(ソートされ)ますから、ほぼ文字の音順に並びます。なぜ「ほぼ」かという点については(実際に並べ替えてみると分かりますが)詳しくは後述します。
先に、上記のサンプルを実現するJavaScriptソースを解説しておきます。
先ほどのソート処理は、以下のJavaScriptソースで作っています。ここでのソート処理は、単にJavaScriptに最初から存在するsortメソッドをそのまま呼び出しているだけなので、とても短いソースで済んでいます。
JavaScriptソース
function SortByCharCode() { // textareaの内容を改行で分割して配列に格納 var targetArray = document.getElementById('sampleTargetLines').value.split("\n"); // 文字コード順にソート var sortedArray = targetArray.sort(); // ソート結果を書き戻す document.getElementById('sampleTargetLines').value = sortedArray.join("\n"); }
文字列の入力・出力用として、以下のHTMLを用意しています。textarea要素には、JavaScript側から中身(文字列)を扱うために、id属性でid名「sampleTargetLines」を割り振っています。
HTMLソース
◆文字列リスト: <textarea cols="30" rows="6" id="sampleTargetLines">リンゴ みかん グレープフルーツ : : : グレープ</textarea> <input type="button" value="文字コード順にソートする" onclick="SortByCharCode();">
上記のソースによって、「文字コード順にソートする」ボタンをクリックすると、テキストエリアに入力した複数行の文字列が文字コード順に並び変わる機能ができがあります。
※上記ではtextarea要素の内容に、あらかじめ複数の文字列をサンプルとして入れてありますが、実際に使用する際にはもちろん空(カラ)で構いません。
先ほどのサンプルのように、文字コード順に並び替えれば、ほぼ音順に並び変わります。「ほぼ」というのは、下記の理由からです。
このように、「文字コード順」だと、文字種によるソートの方が優先されるので、必ずしも50音順にはなりません。「ひらがなだけが入力されている」とか「アルファベット大文字だけが入力されている」など、文字種が1種類なのであれば、文字コード順でソートするだけで「50音順」や「アルファベット順」になりますが。(※なお、Unicodeでは「ぁ」→「あ」→「ぃ」→「い」……のように五十音順ではあるものの「小さい文字」が先になる順で並んでいます。)
そこが気に入らない場合は、sortメソッドの引数に「比較用の関数」を渡すことでソート処理をカスタマイズする必要があります。
その話は長くなるので、別の機会に回します。(^_^;) 「数値の大きい順・小さい順に文字列を並び替える(ソートする)方法」で多少紹介していますので参考にして下さい。
とりあえず今回は、文字コード順に並べる方法を解説しました。
()
(前の記事) « 指定の桁数になるまで「0」などの指定文字で埋める方法
前後のJavaScript TIPS
< 旧 / 新 >
(次の記事) 数値の大きい順・小さい順に文字列を並び替える(ソートする)方法 »
▼このページに関連しそうな記事が約8本くらい自動表示されています。(たぶん)