レガシーかつ酷いJavaScriptコードを少しづつリファクタリングしてみます。
仕様
「atiiq no tsop tsrif」の文字列を反転等で操作して「First post on Qiita」と表示する。
##STEP 0
何をしているか分り辛いコード。こんなコードに出会ったことのない貴方は幸せ者。
function reverse(string) {
const reversed = string.trim()
.split('')
.reverse()
.join('');
return reversed[0].toUpperCase()
+ reversed.substring(1, 14)
+ reversed[14].toUpperCase()
+ reversed.substring(15)
+ (reversed[reversed.length -1] = ".");
};
reverse('atiiq no tsop tsrif');
##STEP 1
- reverse関数をアロー関数に変更
- 文字列を返す関数を用意
- セミコロンを削除
const reverse = string => string.trim()
.split('')
.reverse()
.join('')
const target = string => string.indexOf('qiita')
...
##STEP 2
- 投稿するサービスを定数で定義
- ピリオドを文末に追加する関数を作成
- 完成した文字列を返す関数を作成
const serviceName = 'qiita'
...
const target = string => string.indexOf(serviceName)
...
function reverseSentence(string) {
const reversed = reverse(string)
const addPeriod = string => string
+ (string[string.length -1] = "."
return reversed[0].toUpperCase()
+ reversed.substring(1, target(string))
+ reversed[target(string)].toUpperCase()
+ reversed.substring(target(string) +1)
}
...
##STEP 3
- reverseSentenceをアロー関数に
- 完成した文字列を作成するsentence関数を作成
- タイポを防ぐためピリオドが文末に既に存在する場合は表示しない
...
const sentence = string => string[0].toUpperCase()
+ string.substring(1, target(string))
+ string[target(string)].toUpperCase()
+ string.substring(target(string) +1)
...
const addPeriod = string => string
+ (string[string.length -1] === "." ? "" : ".")
const reverseSentence = string => sentence(addPeriod(reverse(string)))
...
##Done
const serviceName = 'qiita'
const reverse = string => string.trim()
.split('')
.reverse()
.join('')
const target = string => string.indexOf(serviceName)
const sentence = string => string[0].toUpperCase()
+ string.substring(1, target(string))
+ string[target(string)].toUpperCase()
+ string.substring(target(string) +1)
const addPeriod = string => string
+ (string[string.length -1] === "." ? "" : ".")
const reverseSentence = string => sentence(addPeriod(reverse(string)))
reverseSentence('atiiq no tsop tsrif')
>"First post on Qiita"
関数名で処理を伝えるようにしました。