在連假期間持續發文真是一大毅力的展現，中秋快樂 ▼ω▼

立即函式

還記得剛學 JS 的時候沒用過，看到一些範例 code 也不懂他就是立即函式，是後來準備考題的時候才真正認識。
談立即函式之前，先懂函式表達式（Expressions）與 函式陳述句（Statements）的差異，會更好理解。

// 一般的函式宣告 Function Statement 
function test(){...}

// 而這是一個函式表達式 Functions Expressions ，有一個變數指向他
const func1 = function test2(){...}
// 若為函式表達式，就可以使用匿名函式
const func2 = function (){...}

--- 匿名函式的誤區

// 這是錯誤寫法，匿名函式不可單獨成立 
function (){...}
// 必須用以下
let func3 = function (){...}; //給定一個變數指派成函式表示式

比起函式陳述句的宣告，函式表達式有以下益處

• 結合閉包
• 做為其他函式的參數
• 使用成立即函式

IIEF 立即執行函式：即不需呼叫即可執行的函式

寫法：用 () 框住整個函式，並在尾端加上執行運算子 () 的指令，執行運算子要放外圍 () 裡或者外面都可以，而尾端的 () 可以帶進要用的參數。

--- IIFE寫法 參數放在最後的框中
// 用()圈住整個函式，並在最後呼叫執行
// 用()開頭 解析引擎會認為這不是一個含函式宣告
(function test(){...}())
// 執行運算子也可以放在外面
(function test(){...})()

// 匿名函式也可以直接執行
(function(){console.log(123)}());

// 也可以這樣立即執行 
let x = function(name){console.log('hello'+name)}('Amy');

要注意呼叫函式表達式的寫法

// 若該function直接執行
const y = function test(){
  return 'ok'
}();

console.log(y) // 得 ok
// ** 不可以寫 console.log(y()) 會得到y is not a func
// 因為y指向的不是函式表示式，而是一個函式立即執行的結果 可以視為指向return的返回值

----
// 若只是函式表示式 印出的是y指向的函式
const y = function test(){
  return 'ok'
};

console.log(y); 
// 返回下圖

ES6 的let、const出現之前，開發者為了避免全域變數容易受到污染，會將變數設在函式裡，使其成為區域變數，設在 IIFE 也是同理。因為執行環境的作用，讓彼此不會互相影響。

const fruit = 'lemon';
(function(name){
	const fruit = 'grape';
	console.log(name + '買' + fruit + '汁');
}('Agnes'));

// Agnes 買葡萄汁

可以看到，葡萄不會影響到檸檬，因為葡萄只存在 IIFE 的執行環境中

但如果想要取用 IIFE 裡的變數，可以利用 執行運算子()帶入window

var color = 'red';

(function(global){
  global.color='green'
}(window));

console.log(window.color); // 取到green

總結 IIFE 的優點

• 不需呼叫即可執行函式
• 避免污染全域環境
• 避免同名變數 bug