每日挑战，从Javascript面试题目了解一些你可能忽略的概念 - Day10

tags: ItIron2021 Javascript

前言

终於迈入第10天啦! 我们昨天讲完资料型别的最後一道题目了，今天再次换换口味吧! 这次的主题我想你也不会陌生，篇幅会相当的短，可以放心阅读?

本日题目与解释

请你解释什麽是IIFE

防雷图又来罗，坦白说我的存货快用完了，是该补充一点备用

IIFE是Immediately Invoked Function Expression，也就是立即执行函数!

好了，今天就到此为止，我们明天见罗!

拜托你在面试时不要只回答这样就结束了，除了回答它就是一个会马上执行的函数之外，我们可以从几个点切入作进一步的说明。

1. 要怎麽写一个立即执行函数

IIFE有几个常见的写法，最传统的就是配合匿名函数的写法，注意整个函数被一组小括号(parentheses)包裹，最终在透过另一组小括号呼叫执行。

(function() {
  console.log('你好，我是丹尼，我喜欢狗但我不是狗')
} 
)()

// 毫不令人意外的输出结果
你好，我是丹尼，我喜欢狗但我不是狗

当然你也可以配合箭头函数再让它更精简一点

(() => {
  console.log('你好，我是丹尼，我喜欢狗但我真的不是狗')
} 
)()

// 毫不令人意外的输出结果
你好，我是丹尼，我喜欢狗但我真的不是狗

同样的也可以传入参数

((animal) => {
  console.log(`你好，我是丹尼，其实我也不讨厌${animal}`)
} 
)('猫')

// 毫不令人意外的输出结果
你好，我是丹尼，其实我也不讨厌猫

最後就是具名的写法，IIFE并不仅限於匿名函数的写法

(function demo() {
  console.log('你好，我是丹尼，我喜欢狗但我不是狗')
} 
)()

// 毫不令人意外的输出结果
你好，我是丹尼，我喜欢狗但我不是狗

2. 使用IIFE有什麽好处

通常这才是面试官真正想要知道的，尤其是扯到名词的定义时，後来多半都会问到为什麽我们需要这玩意! 使用IIFE最主要的优点为

• 避免变数的污染
  这一点相对好懂一些，IIFE一旦执行完後就会被pop出目前的stack，里面的变数就与外面没有任何关系了。这表示在专案规模变大或是你采用大量第三方套件时不至於出现变数的冲突导致一些意外的错误。

当然，其他还有像是记忆体的使用优化或是可以配合闭包达到保护作用域内的变数(这其实是闭包的优点)等等，有兴趣的朋友可以继续往下钻，但至少要能回答出这个最主要的优势。

本日核心观念与总结

核心观念

IIFE

总结

• 理解什麽是IIFE
• 了解如何写一个IIFE
• 了解IIFE最核心的用途

本文章同步发布於个人部落格，有兴趣的朋友也可以来逛逛~!