0
Help us understand the problem. What are the problem?

posted at

updated at

【JavaScript学習記録】アルファベットの配列の作り方

 PHPでは、以下のように簡単にアルファベットの配列を作ることができます。

 $alphabets = range('a', 'z');

 JavaScriptでは、どのようにして作るのだろう。
 今日はそれを調べてみましたので、アウトプットします。

 ※ 下記を参考にさせて頂きました:relieved::tulip:
 http://2amcode.hatenablog.com/entry/2017/08/22/102156

 const start = "a" . charCodeAt(0);
 const alphabets = Array.apply(null, new Array(26)).map((v, i) => {
    return String.fromCharCode(start + i);
 }, {})

 コードを一行ずつみていきます。
 
 まずは一行目の「charCodeAt(0)」。
 charCodeAt(n)は、Stringオブジェクトで利用可能なメンバーです。
 n + 1番目の文字をLatin-1コードに変換します。
 ※ Latin-1・・・ラテンアルファベットの文字コード標準。

 二行目の「.apply()」、「.map()」。
 .apply()は、関数を呼び出すメソッドです。

 【構文】
 関数名.apply(関数の処理の対象となる要素, 関数で使う引数(配列のみ));

 
 .map()は、コールバック関数によって新しい配列を生成します。

 【構文】
 関数名.map([要素], [インデックス], [元配列]) => 変更後の要素

 三行目の「String」、「fromCharCode(start + i)」。
 Stringは、文字列型の値を扱うラッパーオブジェクトです。
 文字列の抽出や加工、検索等を行う為の機能を提供します。
 
 fromCharCode(c1, c2...)は、Stringオブジェクトで利用可能なメンバーの一つです。
 Latin-1コードc1,c2...を文字に変換します。
 
 startで定義したラテンコードをアルファベットにどんどん変換して返しているということでしょうか。
 
 PHPと比較すると大分難しく感じますが、少しずつ理解できるよう努めていきたいと思います。
 
 今回の記事の内容に不備等ございましたら、後学の為にご指摘頂けますと幸いです。

:pencil2: 追記
@vf8974様よりコメントで代替案をご提案いただきましたので、そちらをご紹介いたします。

【代替案1】
const alphabets = [...Array(26)].map((a, b) => (10 + b).toString(36));

とてもスッキリしたコードです:sparkles:
まだまだコードが長くなりがちですので、他の誰かを意識した可読性の高いコードが書けるようになりたいです。

【代替案2】
const alphabets = [...'abcdefghijklmnopqrstuvwxyz'];

一文字ずつカンマ区切りにせずとも、このようにまとめて書くことができるのですね:bulb:

とても勉強になりました。
@vf8974様、ありがとうございました:relieved:

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
0
Help us understand the problem. What are the problem?