SlideShare a Scribd company logo
Submit Search
Upload
2. 型態、變數與運算子
Report
Share
Justin Lin
Technology / Community Evangelist at Free lancer
Follow
•
0 likes
•
588 views
1
of
76
2. 型態、變數與運算子
•
0 likes
•
588 views
Report
Share
Download Now
Download to read offline
Technology
使用REPL 認識內建型態 使用 let、const、var 宣告變數 掌握型態轉換
Read more
Justin Lin
Technology / Community Evangelist at Free lancer
Follow
Recommended
1. JavaScript 起步走 by
1. JavaScript 起步走
Justin Lin
772 views
•
20 slides
CH1. 簡介 Web 應用程式 by
CH1. 簡介 Web 應用程式
Justin Lin
1.2K views
•
55 slides
Ch12 Spring 起步走 by
Ch12 Spring 起步走
Justin Lin
274 views
•
31 slides
Ansible 101 by
Ansible 101
YI-CHING WU
138 views
•
101 slides
Ch03 請求與回應 by
Ch03 請求與回應
Justin Lin
236 views
•
73 slides
Java Tutorial:Learn Java in 06:00:00 by
Java Tutorial:Learn Java in 06:00:00
Justin Lin
27.5K views
•
98 slides
More Related Content
What's hot
Java SE 再入門 by
Java SE 再入門
minazou67
19K views
•
128 slides
Spring Bootでチャットツールを作りながらWebの仕組みを理解しよう! by
Spring Bootでチャットツールを作りながらWebの仕組みを理解しよう!
Java女子部
13.6K views
•
81 slides
Practical migration from JSP to Thymeleaf by
Practical migration from JSP to Thymeleaf
Toshiki Iga
1.1K views
•
70 slides
より速く より運用しやすく 進化し続けるJVM(Java Developers Summit Online 2023 発表資料) by
より速く より運用しやすく 進化し続けるJVM(Java Developers Summit Online 2023 発表資料)
NTT DATA Technology & Innovation
772 views
•
64 slides
CH04:認識物件 by
CH04:認識物件
Justin Lin
421 views
•
87 slides
使ってみよう!JDK Flight Recorder by
使ってみよう!JDK Flight Recorder
Yoshiro Tokumasu
2.3K views
•
68 slides
What's hot
(20)
Java SE 再入門 by minazou67
Java SE 再入門
minazou67
•
19K views
Spring Bootでチャットツールを作りながらWebの仕組みを理解しよう! by Java女子部
Spring Bootでチャットツールを作りながらWebの仕組みを理解しよう!
Java女子部
•
13.6K views
Practical migration from JSP to Thymeleaf by Toshiki Iga
Practical migration from JSP to Thymeleaf
Toshiki Iga
•
1.1K views
より速く より運用しやすく 進化し続けるJVM(Java Developers Summit Online 2023 発表資料) by NTT DATA Technology & Innovation
より速く より運用しやすく 進化し続けるJVM(Java Developers Summit Online 2023 発表資料)
NTT DATA Technology & Innovation
•
772 views
CH04:認識物件 by Justin Lin
CH04:認識物件
Justin Lin
•
421 views
使ってみよう!JDK Flight Recorder by Yoshiro Tokumasu
使ってみよう!JDK Flight Recorder
Yoshiro Tokumasu
•
2.3K views
GCを発生させないJVMとコーディングスタイル by Kenji Kazumura
GCを発生させないJVMとコーディングスタイル
Kenji Kazumura
•
2.5K views
Ansible: Infrastructure as Code for OpenShift by Ignacio Sánchez Ginés
Ansible: Infrastructure as Code for OpenShift
Ignacio Sánchez Ginés
•
569 views
[2018 .NET Conf].NET Core與Azure DevOps應用於企業開發 by Edward Kuo
[2018 .NET Conf].NET Core與Azure DevOps應用於企業開發
Edward Kuo
•
420 views
Java SE 8 技術手冊第 5 章 - 物件封裝 by Justin Lin
Java SE 8 技術手冊第 5 章 - 物件封裝
Justin Lin
•
3.4K views
Angular Material (2) - NgVikingsConf by Tracy Lee
Angular Material (2) - NgVikingsConf
Tracy Lee
•
1.8K views
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service by Tadashi Nemoto
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service
Tadashi Nemoto
•
610 views
GraalVMを3つの主機能から眺めてみよう(Oracle Groundbreakers APAC Virtual Tour 2020 講演資料) by NTT DATA Technology & Innovation
GraalVMを3つの主機能から眺めてみよう(Oracle Groundbreakers APAC Virtual Tour 2020 講演資料)
NTT DATA Technology & Innovation
•
1.6K views
Introduction to Spring Framework by Hùng Nguyễn Huy
Introduction to Spring Framework
Hùng Nguyễn Huy
•
528 views
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。 by なおき きしだ
だれも教えてくれないJavaの世界。 あと、ぼくが会社員になったわけ。
なおき きしだ
•
42.5K views
Rancher and Kubernetes Best Practices by Avinash Patil
Rancher and Kubernetes Best Practices
Avinash Patil
•
511 views
Jvm言語とJava、切っても切れないその関係 by yy yank
Jvm言語とJava、切っても切れないその関係
yy yank
•
9.7K views
ジェネリクスの基礎とクラス設計への応用 by nagise
ジェネリクスの基礎とクラス設計への応用
nagise
•
30.6K views
Spring Data Jpa by Ivan Queiroz
Spring Data Jpa
Ivan Queiroz
•
926 views
아해2019 SpringAOP 문겸 by MoonGyeom1
아해2019 SpringAOP 문겸
MoonGyeom1
•
934 views
Similar to 2. 型態、變數與運算子
Character Encoding - Concepts and Practices by
Character Encoding - Concepts and Practices
rogeryi
795 views
•
15 slides
10. 進入瀏覽器 by
10. 進入瀏覽器
Justin Lin
283 views
•
80 slides
Servlet & JSP 教學手冊第二版 - 第 7 章:使用 JSTL by
Servlet & JSP 教學手冊第二版 - 第 7 章:使用 JSTL
Justin Lin
2.9K views
•
71 slides
Unicode ncr by
Unicode ncr
Brian Hsu
867 views
•
20 slides
Erlang分布式系统的的领域语言 by
Erlang分布式系统的的领域语言
Feng Yu
5.5K views
•
44 slides
Internet Explorer相容性設計考量 by
Internet Explorer相容性設計考量
Bill Lin
1.7K views
•
20 slides
Similar to 2. 型態、變數與運算子
(19)
Character Encoding - Concepts and Practices by rogeryi
Character Encoding - Concepts and Practices
rogeryi
•
795 views
10. 進入瀏覽器 by Justin Lin
10. 進入瀏覽器
Justin Lin
•
283 views
Servlet & JSP 教學手冊第二版 - 第 7 章:使用 JSTL by Justin Lin
Servlet & JSP 教學手冊第二版 - 第 7 章:使用 JSTL
Justin Lin
•
2.9K views
Unicode ncr by Brian Hsu
Unicode ncr
Brian Hsu
•
867 views
Erlang分布式系统的的领域语言 by Feng Yu
Erlang分布式系统的的领域语言
Feng Yu
•
5.5K views
Internet Explorer相容性設計考量 by Bill Lin
Internet Explorer相容性設計考量
Bill Lin
•
1.7K views
Mesos intro by dennis zhuang
Mesos intro
dennis zhuang
•
835 views
[圣思园][Java SE]Network by ArBing Xie
[圣思园][Java SE]Network
ArBing Xie
•
1.1K views
Some tips by Wei-Bo Chen
Some tips
Wei-Bo Chen
•
898 views
嵌入式平台移植技巧概說 by Joseph Lu
嵌入式平台移植技巧概說
Joseph Lu
•
7.6K views
Linux File system by Kenny (netman)
Linux File system
Kenny (netman)
•
1.7K views
DEV305 - ASP.NET 5 開發攻略 by Will Huang
DEV305 - ASP.NET 5 開發攻略
Will Huang
•
6.1K views
開發人員必須知道的 Kubernetes 核心技術 - Kubernetes Summit 2018 by Will Huang
開發人員必須知道的 Kubernetes 核心技術 - Kubernetes Summit 2018
Will Huang
•
11.8K views
构建私有云计算平台的Eucalyptus架构分析 by liangxiao0315
构建私有云计算平台的Eucalyptus架构分析
liangxiao0315
•
694 views
基于Symfony框架下的快速企业级应用开发 by mysqlops
基于Symfony框架下的快速企业级应用开发
mysqlops
•
1K views
Ch02 撰寫與設定Servlet by Justin Lin
Ch02 撰寫與設定Servlet
Justin Lin
•
1K views
Servlet & JSP 教學手冊第二版 - 第 2 章:撰寫與設定 Servlet by Justin Lin
Servlet & JSP 教學手冊第二版 - 第 2 章:撰寫與設定 Servlet
Justin Lin
•
6.1K views
Windows Container 101: dotNET, Container, Kubernetes by Will Huang
Windows Container 101: dotNET, Container, Kubernetes
Will Huang
•
1.9K views
Asp.net mvc 6 新功能初探 by Gelis Wu
Asp.net mvc 6 新功能初探
Gelis Wu
•
2.7K views
More from Justin Lin
Ch14 簡介 Spring Boot by
Ch14 簡介 Spring Boot
Justin Lin
872 views
•
22 slides
Ch13 整合 Spring MVC/Security by
Ch13 整合 Spring MVC/Security
Justin Lin
280 views
•
58 slides
Ch11 簡介 JavaMail by
Ch11 簡介 JavaMail
Justin Lin
157 views
•
8 slides
Ch10 Web 容器安全管理 by
Ch10 Web 容器安全管理
Justin Lin
153 views
•
30 slides
Ch09 整合資料庫 by
Ch09 整合資料庫
Justin Lin
233 views
•
92 slides
Ch08 自訂標籤 by
Ch08 自訂標籤
Justin Lin
133 views
•
54 slides
More from Justin Lin
(20)
Ch14 簡介 Spring Boot by Justin Lin
Ch14 簡介 Spring Boot
Justin Lin
•
872 views
Ch13 整合 Spring MVC/Security by Justin Lin
Ch13 整合 Spring MVC/Security
Justin Lin
•
280 views
Ch11 簡介 JavaMail by Justin Lin
Ch11 簡介 JavaMail
Justin Lin
•
157 views
Ch10 Web 容器安全管理 by Justin Lin
Ch10 Web 容器安全管理
Justin Lin
•
153 views
Ch09 整合資料庫 by Justin Lin
Ch09 整合資料庫
Justin Lin
•
233 views
Ch08 自訂標籤 by Justin Lin
Ch08 自訂標籤
Justin Lin
•
133 views
Ch07 使用 JSTL by Justin Lin
Ch07 使用 JSTL
Justin Lin
•
161 views
Ch06 使用 JSP by Justin Lin
Ch06 使用 JSP
Justin Lin
•
250 views
Ch05 Servlet 進階 API、過濾器與傾聽器 by Justin Lin
Ch05 Servlet 進階 API、過濾器與傾聽器
Justin Lin
•
204 views
Ch04 會話管理 by Justin Lin
Ch04 會話管理
Justin Lin
•
238 views
Ch02 撰寫與設定 Servlet by Justin Lin
Ch02 撰寫與設定 Servlet
Justin Lin
•
352 views
14. 進階主題 by Justin Lin
14. 進階主題
Justin Lin
•
406 views
13.並行、平行與非同步 by Justin Lin
13.並行、平行與非同步
Justin Lin
•
237 views
12. 除錯、測試與效能 by Justin Lin
12. 除錯、測試與效能
Justin Lin
•
153 views
11. 常用內建模組 by Justin Lin
11. 常用內建模組
Justin Lin
•
149 views
10. 資料永續與交換 by Justin Lin
10. 資料永續與交換
Justin Lin
•
156 views
9. 資料結構 by Justin Lin
9. 資料結構
Justin Lin
•
292 views
8. open() 與 io 模組 by Justin Lin
8. open() 與 io 模組
Justin Lin
•
245 views
7. 例外處理 by Justin Lin
7. 例外處理
Justin Lin
•
115 views
6. 類別的繼承 by Justin Lin
6. 類別的繼承
Justin Lin
•
166 views
2. 型態、變數與運算子
2.
2.型態、變數與運算子 • 學習目標 – 使用REPL –
認識內建型態 – 使用 let、const、var 宣告變數 – 掌握型態轉換 2
3.
使用 REPL 3
4.
4
5.
5
6.
6
7.
撰寫 JavaScript 原始碼 7
8.
8
9.
哈囉!世界! 9
10.
10 UTF-8
11.
• ECMAScript並沒有規定原始碼檔案必須採 用何種編碼儲存 • 現今Web應用程式開發也建議,在HTML、 JavaScript等檔案儲存時採用UTF-8編碼 11
12.
UCS-2/UTF-16 • JavaScript字串最初採用的內部編碼是 UCS-2 • 兩個位元組為一個碼元(Code
unit) • ISO/IEC與Unicode Consortium兩個團隊 都打算統一字元集 • 合併之後才發佈了Unicode 1.0 12
13.
• 越來越多的字元被納入Unicode字元集,超 出碼點U+0000至U+FFFF可容納的範圍 • 1996年公佈了UTF-16,除了沿用UCS-2兩 個位元組的編碼部份之外,也採用四個位 元組來編碼更多的字元 •
UTF-16編碼可能是兩個或四個位元組 • JavaScript後來才支援UTF-16 13
14.
內建型態 • 基本(Primitive)型態 • 複合(Composite)型態 •
兩個特殊的值null與undefined 14
15.
基本型態 • 數字(number) • 字串(string) •
布林(boolean) • ES6增加了符號(symbol) 15
16.
數字 • 都是〈IEEE 754〉標準64位元浮點數 16
17.
• 字串剖析為數字,可以使用Number()函式 17
18.
18
19.
• 想知道資料型態,方法之一是使用typeof 19
20.
字串 • 可以使用''或""包括文字 20
21.
21
22.
• 沒有字元型態,以單引號或雙引號來包括 單一Unicode字元,也是字串型態 22
23.
• 處理U+0000至U+FFFF以外的字元,以字 元在UTF-16編碼時的高低位元組來表示, 也就是使用兩個碼元 • 例如高音譜記號
的Unicode碼點為 U+1D11E,必須撰寫為'uD834uDD1E' 來表示,這稱為代理對(Surrogate pair) • ES6增加了u{…}表示法 23
24.
• 早期UCS-2就存在的API或索引,在處理字 串時是以碼元為處理單位 • 支援UTF-16後為了兼顧相容性, ECMAScript規定使用UTF-16碼元作為字 串的元素(Element)單位 24
25.
• 例如字串的length可以用來得知字串的 「元素」數量 25
26.
• 字串的charAt()方法,索引由0開始,元素 是以碼元為單位 – 'u{1D11E}'.charAt(0)方法取得的元素 是碼元'uD834',而不是Unicode字元 'u{1D11E}‘ •
JavaScript中的uhhhh,其實是碼元表示 方式 • 如果環境允許,在指定碼點時,建議使用 u{…}來取代uhhhh 26
27.
• ES6增強了對Unicode的支援 27
28.
布林 • 布林值只有兩個值,true與false • 使用typeof,
結果會是'boolean' 28
29.
複合型態 • 就是指物件(Object) • 帶有額外的特性或方法 •
typeof都會傳回'object‘ • 物件實字(Object literal) 29
30.
• 在撰寫物件實字的同時,指定物件的特性 30
31.
• 物件的特性名稱其實是個字串 • 可以隨時為物件新增特性,或者使用 delete運算子來刪除特性 31
32.
• 基本型態數字、字串與布林,會在必要的 時候,自動建立對應的包裹物件 • 分別為Number、String與Boolean實例 32
33.
• 可以直接建立包裹物件 33
34.
使用陣列 • 可以使用陣列實字(Array literal) •
每個陣列都是Array的實例 34
35.
• 索引若超出陣列範圍,不會發生錯誤 35
36.
• 雖然可以直接改變length的值,然而極度 不建議這麼做 • 操作陣列時,應避免陣列產生空項目 36
37.
類陣列 • 陣列並不是記憶體中開設連續的線性空間 像是個使用數字作為特性名稱的物件 37
38.
• 使用物件來模擬陣列 38
39.
• 在ES6中新增的Array.from()函式可以指 定類陣列 • 從ES5開始,字串也是類陣列 39
40.
• 雖然字串是類陣列,不過字串內容無法變 動(Immutable) • 字串元素是以碼元為單位,指定索引取得 的元素是一個碼元,而不是字元 40
41.
變數 41
42.
• let與const是ES6新增語法,在環境允許 的情況下,建立變數或常數應該優先使用 • 程式語言可分靜態定型(Statically- typed)、動態定型(Dynamically-typed) •
JavaScript屬於動態定型語言 42
43.
鴨子定型 • 若想透過變數操作物件的某特性或方法, 只要確認該物件上確實有該特性或方法 • 如果它走路像個鴨子,游泳像個鴨子,叫 聲像個鴨子,那它就是鴨子。 43
44.
• 對基本型態來說,變數儲存了被指定的值, • 對複合型態來說,變數始終是個參考(對 應)至物件的名稱,指定運算只是改變了 變數的參考對象 44
45.
• 對於const宣告的常數,只是指不能重新 設定該名稱參考的物件 45
46.
• 如果沒有使用let或const來宣告變數或常 數,會發生ReferenceError,表示「變 數未定義」 • 使用let宣告變數時,若該變數已經存在, 會引發SyntaxError •
如果let宣告了變數,然而沒有指定值,執 行完宣告後,會給予undefined 46
47.
• 在ES5或更早版本中,並沒有let、const 可以使用,宣告變數其實是使用var • var宣告的變數,在其宣告所在地前後範圍 內都是有效的,稱為提昇(Hoisting) 47
48.
• 絕大多數情況,不會希望變數有提昇行為 • 使用let也是會有提昇行為,只不過存在著 暫時死區(Temporal
dead zone) – 在正式執行let該行前,變數不會被給予值 (連undefined都不給) • 使用var宣告變數時,若該變數已經存在, 並不會有任何錯誤,這不是好的特性 48
49.
undefined與null • 無論是使用let或var,若宣告變數時未指 定值,變數會被給予特殊值undefined • 試圖取得物件上不存在的特性時,也會傳 回undefined •
undefined是JavaScript中的特殊值,表 示值沒有定義 49
50.
• 對undefined使用typeof的結果是 'undefined' • undefined本身等於undefined 50
51.
• undefined在JavaScript中不是保留字 • void運算子放在任何值或運算式前,都會 產生undefined 51
52.
• null用來表示沒有物件 • 對null使用typeof會得到'object' •
null並非是Object的實例 • 試圖存取null的特性或呼叫方法,會引發 TypeError 52
53.
嚴格模式 • ES5增加了嚴格模式(Strict mode) •
啟用嚴格模式以後,若誤用了不好或早期 規範模糊不清的特性,會發生直譯或執行 等相關錯誤 53
54.
加減乘除運算 • 浮點數誤差 • 0.5
1/2 • 0.75 1/2 + 1/4 • 0.875 1/2 + 1/4 + 1/8 • 0.1 1/16 + 1/32 + 1/256 + 1/512 + 1/4096 + 1/8192 +... 54
55.
• ES7新增了**指數運算子(Exponentiation Operator) 55
56.
• 使用a %
b時會進行除法運算,並取餘數 作為結果 • 若被除數不為0,而除數為0的話,會產生 無限值 56
57.
• 使用+運算子可以串接字串 • 字串不可變動,+串接字串時會產生新字串, •
字串是基本型態,可以直接比較相等性 57
58.
• 程式語言有所謂的強型別(Strong type) 與弱型別(Weak
type)語言 • 強弱之分是相對而言,JavaScript極度偏向 弱型別 58
59.
• 有些轉換在其他程式語言是少見的行為, 這時就不建議依賴在這類型態轉換上 • 請不要在字串上使用-、*、/運算 59
60.
• 請不要將+、-、*、/、**運用在數字與字 串外的其他型態 60
61.
比較運算 • >、<、>=、<=運算子 • 對於數字進行>、<、>=、<=,就是比較 數字大小 •
對於字串,會逐字元依Unicode碼點順序來 比較 61
62.
===與!== • 請不要使用==、!= • 請使用===、!==進行相等比較 62
63.
• ===用於基本型態時,是比較兩個變數儲 存的值是否相同 63
64.
• 如果是在操作物件,=是將名稱參考某個物 件,而===是用來比較兩個名稱是否參考 同一物件 64
65.
NaN • 當運算結果無法產生數值時,就會產生NaN • NaN表示Not
a Number • typeof的結果是'number' 65
66.
• NaN不等於任何值,也是唯一不等於自身的 值 • ===與!==用於NaN比較時,遵照IEEE
754 的規範 • 實務開發上應該避免產生NaN,方式之一是 避免非掌握中的自動型態轉換,避開不好 的運算特性 66
67.
邏輯運算 67
68.
Falsy Family • 除了0、NaN、''、null、undefined是 假的之外,其他都是真的 68
69.
• 邏輯運算&&、||有捷徑運算的特性 69
70.
位元運算 70
71.
• 位元運算是逐位元運算 • 補數運算是將所有位元0變1,1變0 71
72.
• 左移(<<)與右移(>>) • >>>運算子 72
73.
• 條件運算子 73
74.
74
75.
• 遞增1或遞減1 75
76.
• 建議只在單行陳述句中使用遞增、遞減運算 76