在连假期间持续发文真是一大毅力的展现，中秋快乐 ▼ω▼

立即函式

还记得刚学 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