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
今さら聞けない!Webデザイナーのためのプログラミング講座
Search
Toshiyuki TAKAHASHI
May 20, 2016
Programming
320
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
今さら聞けない!Webデザイナーのためのプログラミング講座
2015.1.25 に開催した「今さら聞けない!Webデザイナーのためのプログラミング講座」のスライドです
Toshiyuki TAKAHASHI
May 20, 2016
More Decks by Toshiyuki TAKAHASHI
See All by Toshiyuki TAKAHASHI
第11回 AED-LABO 解説用スライド
gautt
1
610
今さら聞けない!デザイナーのためのGit超入門
gautt
2
300
10倍ラクするアピアランス入門
gautt
2
660
Other Decks in Programming
See All in Programming
dRuby over BLE
makicamel
2
390
メソッドのジェネリクスでGoの夢は広がるか? / Kyoto.go #65
utgwkk
3
920
ふつうのFeature Flag実践入門
irof
8
4.2k
トークンをケチるな、設計しろ:GitHub Copilotを賢く使うコンテキスト戦略
ochtum
0
160
スマートグラスで並列バイブコーディング
hyshu
0
260
IBM Bobを活用したレガシーアプリの最新化
oniak3ibm
PRO
1
210
その問い、本当に正しいですか?AI時代のエンジニアに必要な哲学と認知科学 / ai-philosophy-cognitive-science
minodriven
13
6.2k
AI 輔助遺留系統現代化的經驗分享
jame2408
1
980
Signal Forms: Details & Live Coding @enterJS 2026 in Mannheim
manfredsteyer
PRO
0
190
Claspは野良GASの夢をみるか
takter00
0
210
LLM本来の能力を解き放つサンドボックス技術とAI民主化への適用
yukukotani
3
4.5k
Performance Engineering for Everyone
elenatanasoiu
0
210
Featured
See All Featured
Scaling GitHub
holman
464
140k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
inesmontani
PRO
3
3.5k
How to build a perfect <img>
jonoalderson
1
5.7k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Test your architecture with Archunit
thirion
1
2.3k
Skip the Path - Find Your Career Trail
mkilby
1
150
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.5k
Thoughts on Productivity
jonyablonski
76
5.2k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
480
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.2k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
62
55k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.8k
Transcript
ࠓ͞Βฉ͚ͳ͍ʂ 8FCσβΠφʔͷͨΊͷ ϓϩάϥϛϯάߨ࠲ AED LABO 2015.1.25. sun. TOSHIYUKI TAKAHASHI (GRAPHIC
ARTS UNIT )
ʠίϯϐϡʔλ͕ߦ͏͖ॲཧΛॱংཱͯͯهड़ͨ͠ͷʡ ग़యɿϓϩάϥϜͱʤίϯϐϡʔλϓϩάϥϜʥʲQSPHSBNʳҙຯղઆઆ໌ఆٛɿ*5༻ޠࣙయʢIUUQFXPSETKQX&&"%&#&"&"IUNMʣ ϓϩάϥϜͱ
ͭΊͷॲཧ ࣮ߦ ͭΊͷॲཧ ͭΊͷॲཧ ͭΊͷॲཧ ʜʜ ࣮ߦ ࣮ߦ ࣮ߦ ͋Β͔͡ΊܾΊΒΕͨॲཧΛ্͔Βॱ൪ʹ࣮ߦ͍ͯ͘͠
ϓϩάϥϜͱ
ͭΊͷॲཧ" ʜʜ ͭΊͷॲཧ" ࣮ߦ ࣮ߦ ͭΊͷॲཧ ࣮ߦ ͭΊͷॲཧ ࣮ߦ ݅
A B ϓϩάϥϜͱ
࣮ߦ ࣮ߦ ͭΊͷॲཧ# ͭΊͷॲཧ# ʜʜ ͭΊͷॲཧ ࣮ߦ ͭΊͷॲཧ ࣮ߦ ݅
A B ϓϩάϥϜͱ
ͭΊͷॲཧ" ʜʜ ͭΊͷॲཧ" ͭΊͷॲཧ ͭΊͷॲཧ ͭΊͷॲཧ# ͭΊͷॲཧ# ʜʜ ݅ʹΑͬͯॲཧΛৼΓ͚Δ ݅
A B ϓϩάϥϜͱ
ྫྷଂݿΛ։͚Δ தΛ֬ೝ͢Δ ڇ͕͋Δ ಲ͕͋Δ ͕ܲ͋Δ ϏʔϑεςʔΩ ϙʔΫιςʔ άϦϧνΩϯ ങ͍ʹߦ͘ ͕͋Δ͔
NO YES ༦৯ͷϝχϡʔΛܾΊΔͱ͖ͷྲྀΕ
ը૾ग़యɿ࡚ࢢɿΧϞஅςετʢIUUQXXXDJUZLBXBTBLJKQQBHFIUNMʣ அνϟʔτ͍νϟʔτҰछͷʮϓϩάϥϜʯͱݴ͑Δ
զʑ͕͢ݴ༿͕ࠃʹΑͬͯҟͳΔΑ͏ʹ ϓϩάϥϜݴޠʹ͍͔ͭ͘ͷछྨ͕͋Γ·͢
Web Design (Front End) JavaScript / PHP … Web Development
Ruby / Python / Perl / Scala … Application Development Java / C++ / Objective-C / Swift … ओͳϓϩάϥϜݴޠͷछྨ ͪΖΜɺ͜ͷଞʹͨ͘͞ΜͷϓϩάϥϜݴޠ͕ଘࡏ͠·͢
ΣϒσβΠφʔతʹೃછΈ͕͋Δͷίί ओͳϓϩάϥϜݴޠͷछྨ Web Design (Front End) JavaScript / PHP …
Web Development Ruby / Python / Perl / Scala Application Development Java / C++ / Objective-C / Swift
ݴޠͷ༷จ๏ͳͲΛ֮͑Δͷେ͕ͩɺ ॲཧͷߟ͑ํʢΞϧΰϦζϜʣΛ֮͑Δํ͕େ ϓϩάϥϜతͳࢥߟΛ͢Δʹ
࠺ʮڇೕΛ̍ύοΫങ͖ͬͯͯɻཛ͕͋ͬͨΒ͓̒ͭئ͍ʯ ͠Βͯ͘͠ɺ͕ʬڇೕΛ̒ύοΫʭങͬͯؼ ࠺ʮͳΜͰڇೕΛ̒ύοΫങ͖ͬͯͨͷΑʯ ʮͩͬͯཛ͕͔͋ͬͨΒʯ ͋Δ࠺͕ϓϩάϥϚʔͷʹങ͍ΛཔΜͩΒʜʜ ͓લҰମԿΛݴ͍ͬͯΔͷͩ
WBSڇೕͷݸ JG ཛ
\ ڇೕͷݸ ^FMTF\ ڇೕͷݸ ^ ڇೕΛങ͏ ڇೕͷݸ ˞+BWB4DSJQUͷ߹ ࠺ͷ͓ئ͍ʹ͜͏ฉ͍͑ͯ͜Δ
ίʔυΛॻ͘͜ͱ ϓϩάϥϜతͳࢥߟΛ͢Δʹ ϓϩάϥϜ
ΞϧΰϦζϜʢΈखॱʣ Λߟ͑Δ͜ͱ ϓϩάϥϜ ϓϩάϥϜతͳࢥߟΛ͢Δʹ
Hands on ͬͯΈΑ͏
࣮ߦڥ w DPOTPMFMPH μΠΞϩάදࣔ w BMFSU w DPOpSN w QSPNQU
ม σʔλܕ ԋࢉࢠ w ࢉज़ԋࢉࢠ w ೖԋࢉࢠ w ൺֱԋࢉࢠ w ཧԋࢉࢠ ؔ w GVODUJPO w Ҿ w Γ w ଈ࣌ؔ w ແ໊ؔ มͷείʔϓ ྻ ࿈ྻʢϋογϡʣ ݅ذ w JG w JGʜFMTF w JGʜFMTFJG w ൺֱԋࢉࢠ w TXJUDI ܁Γฦ͠ w XIJMF w EPʜXIJMF w GPS w GPSʜJO ࠓΓ͍ͨ͜ͱ
Σϒϒϥβ w (PPHMF$ISPNFɺ4BGBSJ ΤσΟλ w ͓͖ͳͷʢ65'Λѻ͑Δͷʣ w σϞ4VCMJNF5FYUΛ༻ ίʔυΛॻ͘ॴ w
)5.-ͷTDSJQUཁૉ w ֎෦KTϑΝΠϧ ݴޠ w +BWB4DSJQU ࣮ߦڥ
DPOTPMFMPH σόοΨͷ8FCίϯιʔϧʹϝοηʔδΛग़ྗ (PPHMF$ISPNFɿදࣔˠ։ൃཧˠ+BWB4DSJQUίϯιʔϧ 4BGBSJɿ։ൃˠΤϥʔίϯιʔϧΛදࣔ 'JSFGPYɿπʔϧˠ8FC։ൃˠ8FCίϯιʔϧ *&ɿʦ'ʧͰ։ൃऀπʔϧΛ։͖ɺʦίϯιʔϧʧλϒΛબ ࣮ߦڥ
Show dialog box μΠΞϩάϘοΫεදࣔ
BMFSU ܯࠂμΠΞϩάΛදࣔ μΠΞϩάϘοΫεදࣔ
DPOpSN ֬ೝμΠΞϩάΛදࣔ μΠΞϩάϘοΫεදࣔ
QSPNQU จࣈೖྗՄೳͳμΠΞϩάΛදࣔ μΠΞϩάϘοΫεදࣔ
Variable ม
Λࣗ༝ʹೖΕସ͑Ͱ͖ΔೖΕ ʁ ͍͋͏ USVF ม ม
มΛ࠷ॳʹ͏ͱ͖ʮWBSʯͰએݴ͢Δ WBSม໊ ม
มͷதʹΛೖΕΔʹʮʯΛ͏ ม໊ ͜ͷΠίʔϧʮೖԋࢉࢠʯͱ͍͏ ೖ ม
Data type σʔλܕ
σʔλܕ σʔλʹʮܕʯ͕͋Δ
σʔλܕ จࣈͷ͜ͱ γϯάϧΫΦʔςʔγϣϯ͔μϒϧΫΦʔςʔγϣϯͰׅΔ 4USJOHܕ จࣈྻ
σʔλܕ ࣈͷ͜ͱ +BWB4DSJQUͰখʢුಈখʣ۠ผ͠ͳ͍ /VNCFSܕ
σʔλܕ USVFʢਅʣɺGBMTFʢِʣͷͲͪΒ͔ ओʹ݅ఆͳͲͰ͏ CPPMFBOܕ ཧ
Expressions and operators ԋࢉࢠ
ͷܭࢉʹ͏ ࢉज़ԋࢉࢠ ԋࢉࢠ
มʹΛೖ͢Δͱ͖ʹ͏ ೖԋࢉࢠ ԋࢉࢠ
ෳͷରΛൺֱ͢Δͱ͖ʹ͏ ൺֱԋࢉࢠ ԋࢉࢠ
݅ͷਅِΛ͢Δͱ͖ʹ͏ ཧԋࢉࢠ ԋࢉࢠ
Array ྻ
ෳͷมΛηοτʹͨ͠Α͏ͳͷ ྻ
ม ม ม ม ม ྻ
࠷ॳʹ͏ͱ͖ʮOFX"SSBZ ʯͰ࡞͢Δ ม໊OFX"SSBZ ྻ
͜ͷΑ͏ʹলུͯ͠ॻ͘͜ͱͰ͖Δ ม໊<> OFX"SSBZ ͱಉ͡ ྻ
Λೖ͢Δͱ͖ม໊ʹʦ൪߸ʧΛ͚Δ ม໊<O> ͜ͷ൪߸ͷ͜ͱΛΩʔͱݺͿ ೖ ྻ
Associative array ࿈ྻ
൪߸Ͱͳ͘ΩʔϫʔυͰཧ͢Δྻ OBNF ࢁాଠ ࿈ྻ BHF TFY IFJHIU XFJHIU ม ม
ม ม ม உ ࿈ྻ
࠷ॳʹ͏ͱ͖ʮOFX0CKFDU ʯͰ࡞͢Δ ม໊OFX0CKFDU ࿈ྻ
ม໊\^ ͜ͷΑ͏ʹলུͯ͠ॻ͘͜ͱͰ͖Δ OFX0CKFDU ͱಉ͡ ࿈ྻ
ม໊<LFZ> ม໊LFZ Λೖ͢Δͱ͖ม໊ʹʦʡΩʔʧΛ͚Δ ·ͨɺม໊ʹυοτ۠ΓͰΩʔΛࢦఆͯ͠0, ೖ ೖ ࿈ྻ
Conditional branch ݅ذ
JG ͬͱجຊతͳ݅ذ ݅ذ
JG ݅ \ ͕݅ਅͷͱ͖ͷॲཧ ^ ݅ذ
JGʜFMTF ύλʔϯΛذ͢Δ ݅ذ
JG ݅ \ ͕݅ਅͷͱ͖ͷॲཧ ^FMTF\ ِ͕݅ͱ͖ͷॲཧ ^ ݅ذ
JGʜFMTFJG ͭҎ্ͷύλʔϯΛذ͢Δ ݅ذ
JG ݅" \ ݅"͕ਅͷͱ͖ͷॲཧ ^FMTFJG ݅# \ ݅#͕ਅͱ͖ͷॲཧ ^FMTF\ ِ͕ͯ͢ͱ͖ͷॲཧ
^ ݅ذ
TXJUDI มͷʹΑͬͯॲཧΛذ ݅ذ
TXJUDI ม \ DBTF" มͷ͕"ͷͱ͖ͷॲཧ DBTF# มͷ͕#ͷͱ͖ͷॲཧ EFGBVMU ͲΕʹͯ·Βͳ͍ͱ͖ͷॲཧ ^
݅ذ
Repeat ܁Γฦ͠
XIJMF ݅Λຬ͍ͨͯ͠Δؒ܁Γฦ͢ ܁Γฦ͠
XIJMF ݅ \ ܁Γฦ͢ॲཧ ^ ͜ͷ݅Λຬ͍ͨͯ͠Δؒͣͬͱ܁Γฦ͞ΕΔ ܁Γฦ͠
EPʜXIJMF ݅Λຬ͍ͨͯ͠Δؒ܁Γฦ͢ʢ࠷ճ࣮ߦ͢Δʣ ܁Γฦ͠
EP\ ܁Γฦ͢ॲཧ ^XIJMF ݅ ແ݅ʹճ͚࣮ͩߦ ͋ͱ͜ͷ݅Λຬ͍ͨͯ͠Δؒͣͬͱ܁Γฦ͞ΕΔ ܁Γฦ͠
GPS ҰఆճͷॲཧΛ܁Γฦ͢ ܁Γฦ͠
GPS WBSJJOJ \ ܁Γฦ͢ॲཧ ^ ͜͜ʹ܁Γฦ͢ճΛࢦఆ͢Δ ܁Γฦ͠
GPSʜJO ྻΛࠪ͢Δʢྻཁૉͷݸ܁Γฦ͢ʣ ܁Γฦ͠
GPS WBSม໊JOྻ໊ \ ܁Γฦ͢ॲཧ ^ ΩʔΛ֨ೲ͢ΔͨΊͷม໊Λࢦఆ ͍ࠪͨ͠ྻ ܁Γฦ͠
Function ؔ
Α͘͏ॲཧʹ໊લΛ͚͍ͭͯͭͰݺͼग़ͤΔΑ͏ʹ͢Δ ʮ)FMMPʯͱ දࣔ͢Δॲཧ ໊ؔʮIFMMPʯ IFMMP )FMMP IFMMP IFMMP )FMMP )FMMP
ؔ
GVODUJPO໊ؔ \ ॲཧ ^ ʮGVODUJPOʯʹଓ໊͍ͯؔΛࢦఆ͢Δ ؔ
Ҿ ࣮ߦଆ͔Βؔʹ͢ ؔ
ؔʹରͯ͠ҙͷσʔλΛ͢ ม ʮNFTTBHFʯ Λදࣔ͢Δॲཧ ໊ؔʮUBML NFTTBHF ʯ UBML )FMMP )FMMP
UBML )FZ UBML ͋ʂ )FZ ͋ʂ ؔ
໊ؔͷ͋ͱͷ ʹҾ໊Λࢦఆ͓ͯ͘͠ GVODUJPO໊ؔ Ҿ໊ \ ॲཧ ^ ͜͜ʹҾ໊Λࢦఆ͓ͯ͘͠ ؔ
ෳͷҾΛࢦఆ͢Δ͜ͱՄೳ GVODUJPO໊ؔ Ҿ Ҿ ʜ \ ॲཧ ^ ΧϯϚͰ۠ͬͯෳࢦఆ ؔ
Γ ͔ؔΒ࣮ߦଆʹฦ͢ ؔ
࣮ߦଆʹର͔ͯؔ͠ΒҙͷσʔλΛฦ͢ Γʹ ʮ)FMMPʯͱ͍͏ จࣈྻΛࢦఆ ໊ؔʮHFU ʯ HFU )FMMP HFU )FMMP
HFU )FMMP ؔ
ʮSFUVSOʯʹଓ͍ͯ͢Λࢦఆ͢Δ GVODUJPO໊ؔ \ SFUVSOΓ ^ ࣮ߦଆʹ͢ ؔ
ʮSFUVSOʯؔΛڧ੍ऴྃ͢ΔͨΊɺҎ߱ͷॲཧ࣮ߦ͞Εͳ͍ GVODUJPO໊ؔ \ ॲཧ" SFUVSO ॲཧ# ^ ॲཧ#࣮ߦ͞Εͳ͍ ؔ
Scope of variables มͷείʔϓ
มʮWBSʯͰએݴ͢ΔҐஔͰ༗ޮͳൣғ͕ҟͳΔ WBSม໊ มͷείʔϓ
WBSOBNF5BSP GVODUJPOUFTU \ DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF ؔͷ֎ଆͰએݴ͞ΕͨมશମͰࢀরͰ͖Δ มͷείʔϓ
WBSOBNF5BSP GVODUJPOUFTU \ DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF มͷείʔϓ
WBSOBNF5BSP GVODUJPOUFTU \ DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF มͷείʔϓ
WBSOBNF5BSP GVODUJPOUFTU \ DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF 5BSP มͷείʔϓ
WBSOBNF5BSP GVODUJPOUFTU \ DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF 5BSP มͷείʔϓ
GVODUJPOUFTU \ WBSOBNF5BSP DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF ؔͷதͰએݴ͞ΕͨมͦͷؔͰ͔͠ࢀরͰ͖ͳ͍ มͷείʔϓ
GVODUJPOUFTU \ WBSOBNF5BSP DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF มͷείʔϓ
GVODUJPOUFTU \ WBSOBNF5BSP DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF มͷείʔϓ
GVODUJPOUFTU \ WBSOBNF5BSP DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF 5BSP มͷείʔϓ
GVODUJPOUFTU \ WBSOBNF5BSP DPOTPMFMPH OBNF ^ UFTU DPOTPMFMPH
OBNF &SSPS มͷείʔϓ
GVODUJPOUFTU \ WBSOBNF5BSP DPOTPMFMPH OBNF SFUVSOOBNF ^ WBSVTFSUFTU
DPOTPMFMPH VTFS 5BSP ΓΛ͏ มͷείʔϓ