この記事は ShoTime Advent Calendar 2018 の 1 日目の記事です。
JavaScript で空の文字列を持った配列を作る場合、次のように書くことができますが、もうすこしプログラムっぽく書く方法を調べてみました。
const array = ['', '', '']
背景
単純に Array(3) と書くと、 undefined を保持する長さ 3 の配列が生成されます。型をしっかり固定させて配列を準備すれば次のようなコードでエラーが発生しなくなるのではと思いました。
const array = Array(3)
console.log(array[1].length) // ここでエラーが発生します
''.length なら 0 が出力されますが、上記コードでは、 undefined.length となっているためエラーになります。
型を決めることでこのようなエラーが発生しないようにしたいという動機で調べてみたところ、いくつかの方法があるようだったので、記録しておきます。
ちなみに、これまでは次のようなコードを書いてエラーが発生しないよう対応していました。
const array = Array(3)
const length = typeof array[1] === 'string' ? array1[1].length : 0
console.log(length)
3種類の方法
- Array.fill
- Array.apply
- Array.from(Array(3), () => '')
調べたところ他にもたくさん方法があるようでしたが、課題解決のためには３つも知っていれば、十分な情報量なのでここには掲載しません。 めんどくさいわけではありません
以下、いずれのコードも出力は ['', '', ''] となります。
Array.prototype.fill
new Array(3).fill('')
Array.prototype.apply
Array.apply(null, Array(3)).map(x => '')
Array.prototype.from
Array.from(Array(3), () => '')
このコードを利用して、開発しているサービス
ShoTime（目標をみんなに共有しよう） というサービスを開発しています。リリースして８ヶ月経過しましたが、ほとんど利用されていません。理由は使いにくいためと明白ですので、2018年のうちできる限りの改善をしつつ、そこで得た知見を ShoTime Advent Calendar 2018 として、毎日１つずつ記録していきます。そしてこれがその１日目の記録です。