From 6ca84f1794af830ada9736d7289ce29aabb04ca3 Mon Sep 17 00:00:00 2001 From: t7yang Date: Mon, 10 Jan 2022 08:38:05 +0800 Subject: remove `notranslate` class in zh-TW --- files/zh-tw/web/javascript/closures/index.html | 36 +++++++++++++------------- 1 file changed, 18 insertions(+), 18 deletions(-) (limited to 'files/zh-tw/web/javascript/closures') diff --git a/files/zh-tw/web/javascript/closures/index.html b/files/zh-tw/web/javascript/closures/index.html index 5dbd00dbff..f9ed8c84f7 100644 --- a/files/zh-tw/web/javascript/closures/index.html +++ b/files/zh-tw/web/javascript/closures/index.html @@ -12,7 +12,7 @@ translation_of: Web/JavaScript/Closures

思考這個例子：

-
function init() {
+
function init() {
   var name = "Mozilla"; // name 是個由 init 建立的局部變數
   function displayName() { // displayName() 是內部函式，一個閉包
     alert(name); // 使用了父函式宣告的變數
@@ -32,7 +32,7 @@ init();

 
 
再思考這個例子：

 
-
function makeFunc() {
+
function makeFunc() {
   var name = "Mozilla";
   function displayName() {
     alert(name);
@@ -52,7 +52,7 @@ myFunc();
 
 
這裡有個更有趣的例子：makeAdder 函式：

 
-
function makeAdder(x) {
+
function makeAdder(x) {
   return function(y) {
     return x + y;
   };
@@ -81,7 +81,7 @@ console.log(add10(2)); // 12
 
 
例如，假設我們想在網頁上，加個能調整文字大小的按鈕。其中一個方法是用像素指定 body 元素的 font-size，接著透過相對的 em 單位，設置其他頁面的其他元素（如 headers）個大小：

 
-
body {
+
body {
   font-family: Helvetica, Arial, sans-serif;
   font-size: 12px;
 }
@@ -99,7 +99,7 @@ h2 {
 
 
以下是 JavaScript：

 
-
function makeSizer(size) {
+
function makeSizer(size) {
   return function() {
     document.body.style.fontSize = size + 'px';
   };
@@ -112,12 +112,12 @@ var size16 = makeSizer(16);
 
 
size12、size14、size16 現在變成能調整字體大小到 12、14、與 16 像素的函式。而我們能如下例一般，把他們附加到按鈕上（本例為連結）：

 
-
document.getElementById('size-12').onclick = size12;
+
document.getElementById('size-12').onclick = size12;
 document.getElementById('size-14').onclick = size14;
 document.getElementById('size-16').onclick = size16;
 

 
-
<a href="#" id="size-12">12</a>
+
<a href="#" id="size-12">12</a>
 <a href="#" id="size-14">14</a>
 <a href="#" id="size-16">16</a>
 

@@ -132,7 +132,7 @@ document.getElementById('size-16').onclick = size16;
 
 
以下展示如何使用閉包來定義一個能夠訪問私有函式與變數的公開函式。這種閉包的用法稱為模組設計模式(module pattern)。

 
-
var counter = (function() {
+
var counter = (function() {
   var privateCounter = 0;
   function changeBy(val) {
     privateCounter += val;
@@ -168,7 +168,7 @@ console.log(counter.value()); // logs 1
 
你應該也發現到我們定義了建立 counter 的匿名函式、而我們接著呼叫它，並給counter 變數指派了回傳值。我們也能在分離的變數 makeCounter 儲存函式並用其建立數個 counter。
-
var makeCounter = function() {
+
var makeCounter = function() {
   var privateCounter = 0;
   function changeBy(val) {
     privateCounter += val;
@@ -207,13 +207,13 @@ alert(counter2.value()); /* Alerts 0 */
 
 
在 ECMAScript 2015 導入 let 前，迴圈內建立的閉包，常會發生問題。請思考以下的範例：

 
-
<p id="help">Helpful notes will appear here</p>
+
<p id="help">Helpful notes will appear here</p>
 <p>E-mail: <input type="text" id="email" name="email"></p>
 <p>Name: <input type="text" id="name" name="name"></p>
 <p>Age: <input type="text" id="age" name="age"></p>
 

 
-
function showHelp(help) {
+
function showHelp(help) {
   document.getElementById('help').innerHTML = help;
 }
 
@@ -245,7 +245,7 @@ setupHelp();
 
 
其中一個解法是使用更多閉包，尤其要使用前述的函式工廠：

 
-
function showHelp(help) {
+
function showHelp(help) {
   document.getElementById('help').innerHTML = help;
 }
 
@@ -277,7 +277,7 @@ setupHelp();
 
 
用匿名閉包來實做的另一種方法是：

 
-
function showHelp(help) {
+
function showHelp(help) {
   document.getElementById('help').innerHTML = help;
 }
 
@@ -302,7 +302,7 @@ setupHelp();

 
 
如果你不想用更多閉包的話，你可以使用 ES2015 的 let 關鍵字：

 
-
function showHelp(help) {
+
function showHelp(help) {
   document.getElementById('help').innerHTML = help;
 }
 
@@ -334,7 +334,7 @@ setupHelp();
 
 
思考一下這個例子：

 
-
function MyObject(name, message) {
+
function MyObject(name, message) {
   this.name = name.toString();
   this.message = message.toString();
   this.getName = function() {
@@ -349,7 +349,7 @@ setupHelp();
 
 
上面的程式碼並未利用閉包的益處，所以，可以改成這個樣子：

 
-
function MyObject(name, message) {
+
function MyObject(name, message) {
   this.name = name.toString();
   this.message = message.toString();
 }
@@ -365,7 +365,7 @@ MyObject.prototype = {
 
 
但我們不建議重新定義原型，因此這個附加到現有原型的例子更佳：

 
-
function MyObject(name, message) {
+
function MyObject(name, message) {
   this.name = name.toString();
   this.message = message.toString();
 }
@@ -379,7 +379,7 @@ MyObject.prototype.getMessage = function() {
 
 
以上的程式碼，可以寫得如同下例般簡潔：

 
-
function MyObject(name, message) {
+
function MyObject(name, message) {
     this.name = name.toString();
     this.message = message.toString();
 }
-- 
cgit v1.2.3-54-g00ecf