Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
翻訳した英単語をそのまま 使うのは今日で終わりにしよう!
Search
ミカイ
January 22, 2021
Programming
0
2.3k
翻訳した英単語をそのまま 使うのは今日で終わりにしよう!
・開催日
2021/1/27
・イベント名
リーダブルコード LT会
https://rakus.connpass.com/event/199845/
ミカイ
January 22, 2021
Tweet
Share
More Decks by ミカイ
See All by ミカイ
職務経歴書を書くときの_ポイント1選.pdf
junmikai
0
17
炎上案件を通して 筋肉の成長を諦めた件
junmikai
0
18
フリーランス 勇気が9割
junmikai
0
18
シャイエンジニアのコミュニティ論
junmikai
0
29
雑談はファンタジーである
junmikai
0
9
未来のキャリアは「ヘアサロン」現象
junmikai
0
11
コメントアウトするべきでは「ない」こと
junmikai
0
13
もくもく会怖くないよ〜
junmikai
0
17
結局ドメインって何ですか?
junmikai
0
470
Other Decks in Programming
See All in Programming
Android開発者のための Kotlin Multiplatform入門
ntaro
0
190
Temporalを取り巻く仕様を整理する
sajikix
0
110
From Spring Boot 2 to Spring Boot 3 with Java 22 and Jakarta EE
ivargrimstad
0
1.9k
スクラムマスターって孤独じゃないですか?
yoshitaroyoyo
1
140
日付と正規化
megmogmog1965
0
140
さきがけから振り返るアーキテクチャ刷新 / Reflecting on the Architectural Renewal from the Vanguard
nrslib
2
770
大規模マルチテナントを解決するYugabyteDBという選択肢
nnaka2992
1
250
Polarsの成長: v0.14からv1.0までの変遷と今後の展望
zerebom
1
350
入社1ヶ月でここまでやった!Findy Toolsインフラ支援の最適化
rvirus0817
6
1.4k
Cloudflare Workers x AWS Lambdaの組み合わせユースケース / Cloudflare Workers x AWS Lambda Combination Use Case
seike460
PRO
2
310
Webエディタライブラリ 「CodeMirror」から学ぶ Webアプリ開発のテクニック
ryosukeigarashi
0
250
HMSコンペ 11th Solution (team : kansai-kaggler)
t88
1
680
Featured
See All Featured
Building Applications with DynamoDB
mza
89
5.8k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
105
6.8k
Statistics for Hackers
jakevdp
792
220k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
17
8.7k
Navigating Team Friction
lara
181
13k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
149
45k
How to Think Like a Performance Engineer
csswizardry
4
590
XXLCSS - How to scale CSS and keep your sanity
sugarenia
245
1.2M
Rails Girls Zürich Keynote
gr2m
93
13k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
224
21k
Faster Mobile Websites
deanohume
303
30k
Transcript
翻訳した英単語をそのまま 使うのは今日で終わりにしよう! 実際に使用した関数を見直そう!
▪ 自己紹介 ▶ 現職 2020年6月、渋谷のベンチャー企業にフロントエンドエンジニアとして 未経験で入社。 エンジニア歴は半年! ▶ 主な使用言語・フレームワーク Vue.js
/ Nuxt.jsを中心に Typescript も導入中。 写真
① 関数の中身を隠しても何の処理をしているか 理解できる名前をつけよう! ② 関数名の上に処理のコメントを少しでも減らそう! (コメントのコメントをしない from:リーダブルコード) 今回の目標
▪ 今回使用するリーダブルコードのテクニック ▶ 明確な単語を選ぶ ex.) size()は大きさ?長さ?個数?と色々想像できてしまう。この場合 height()の方がいい ▶ 汎用的な名前は避ける ex.)change()だと変わったという情報しか伝わってこない。
▶ 誤解されやすい名前は避ける ex.) 値の有無確認にvalueRead()はややこしい。readはこれから読むのか既に読み取ったのかわからない か ら。isValue()などの方がわかりやすい。
例① : 外部ページにアクセスする 機能 ボタンをクリックすると外部ページにアクセスする デザインサンプル 外部サイトへ 実務で命名した関数名 externalLink() 問題点
external(外部)のlinkという意味はわかったが ボタンをクリックしたら何のアクションが発生す るのかわからない。
改善案:jumpToExternalLink() 移動するを飛ぶに変換。 jumpToという単語は~に飛び跳ねるという意味。 飛ぶ(jumpTo)+外部リンク(ExternalLink)で関数名を見ただけで意味がわ かるようになる。 goToExternalLink()でもいいかも・・・
②宿泊フォームを追加する 機能 ボタンをクリックすると宿泊入力フォームが1つ増える ここでいう宿泊は予約を指す デザインサンプル 実務で命名した関数名 lodgmentDateAdd 問題点 lodgmentという単語が難しいため誰もが読めるわ けではない(TOEIC600点以上)
追加する 宿泊日
改善案:addReserveDate() reserveはホテルの部屋などを予約すること。 予約=ホテルに泊まるという行為なので宿泊と同じ意味になる。 後はDateを追加する事で宿泊の日程だと意味がわかる。 ちなみに泊まった日を報告する場合の入力フォームの場合は予約が使えな いのでaddStayData()がいいだろう
③資格取得年月日の日付を入力した時 機能 公的資格取得年月日の入力フォームに値を入力し た時、その値をセットする(changeイベント) デザインサンプル 実務で命名した関数名 changeAcquisitionQualificationDate() 問題点 Acquisition(習得)やQualificationが難しい (それぞれ英検準1級、2級以上)
資格習得日が変わった時発火する事はわかったが文 字数が長すぎる。その上、変わったら何が起こるかが わからない。cssが変わるの?他のフォームが変わる の?など色々イメージできてしまう。 追加する 1995/12/12 公的資格取得年月日
改善案:updateLicenseDate() 資格を免許に変換して馴染みやすい licenseを使用。免許と資格が厳密に意 味は違うが資格関係の入力フォームはここしかないため問題ない。 changeはイベントが発火する部分を見れば理解できるため関数名は発火した 後の処理を書いた方がわかりやすい。 値を更新するという意味でupdateを使用。recordでもいいかなーと考えました が入力フォームの値が変わる事を考慮すると updateの方がいいでしょう。
④機関を選択した時、別ボタンを押せるようにする 機能 機関を選択すると隣にある決定ボタンを押せるようにす る。選択されていない初期状態は決定ボタンはグレーで 押せないようになっている デザインサンプル 実務で命名した関数名 organizationSelected() 問題点 上記関数名だと機関選択フォームだけで完結する処
理だと思われる。右下のボタンを処理は関係ないん だなーと勘違いさせないように、値が存在するかどう か?という関数名にして「他のどこかが変わるんだ」と イメージしてもらうようにしよう リダブル機関 専門機関 戻る 決定 グレーから青に変更 (押せるようになる) ˅
改善案:isOrganization() リーダブルコード34pのブール値の命名にis,can,has等を使うといいとの事な のでisOrganizationSelectedになる。 しかし、これでは長すぎるのでisOrganizationにした。 同一ページでisOrganization(機関が存在するか?)を使用していなければ ここの関数はselectタブの事だな〜 と自然にわかるのでselectedは不要だと思います。
× 翻訳した英単語をそのまま突っ込む ◦ 誰もが知っている単語を組み合わせる ▼ わかりやすい関数名を作る事ができる!
自分が働いているアルサーガパートナーズ(株) では一緒に働く人を募集してます! QRコード(採用ページ) リンクはこちら 興味のある人は自分にTwitterDM(@miumitempe)か会社HPから連絡してください!