函式 Function

函式宣告範例

function transform(arr, transformFunction) {
  var result = [] //設定一個空陣列
  for (var i=0; i<arr.length; i++) //設定陣列的迴圈運行方式 {
    result.push(transformFunction(arr[i]))
    // 將陣列元素 push 進去上面設定的空陣列
  }
  return result 
}

var double = function(x) {
  return x*2 
}

console.log(
  transform([1, 2, 3] //這個被傳入第一行的 arr , function (x) {
  return x*2 //匿名函式，可以直接在這裡運作或是另外寫一個函式
})
)

// 輸出結果為[2, 4, 6]

函式建立步驟

我想要建立一個函式 transform([1, 2, 3], double) => [2, 4, 6]

設定 transformFunction 要怎麼跑

function transform(arr, transformFunction) {
var result = [] //設定一個空陣列

for (var i=0; i<arr.length; i++) //設定陣列的迴圈運行方式

{
  result.push(transformFunction(arr[i]))
  // 將陣列元素 push 進去上面設定的空陣列
}

return result //要記得回傳結果
}

因為要把陣列元素 double，所以再設定一個函式
```
var double = function(x) {
return x*2 
}
```

最後輸出結果

console.log(
transform([1, 2, 3], double)
) 
// [1, 2, 3] 這個會被傳入第一行的 arr 
// 而 double 函式會透過 transformFunction 回傳結果
)

引數(Argument)與參數(Parameter)

function add(a, b) { //這邊的(a, b)是參數
  console.log(arguments) 
  // arguments會印出你導入的引數 => {'0': 2, '1': 5} (是類似陣列的物件)
  return a+b
}

console.log(add(2, 5)) //這邊的(2, 5)是引數，就是你要導入函式的東西

使用 function 的注意事項

function addValue(obj) {
  obj.number++
}

var a = {
  number: 10
}

addValue(a)

console.log(a)

這邊印出值是 11 ，因為外面的 a 跟 obj 指向同一記憶體位置，所以 obj.number++ 也會改到 a 的值

function addValue(obj) {
  obj = {
    number: 100
  }
}

var a = {
  number: 10
}

addValue(a)

console.log(a)

這時候的印出值卻還是 10 ，不是obj 的 100，因為 obj 被賦予了一個新的物件 100，所以就指到了一個新的記憶體位置，原本 a 的值就不會被改到。只有在obj.後面做的事才會改變值，給予新變數就會改變位置而不會動到原本的值。
參考影片：[JS101] 函式裡面的使用function的注意事項

該不該 return?

當需要 function 回傳的值的時候就需要

function double(x) {
  return x * 2
}

var a = double(3)

console.log(a)
// 印出 6

沒有需要回傳值的話就不用

function sayHi(name) {
 console.log('HI' , 'name')
}

sayHi(Eric)

// 印出 HI Eric

「回傳」與「印出」的差異

function add(a, b) {
  console.log(a, b)
  //return undefined 預設
}

console.log(add(a, b))

// 印出 1 2 undefined

會先印出 function 裡的 log => 1 2
然後印出外面整個 function 的 log ，但因為 function 裡面沒有設定 return 所以只會印出 undefined

function add(a, b) {
  return a + b
}

console.log(add(1, 2))

// 印出 3

比較好的寫法是直接印出 function 裡面的 return，然後再 console.log 整個 function。
不要在 function 裡面直接 log，因為需要的是回傳值。（要直接在函式裡 log 的話，最後印出就不用再加 log，直接宣告 function 即可）
在 chrome 瀏覽器進行時，每執行一個指令都會自動產生一個回傳值(沒有log也會)。

Immutable 不可變概念

在使用字串或數字的情況是不可變 immutable 的

var str = "hello"
str.toUpperCase() //這樣沒用，字串數字的 immutable 特性不會改變原本的字串
str = str.toUpperCase() //要再另外設一個變數，才會設立一個新的記憶體位置來放新的值，而原本字串還是不變。

使用陣列或物件的情況下，看你要回傳的值是什麼

var arr = [1, 2, 3]

arr.push(4) // 這樣寫即可，因為他會直接改變原本的陣列

var index = arr.indexOf() // 因為 indexOf 回傳的不是陣列，只是回傳一個新的數字不會動到原本的陣列，所以需要在設立一個變數

// 結論: 看你用的 function 回傳的東西是什麼，會改動到原本陣列就不用設變數；不會改動原本陣列而只是回傳值的話就需要在設立變數。

console.log(arr)