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
620
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
AI コーディングエージェントの時代へ:JetBrains が描く開発の未来
masaruhr
1
140
Porting a visionOS App to Android XR
akkeylab
0
460
レベル1の開発生産性向上に取り組む − 日々の作業の効率化・自動化を通じた改善活動
kesoji
0
190
第9回 情シス転職ミートアップ 株式会社IVRy(アイブリー)の紹介
ivry_presentationmaterials
1
320
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
euglena1215
1
160
Flutterで備える!Accessibility Nutrition Labels完全ガイド
yuukiw00w
0
160
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
koboriakira
0
590
Webの外へ飛び出せ NativePHPが切り拓くPHPの未来
takuyakatsusa
2
550
0626 Findy Product Manager LT Night_高田スライド_speaker deck用
mana_takada
0
170
効率的な開発手段として VRTを活用する
ishkawa
0
140
おやつのお供はお決まりですか?@WWDC25 Recap -Japan-\(region).swift
shingangan
0
130
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
530
Featured
See All Featured
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
Thoughts on Productivity
jonyablonski
69
4.7k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
690
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Why Our Code Smells
bkeepers
PRO
336
57k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
950
Site-Speed That Sticks
csswizardry
10
690
Speed Design
sergeychernyshev
32
1k
Agile that works and the tools we love
rasmusluckow
329
21k
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/ 歡迎加 好友