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.2k
翻訳した英単語をそのまま 使うのは今日で終わりにしよう!
・開催日
2021/1/27
・イベント名
リーダブルコード LT会
https://rakus.connpass.com/event/199845/
ミカイ
January 22, 2021
Tweet
Share
More Decks by ミカイ
See All by ミカイ
コメントアウトするべきでは「ない」こと
junmikai
0
4
もくもく会怖くないよ〜
junmikai
0
4
結局ドメインって何ですか?
junmikai
0
38
フリーランス怖くないですか?
junmikai
0
11
課題解決との向き合い方
junmikai
0
16
ドキュメント読めという見解
junmikai
0
4
学習迷子にならないために
junmikai
0
4
初めてのAPI開発のアーキテクチャ
junmikai
0
89
フロントエンドから バックエンドに 転身すること にやったこと
junmikai
0
15
Other Decks in Programming
See All in Programming
Doctrine ORMでValue Objectを扱う方法4選 #phpstudy / 4 ways to handle Value Objects with Doctrine ORM
77web
4
110
CQRS/ES avec Symfony, c’est (trop) bien !
jeremyfreeagent
1
620
Semantic search with Django and pgvector
pauloxnet
0
220
Javaエンジニアのための Nodejs/Nuxt3入門
hidekatsu_izuno
0
250
今の SmartHR にエンジニアで入社するとどうなるの?
daisukeshinoku
5
4.6k
Rubyでたのしむクリエイティブコーディング/Enjoy Creative coding with Ruby
chobishiba
1
160
GitHub Actionsで泣かないためにやっておきたい設定 / Recommended GHA settings to avoid crying
pinkumohikan
3
450
try! Swift Tokyo 初参加報告LT
hinakko2
0
180
[技育CAMPアカデミア]アイディアを形に!【超入門】スマホアプリ開発〜リリースまでの流れをご紹介
teamlab
PRO
0
320
Micro Frontends for Java Microservices - Devnexus 2024
mraible
PRO
0
400
try!Swift Tokyo 2024 参加報告 LT
akidon0000
1
180
Changed Rules: Architectures with Lightweight Stores
manfredsteyer
PRO
0
220
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
288
19k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
355
22k
Optimizing for Happiness
mojombo
369
69k
Producing Creativity
orderedlist
PRO
336
39k
Debugging Ruby Performance
tmm1
69
11k
How to name files
jennybc
64
92k
Put a Button on it: Removing Barriers to Going Fast.
kastner
58
3k
Building a Modern Day E-commerce SEO Strategy
aleyda
16
6.3k
4 Signs Your Business is Dying
shpigford
175
21k
Why Our Code Smells
bkeepers
PRO
330
56k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
226
16k
Agile that works and the tools we love
rasmusluckow
323
20k
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から連絡してください!