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
Learn JavaScript Well
Search
高見龍
October 25, 2020
Programming
1
1.3k
Learn JavaScript Well
MOPCON 2020 分享主題「打造資深實力 - 你該學好的 JavaScript」
高見龍
October 25, 2020
Tweet
Share
More Decks by 高見龍
See All by 高見龍
為你自己學 Python
eddie
0
620
Generative AI 年會小聚 - AI 教我寫程式
eddie
0
98
讓數據說話:用 Python、Prometheus 和 Grafana 講故事
eddie
0
630
AI 時代的程式語言學習法
eddie
0
140
前端模組解放運動 - importmap
eddie
0
1.4k
Git 和 DevOps - 在混亂的流星群開發流程中找到小確幸
eddie
1
1.2k
模組化前端開發:從亂七八糟到組織有序
eddie
0
1.6k
被 Vue 框架耽誤的建置工具
eddie
2
1k
開開心心寫測試,你的程式碼也會微笑
eddie
1
1.3k
Other Decks in Programming
See All in Programming
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
150
AWS Summit Japan 2024と2025の比較/はじめてのKiro、今あなたは岐路に立つ
satoshi256kbyte
0
120
オンコール⼊⾨〜ページャーが鳴る前に、あなたが備えられること〜 / Before The Pager Rings
yktakaha4
2
990
코딩 에이전트 체크리스트: Claude Code ver.
nacyot
0
930
ソフトウェア品質を数字で捉える技術。事業成長を支えるシステム品質の マネジメント
takuya542
2
15k
DMMを支える決済基盤の技術的負債にどう立ち向かうか / Addressing Technical Debt in Payment Infrastructure
yoshiyoshifujii
3
410
マッチングアプリにおけるフリックUIで苦労したこと
yuheiito
0
190
Goで作る、開発・CI環境
sin392
0
260
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
760
MCPを使ってイベントソーシングのAIコーディングを効率化する / Streamlining Event Sourcing AI Coding with MCP
tomohisa
0
170
dbt民主化とLLMによる開発ブースト ~ AI Readyな分析サイクルを目指して ~
yoshyum
3
1.1k
LT 2025-06-30: プロダクトエンジニアの役割
yamamotok
0
870
Featured
See All Featured
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Why You Should Never Use an ORM
jnunemaker
PRO
58
9.5k
Adopting Sorbet at Scale
ufuk
77
9.5k
The Cost Of JavaScript in 2023
addyosmani
51
8.6k
Become a Pro
speakerdeck
PRO
29
5.4k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
700
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
How GitHub (no longer) Works
holman
314
140k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.7k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Transcript
ޒഒላӃ .01$0/ ଧࢿਂመྗ 你該學好的 JavaScript ҝ㟬ࣗݾላ
a.k.a Eddie 愛現! 喜歡冷門的玩具 Ruby/Rails 開發者、講師 Ruby 技術推廣、教育、諮詢 台灣、日本等國內外 Ruby
技術研討會講者 部落格:https://kaochenlong.com 高見龍@eddiekao
ޒഒላӃ .01$0/ 第18刷 發售中 發售中 發售中
ޒഒላӃ .01$0/ Git 小教室
ޒഒላӃ .01$0/ 已絕版
ޒഒላӃ .01$0/ 敬請 期待
ޒഒላӃ .01$0/ ༗ᘋ㐸 電子書
ޒഒላӃ .01$0/ ʮላशෆधཁҝެ࢘ɺҝɼ ෆधཁҝผਓɼҝ你ࣗݾʯ ߴݟཾ
ޒഒላӃ .01$0/ ৬ೈᱪఔࢣʁ
ޒഒላӃ .01$0/ ೖҎ্ɼதڃະᕝ
ޒഒላӃ .01$0/ େߝ
ޒഒላӃ .01$0/ େߝ w+BWB4DSJQUతᢛෆ wಹࠣ༗झత+BWB4DSJQUޠ๏എޙతނࣄ w你ٕ֘ೳᴍᏐᴍࡏṜࠣํʂ wኺ৽ख্࿏౸അ్ࣝ
ޒഒላӃ .01$0/ DISCLAIMER 本次分享內容可能隱含部份商業或課程置入訊 息,請謹慎評估!
ޒഒላӃ .01$0/ ᪑ෆ
ޒഒላӃ .01$0/ ʮՖऒᚙɼ+BWB4DSJQUಹॄኄᗞઃܭʂʯ ᢛෆ
ޒഒላӃ .01$0/ ʮੈք্༗ၷछఔࣜޠݴɼ Ұछඃഃ౸ष಄ɼ另Ұछᔒਓ༻ʯ $ ೭#KBSOF4USPVTUSVQ ᢛෆ
ޒഒላӃ .01$0/ +4-JOU ᢛෆ
ޒഒላӃ .01$0/ +4-JOU Մೳ။ᩋ你᧷ಘࣗݾෆ။ሜఔࣜʂ ᢛෆ
ޒഒላӃ .01$0/ function hello() { return "world"; } function hello()
{ return "world"; } ᢛෆ
ޒഒላӃ .01$0/ 㑌छఔࣜޠݴ༗ᢛෆతҰ໘ ᢛෆ
ޒഒላӃ .01$0/ ෆཁੋ᪑ஶ鄉ຽҰىഃ ᢛෆ
ޒഒላӃ .01$0/ ༗झޠ๏എޙతނࣄ
ޒഒላӃ .01$0/ 你ಓએࠂੋዎኄҰճࣄ嗎ʁ ༗झޠ๏
ޒഒላӃ .01$0/ ᏓᏐએࠂ ༗झޠ๏
ޒഒላӃ .01$0/ var a = 1; console.log(a); // 會印出什什麼? ༗झޠ๏
1
ޒഒላӃ .01$0/ console.log(a); // 會印出? var a = 1; ༗झޠ๏
undefined
ޒഒላӃ .01$0/ ᏓᏐఏঢ 7BSJBCMF)PJTUJOH ༗झޠ๏
ޒഒላӃ .01$0/ var a; console.log(a); // 所以印出 undefined a =
1; ༗झޠ๏ 被拉到上面?
ޒഒላӃ .01$0/ ฤᩄWTᩄ $PNQJMBUJPOWT*OUFSQSFUBUJPO ༗झޠ๏
ޒഒላӃ .01$0/ ݐཱظWTࣥߦظ $SFBUJPO1IBTFWT&YFDVUJPO1IBTF ༗झޠ๏
ޒഒላӃ .01$0/ ݐཱظ Ḽ໊ʢ*EFOUJpFSʣ ਐߦॳ࢝Խ 1A 1B ༗झޠ๏
ޒഒላӃ .01$0/ ࣥߦظ ࣥߦവᏐො值 2 ༗झޠ๏
ޒഒላӃ .01$0/ var a = 1; console.log(a); ༗झޠ๏ ݐཱظ var
a; console.log(a); undefined 1A 1B
ޒഒላӃ .01$0/ var a = 1; console.log(a); ༗झޠ๏ ࣥߦظ a
= 1; console.log(a); 1 2 2
ޒഒላӃ .01$0/ ၷ֊ஈ ༗झޠ๏
ޒഒላӃ .01$0/ console.log(a); var a = 1; ༗झޠ๏ ݐཱظ console.log(a);
var a; undefined 1A 1B
ޒഒላӃ .01$0/ console.log(a); var a = 1; ༗झޠ๏ ࣥߦظ console.log(a);
a = 1; undefined 1 2 2
ޒഒላӃ .01$0/ খଌᱛ ༗झޠ๏
ޒഒላӃ .01$0/ var a = 1; var a; console.log(a); //
會印出什什麼? ༗झޠ๏ 1
ޒഒላӃ .01$0/ if (false) { var a = 1; }
console.log(a); // 會印出什什麼? ༗झޠ๏ undefined
ޒഒላӃ .01$0/ 另ҰछᏓᏐએࠂ ༗झޠ๏
ޒഒላӃ .01$0/ console.log(a); // 會印出什什麼? let a = 1; ༗झޠ๏
Reference Error
ޒഒላӃ .01$0/ ҼҝMFUෆ။ᏓᏐఏঢʁ ༗झޠ๏
ޒഒላӃ .01$0/ console.log(a); let a = 1; ༗झޠ๏ ݐཱظ console.log(a);
let a; 1A TDZ
ޒഒላӃ .01$0/ console.log(a); let a = 1; ༗झޠ๏ ࣥߦظ console.log(a);
a = 1; Reference Error 2
ޒഒላӃ .01$0/ ࣌ࢮე 5%;5FNQPSBM%FBE;POF ༗झޠ๏
ޒഒላӃ .01$0/ let a = 1; console.log(a); // 會印出什什麼? ༗झޠ๏
ޒഒላӃ .01$0/ let a = 1; console.log(a); ༗झޠ๏ ݐཱظ let
a; console.log(a); 1A TDZ
ޒഒላӃ .01$0/ let a = 1; console.log(a); ༗झޠ๏ ࣥߦظ a
= 1; console.log(a); 1 2 2
ޒഒላӃ .01$0/ MFU৽൛తWBS Ҏޙ༻MFUबྃʁ ༗झޠ๏
ޒഒላӃ .01$0/ വᏐએࠂ ༗झޠ๏
ޒഒላӃ .01$0/ sayHello(); function sayHello() { console.log('hello'); } ༗झޠ๏ ?
ޒഒላӃ .01$0/ sayHello(); function sayHello() { console.log('hello'); } ༗झޠ๏ ݐཱظ
1A 1B sayHello(); function sayHello() { console.log('hello'); } 2
ޒഒላӃ .01$0/ sayHello(); function sayHello() { console.log('hello'); } ༗झޠ๏ sayHello();
function sayHello() { console.log('hello'); } 2 ࣥߦظ hello
ޒഒላӃ .01$0/ { } ༗झޠ๏ 物件? Block?
ޒഒላӃ .01$0/ { hello: '哈囉' } ༗झޠ๏ 物件
ޒഒላӃ .01$0/ { hello: for (var i = 0; i
< 10; i++ ) { if (i % 2 === 0) { continue hello; } console.log(i); } } ༗झޠ๏ label label Block
ޒഒላӃ .01$0/ + 加號? 十字架? ༗झޠ๏
ޒഒላӃ .01$0/ DPFSDJPO<ˋkoʊˈɝː.ʃən> 5IFVTFPGGPSDFUPQFSTVBEFTPNFPOFUPEP TPNFUIJOHUIBUUIFZBSFVOXJMMJOHUPEP ༗झޠ๏
ޒഒላӃ .01$0/ +'' // 0 +[] // 0 +{} //
NaN +-1 // -1 +true // 1 +false // 0 +undefined // NaN +null // 0 ༗झޠ๏
ޒഒላӃ .01$0/ [] + [] // ? [] + {}
// ? {} + [] // ? ༗झޠ๏
ޒഒላӃ .01$0/ [] + [] ༗झޠ๏
ޒഒላӃ .01$0/ ༗झޠ๏
ޒഒላӃ .01$0/ [] + [] [].toString() + [].toString() ༗झޠ๏ 空字串
空字串
ޒഒላӃ .01$0/ [] + {} ༗झޠ๏
ޒഒላӃ .01$0/ [] + {} [].toString() + {}.toString() ༗झޠ๏ '[object
Object]' 字串串 空字串
ޒഒላӃ .01$0/ {} + [] ༗झޠ๏ Block
ޒഒላӃ .01$0/ [] + {} Block 後⾯面跟了了 +[] ༗झޠ๏ 0
ޒഒላӃ .01$0/ [] + [] // '' [] + {}
// '[object Object]' {} + [] // 0 ༗झޠ๏
ޒഒላӃ .01$0/ /B//PU"/VNCFS ༗झޠ๏
ޒഒላӃ .01$0/ console.log(typeof NaN); // 會印出什什麼? number ༗झޠ๏
ޒഒላӃ .01$0/ /B/ੋҰछᏐࣈ ୠሏ༻ိදࣔʮෆੋᏐࣈʯ ༗झޠ๏
ޒഒላӃ .01$0/ ʮݸᥒʯ᪑ʮݸᥒʯతࠩผʁ ༗झޠ๏
ޒഒላӃ .01$0/ ʮݸᥒෆ။ൺֱܕผʁʯ ༗झޠ๏
ޒഒላӃ .01$0/ ݸᥒ᪑ݸᥒతࠩผʁ ༗झޠ๏
ޒഒላӃ .01$0/ ཧղࡉઅ ༗झޠ๏
ޒഒላӃ .01$0/ 你ٕ֘ೳᴍᏐᴍࡏṜࠣํʂ ਓੜۤ
ޒഒላӃ .01$0/ ಓཧେՈಓɼୠೳ၏౸తᔒଟগ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ٕೳᴍᏐ༗ݶ ਓੜᴍᏐ
ޒഒላӃ .01$0/ Ռཁࢿࡏ+BWB4DSJQUత ਓੜᴍᏐ
ޒഒላӃ .01$0/ ਂೖ+BWB4DSJQU w݅ಋ wവᏐ$MPTVSF wUIJT wඇಉ㑊႔ཧ w&4.PEVMF
ޒഒላӃ .01$0/ ֘ላલᐽՍ嗎ʁ֘ላ哪Ұݸʁ ਓੜᴍᏐ "
ޒഒላӃ .01$0/ ؐཁෆཁላK2VFSZʁ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ֘ላࢿྉ݁ߏɺԋࢉ๏嗎ʁ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ؐ༗ॄኄʁ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ൛ຊ߇੍ ਓੜᴍᏐ 非業配
ޒഒላӃ .01$0/ "TTFUଧแ۩ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ཆจ݅తश׳ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ӳจ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ࢿҰఆ༗෩ᯃɼٕज़ࢿ༗ᩲ༗ഛɼ ਃߪલጯৄ閱ެ։說໌ॻɻ ਓੜᴍᏐ
ޒഒላӃ .01$0/ ኺ৽ख্࿏౸അ్ࣝ
ޒഒላӃ .01$0/ ૉਓ৬ޭతՄೳੑʁ ৽खᢛഅ
ޒഒላӃ .01$0/ զෆੋՊ൝ඟۀత ৽खᢛഅ
ޒഒላӃ .01$0/ զཁઌላ哪Ұఔࣜޠݴʁ ৽खᢛഅ
ޒഒላӃ .01$0/ ઌ辦๏፤౸ථʂ ৽खᢛഅ
ޒഒላӃ .01$0/ ઌᏓʮ৽खʯ ৽खᢛഅ
ޒഒላӃ .01$0/ ၏ላతํࣜ ৽खᢛഅ
ޒഒላӃ .01$0/ େ෦份తٕज़ඃᚙ໌ग़ိ ੋཁղܾಛఆత ৽खᢛഅ
ޒഒላӃ .01$0/ അ్ࣝ೭༌ೖἫ ৽खᢛഅ
ޒഒላӃ .01$0/ ॏᴍɿจ݅ن֨ख ࣗզ ৽खᢛഅ
ޒഒላӃ .01$0/ ৽खᢛഅ
ޒഒላӃ .01$0/ ৽खᢛഅ
ޒഒላӃ .01$0/ ཧղࡉઅ ৽खᢛഅ
ޒഒላӃ .01$0/ อ࣋ح৺ ৽खᢛഅ
ޒഒላӃ .01$0/ ෆཁ࠶૬৴ᔒ༗ࠜᎦత說๏ྃ ৽खᢛഅ
ޒഒላӃ .01$0/ ҆፻ʁ ৽खᢛഅ
ޒഒላӃ .01$0/ ᩇॻʂ ৽खᢛഅ
ޒഒላӃ .01$0/ ਪનॻ ৽खᢛഅ
ޒഒላӃ .01$0/ ਪનॻ w:PV%POU,OPX+4ܥྻ w᮷阱ʂޡղʂఱॏ৽ೝࣝ+BWB4DSJQUʂ w&MPRVFOU+BWB4DSJQU w&GGFDUJWF+BWB4DSJQU
ޒഒላӃ .01$0/ 閱ᩇݪ࢝ᛰ ৽खᢛഅ
ޒഒላӃ .01$0/ ( function( global, factory ) { "use strict";
// 略略 } )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) { // 略略 IIFE ৽खᢛഅ
ޒഒላӃ .01$0/ അ్ࣝ೭༌ग़Ἣ ৽खᢛഅ
ޒഒላӃ .01$0/ ࢪൺडߋ༗ಘ ৽खᢛഅ
ޒഒላӃ .01$0/ ʮՌ你ߨ౸࿈你Ѩ嫲ᡒత懂తʯ ৽खᢛഅ
ޒഒላӃ .01$0/ 㑚Ө ࣗݴࣗޠʂ ৽खᢛഅ
ޒഒላӃ .01$0/ ሜจষ ৽खᢛഅ
ޒഒላӃ .01$0/ ሜจষෆੋҝྃߚɺ ࣕੋҝྃࢥߟᢛࣗզሣ ৽खᢛഅ
ޒഒላӃ .01$0/ J5)PNFਓᩱ ৽खᢛഅ
ޒഒላӃ .01$0/ 4JEF1SPKFDU ৽खᢛഅ
ޒഒላӃ .01$0/ ৽ख্࿏ ৽खᢛഅ
ޒഒላӃ .01$0/ ෆཁযྀɺෆཁᛇ
ޒഒላӃ .01$0/ photo by redjar
ޒഒላӃ .01$0/ photo by Quality & Style
ޒഒላӃ .01$0/ Ҏ্Ͱ͢ʂ
ޒഒላӃ .01$0/ 歡迎加 好友