JavaScript 經常搞混的地方

JS 的資料型態

• null
• undefined
• string
• number
• boolean
• symbol(ES6)
• object (array, function, date)

判斷資料型態

用 typeof 取得資料型態：

console.log(typeof 123) // number
console.log(typeof function() {}) // function 
console.log(typeof null) // object，這是一個不會被修正的 bug

另一個判斷型態的方法(比上面的方法更仔細)：

Object.prototype.toString.call()

console.log(Object.prototype.toString.call(null)) // null
console.log(Object.prototype.toString.call([])) // array
console.log(Object.prototype.toString.call(1)) // number

對 Primitive type 去執行甚麼動作的時候，會回傳的是一個新的值，所以要另外宣告一個新的變數，對 Object 則是原本的東西去做改變，不用另外再宣告一個變數

Primitive type 原始型態(不能改變)：

var str = "hello"
var newStr = str.toUpperCase()
console.log(str, newStr) // hello, HELLO

Object：

var arr = [1]
arr.psuh(2)
console.log(arr) // [1, 2]

賦值

• "=" 是賦值，primitive type 賦值甚麼就是甚麼，Object 則是把賦值的東西放在某個記憶體位置，所以 Object 賦值的東西是看他對應到的記憶體位置是甚麼才是甚麼

  var obj = {
    number：10
  }
  0x01：{ // 記憶體位置 0x01 存放 number：10
    number：10
  }
  obj：0x01 // obj 對應 0x01 這個記憶體位置的東西
  

• 給一個 object 宣告一個已經存在的 object，兩個 object 共用同一個記憶體位置

  var obj = {
    number：10
  } 
  var obj2 = obj 
  console.log(obj2) // 10
  0x01：{ // 記憶體位置 0x01 存放 number：10
    number：10
  }
  obj：0x01 // obj 對應 0x01 這個記憶體位置的東西
  obj2：0x01 // obj2 對應到跟 obj 一樣的記憶體位置
  

• 已宣告的 object 再重新宣告一個值，新的值會存在另一個新的記憶位置，與原本舊的值的記憶位置不相干

  var obj = {
    number：10
  } 
  var obj2 = obj 
  console.log(obj2) // 10
  obj2 = {
  number ：20
  }
  console.log(obj, obj2) // 10, 20
  0x01：{ // 記憶體位置 0x01 存放 number：10
    number：10
  }
  0x02： {
    number：20
  }
  obj：0x01 // obj 對應 0x01 這個記憶體位置的東西
  obj2：0x02 // obj2 對應到一個新的記憶體位置
  

== 與 ===

"==" 會進行型態的轉換，所以型態不同但值相同時進行比較會相等

"===" 要連型態都相等比較時才會相等

console.log(1 == "1") true
console.log(1 === "1") false

object 型態的東西用 === 進行比較時，不管值是否相等，要指向同一個記憶體位置才會是相等的

var arr1 = [1]
var arr2 = [1] 
consoel.log(arr1 === arr2) // false，因為兩個東西的記憶體位置不同

var arr1 = [1]
var arr2 = arr1
console.log(arr1 === arr2) //true

NaN (Not a Number)

• NaN 的型態是 number
• NaN 不等於任何東西，包含自己
• isNaN() 判斷是不是 NaN

  var a = Number("hello")
  console.log(a) // NaN
  console.log(a === a) // false
  console.log(isNaN(a)) // true
  

var、let 與 const

ES6 之後，一個 { } 是一個作用域

var 變數

• 全域變數 function scope，以 function 為作用的界線
• 若 function 內使用已宣告的變數，找最近的，同一層沒有就往上一層找

let 變數

• 區域變數 block scope，以 block { } 為作用的界線

const 常數

• 區域變數 block scope，以 block { } 為作用的界線
• 值不可以改，但是如果是 object 的話可以，只要記憶體位置不變就可以改變