aboutsummaryrefslogtreecommitdiff
path: root/files/zh-tw/glossary/iife
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:43:23 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:43:23 -0500
commit218934fa2ed1c702a6d3923d2aa2cc6b43c48684 (patch)
treea9ef8ac1e1b8fe4207b6d64d3841bfb8990b6fd0 /files/zh-tw/glossary/iife
parent074785cea106179cb3305637055ab0a009ca74f2 (diff)
downloadtranslated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.gz
translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.bz2
translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.zip
initial commit
Diffstat (limited to 'files/zh-tw/glossary/iife')
-rw-r--r--files/zh-tw/glossary/iife/index.html69
1 files changed, 69 insertions, 0 deletions
diff --git a/files/zh-tw/glossary/iife/index.html b/files/zh-tw/glossary/iife/index.html
new file mode 100644
index 0000000000..10c20fbf91
--- /dev/null
+++ b/files/zh-tw/glossary/iife/index.html
@@ -0,0 +1,69 @@
+---
+title: IIFE
+slug: Glossary/IIFE
+translation_of: Glossary/IIFE
+---
+<p><strong>IIFE </strong>(Immediately Invoked Function Expression) 是一個定義完馬上就執行的 {{glossary("JavaScript")}} {{glossary("function")}}。</p>
+
+<p>他又稱為 {{glossary("Self-Executing Anonymous Function")}},也是一種常見的設計模式,包含兩個主要部分:第一個部分是使用{{jsxref("Operators/Grouping", "Grouping Operator")}} <code> ()</code> 包起來的 anonymous function。這樣的寫法可以避免裡面的變數污染到 global scope。</p>
+
+<p>第二個部分是馬上執行 function 的 expression <code>()</code>,JavaScript 引擎看到它就會立刻轉譯該 function。</p>
+
+<h2 id="Examples">Examples</h2>
+
+<p>Function 轉換為 expression 形式,並且馬上執行,function scope 內的變數在外面是無法存取的。</p>
+
+<pre class="brush: js"><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+ var aName = "Barry";
+<span class="p">})();
+// Variable name is not accessible from the outside scope
+aName </span>// throws "Uncaught ReferenceError: aName is not defined"
+</pre>
+
+<p>把 IIFE 只配給變數會儲存它的結果,而非 function 本身</p>
+
+<pre class="brush: js"><span class="p">var result = (</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
+ var name = "Barry";
+ return name;
+<span class="p">})();
+// Immediately creates the output:
+result; // "Barry"</span></pre>
+
+<h3 id="其它形式">其它形式</h3>
+
+<p>符合 JSLint 的版本,行為一樣,只有語意略有差異:</p>
+
+<pre class="brush: js">(function () {
+ var aName = "Barry";
+}());
+</pre>
+
+<p>Arrow function 版本,程式碼更為精簡,行為一致:</p>
+
+<pre class="brush: js">(() =&gt; {
+ var aName = "Barry";
+})();</pre>
+
+<p>Async function 版本,目前主要為了 top level await 而使用:</p>
+
+<pre class="brush: js">(async function () {
+ var aName = "Barry";
+})();
+
+(async () =&gt; {
+ var aName = "Barry";
+})();</pre>
+
+<h2 id="更多資訊">更多資訊</h2>
+
+<h3 id="學習它">學習它</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript#Functions">Quick example</a> (在 "Functions" 部分的最後面,  "Custom objects" 的正前面)</li>
+</ul>
+
+<h3 id="基本知識">基本知識</h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Immediately-invoked function expression", "IIFE")}} 維基百科</li>
+</ul>