iT邦幫忙

2022 iThome 鐵人賽

DAY 16
0
自我挑戰組

學習JavaScript的基礎概念系列 第 16

Day16 比較運算子與強制型轉

  • 分享至 

  • xImage
  •  

比較運算子

會回傳布林值(true/false)
== , ===
!= , !==
<,>,>=,<=

強制型轉

轉換一個值的型別,像是數字強制轉成字串。

var a = 1 + '2';
console.log(a);

執行結果是12
因為JS把1自動當成字串,因為你沒告訴它型別。

強制型轉布林為數字

false強制型轉數字是0。
true強制型轉數字是1。
undefined強制型轉數字是NaN,NaN (not a number)代表我有個東西想要轉換成數值型別。
null強制型轉數字是0。
https://ithelp.ithome.com.tw/upload/images/20220930/20152070g8H8drAGOK.png

先看一個例子,小於<是左到右相依性

console.log(3 < 2 < 1);
//結果true

console.log(3 < 2); 
//結果false

console.log(false < 1);  
//結果true

console.log(0 < 1);   
//結果true

比較運算子差別

==:相等,會因為強制型轉的未預期行為導致錯誤,盡量少用。
===:完全相等,不會強制轉型,比較安全。
!=:不相等。
!==:不完全相等。
執行速度 === 比 == 快,因為 == 會強制轉型

== 因為強制型轉的關係,不同型別使用會出現這些情況:

3 == 3
//結果true

"3" == 3
//結果true

false == 0
//結果true

null == 0 
//結果false,null不會再比較的時候轉型成0

null < 1
//結果true

" " == 0
//結果true

" " == false

//結果true

===範例:

"3" === 3
//結果false

false === 0
//結果false

強制型轉成布林值

未設值、空、空字串,只要不存在就是false,不會得到任何東西,因此可利用強制型轉檢查變數是否有值。
但要注意Boolean(0)是false,如果變數的值也是0就會有問題,因為0不是不存在。
https://ithelp.ithome.com.tw/upload/images/20220930/20152070vgFmadrrjl.png

如果變數的值是0:

var a =0;
if(a || a === 0){}

//a || a === 0
//a || true
//0 || true
//false || true
//true

//結果是true

|| 可應用在預設值

沒給預設值

function greet (name){
    console.log('Hello' + name);
}
greet();

執行結果Hello undefined


給預設值:

function greet (name){
    name = name || 'your name'
    console.log('Hello' + name);
}
greet();

執行結果Hello your name


有文字的字串是true
|| 會回傳第一個被轉型成true的值

undefined || 'hello'
//結果"hello"

boolean("hello")
//結果true

"hi" || "hello"
//結果"hi"

0 || 1
//結果1

null || "hello"
//結果"hello"

" " || "hello" 
//結果"hello"

falsy values:

  1. false
  2. 0
  3. " " (空白文字
  4. null
  5. undefined
  6. NaN (not a number)

除此這6者之外,都是truthy。

資料補充:
相等性比較表格
JavaScript:===、== 差在哪?哪個執行速度較快?


上一篇
Day15 純值 和 運算子優先性、相依性
下一篇
Day17 for/while迴圈、break、continue
系列文
學習JavaScript的基礎概念30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言