踩雷分享：物件與陣列

今天在一個小地方卡了許久, 在多方嘗試之下才注意到可能是傳入函式的第一個引述預設必須是Array, 而我卻丟了一下Object給它, 導致該函式內部實作沒有問題, 但結果卻不符合預期, 從這件事情讓我對引述檢查有更深的體會, 在js這種語言中尤其重要, 因為Array屬性的讀取方式在Object底下也是以使用的, 以下舉個例子

// 範例函式 f
function f(arr) {
  arr[1] = 'test string'
}

// 定義物件 obj
let obj = { x: 'hello', y: 'Cian'}

// 物件obj 索引1 = 255
obj[1] = 255


let arr = ['a', 'b', 'c']


f(obj) // 不小心傳了物件給函式 f

console.log(obj)
console.log(arr)
// 如此一來我們並未發生程式錯誤, 但卻改錯了對象
// 因此我們可以嘗試在函式中加入型別檢查


// 範例函式
function example1(arr) {
  console.log(typeof arr)
}

example1(obj)  // object
example1(arr)  // object
// 以上輸出結果可以發現由於js屬於物件繼承, typeof array 會得到 object
// 於此, 我們必須換個方式檢查

// 修改範例函式
function example2(arr) {
  console.log(arr instanceof Array)
}

example2(obj)  // false
example2(arr)  // true
// 使用instanceof可以正確的區別物件及陣列, 是較好的方法

由於JavaScript的便利性常常會因為一個不小心而倒是結果錯誤, 不管是這次的傳錯物件/陣列, 或是數字與字串的處理, 都很容易發生預期外的事情發生, 因此較好的做法是養成參數檢查的習慣。