diff options
Diffstat (limited to 'files/zh-tw/web/javascript/guide')
11 files changed, 197 insertions, 135 deletions
diff --git a/files/zh-tw/web/javascript/guide/control_flow_and_error_handling/index.html b/files/zh-tw/web/javascript/guide/control_flow_and_error_handling/index.html index c140d1a991..b26a576309 100644 --- a/files/zh-tw/web/javascript/guide/control_flow_and_error_handling/index.html +++ b/files/zh-tw/web/javascript/guide/control_flow_and_error_handling/index.html @@ -229,7 +229,9 @@ throw true; // True/False throw {toString: function() { return "我是物件!"; } }; </pre> -<div class="note"><strong>備註：</strong>您可以在拋出例外時指定物件。 然後，可以在 catch 區塊中引用對象的屬性。</div> +<div class="notecard note"> + <p><strong>備註：</strong>您可以在拋出例外時指定物件。 然後，可以在 catch 區塊中引用對象的屬性。</p> +</div> <pre class="brush: js">// 創建類型爲 UserException 的物件 function UserException(message) { @@ -398,7 +400,7 @@ catch (e) { <li><em>settled</em>：已完成，表示 Promise 狀態為已實現或已拒絕，但不是等待中。</li> </ul> -<p><img alt="" src="https://mdn.mozillademos.org/files/8633/promises.png" style="height: 297px; width: 801px;"></p> +<p><img alt="promises" src="https://mdn.mozillademos.org/files/8633/promises.png"></p> <h3 id="使用_XHR_載入圖檔">使用 XHR 載入圖檔</h3> diff --git a/files/zh-tw/web/javascript/guide/details_of_the_object_model/index.html b/files/zh-tw/web/javascript/guide/details_of_the_object_model/index.html index ae69cc38f4..ba436da83c 100644 --- a/files/zh-tw/web/javascript/guide/details_of_the_object_model/index.html +++ b/files/zh-tw/web/javascript/guide/details_of_the_object_model/index.html @@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model <p>下面的表格列出了上述區別。本節的後續部分將描述有關使用 JavaScript 構建函數和原型創建物件層級結構的詳細資訊，並與在 Java 中的做法做對比。</p> -<table class="fullwidth-table"> +<table> <caption>表 8.1 基於類（Java）和基於原型（JavaScript）的物件系統的比較</caption> <thead> <tr> @@ -80,7 +80,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model <p>本節的餘下部分將使用如下圖所示的僱員層級結構。</p> -<p><img alt="" class="internal" src="/@api/deki/files/4452/=figure8.1.png" style="height: 194px; width: 281px;"></p> +<p><img alt="" class="internal" src="/@api/deki/files/4452/=figure8.1.png"></p> <p><small><strong>圖例 8.1：一個簡單的物件層級</strong></small></p> @@ -102,7 +102,7 @@ translation_of: Web/JavaScript/Guide/Details_of_the_Object_Model <p>在 真實的應用程式中，您很可能想定義允許在創建物件時給出屬性值的建構函數。（參見 <a href="#更靈活的建構函數">更靈活的建構函數</a> 獲得進一步的資訊）。對於現在而言，這些簡單的定義示範了繼承是如何發生的。</p> -<p><img alt="figure8.2.png" class="default internal" src="/@api/deki/files/4390/=figure8.2.png"><br> +<p><img alt="figure8.2.png" src="/@api/deki/files/4390/=figure8.2.png"><br> <small><strong>圖例 8.2：Employee 物件定義</strong></small></p> <p>以下 <code>Employee</code> 的 Java 和 JavaScript 的定義相類似。唯一的不同是在 Java 中需要指定每個屬性的類型，而在 JavaScript 中則不必指定，同時 Java 的類必須創建一個顯式的建構函數方法。</p> @@ -238,8 +238,8 @@ public class Engineer extends WorkerBee { <p>{{ note('術語 <em><em>實例（instance）</em></em>在 基於類的語言中具有特定的技術含義。在這些語言中，實例是指類的個體成員，與類有著根本性的不同。在 JavaScript 中，“實例”並不具有這種技術含義，因為 JavaScript 中不存在類和實例之間的這種差異。然而，在談論 JavaScript 時，“實例”可以非正式地用於表示用特定的建構函數創建的物件。所以，在這個例子中，你可以非正式地 <code>jane</code> 是 <code>Engineer</code> 的一個實例。與之類似，儘管術語<em>父（parent）</em>，<em>子（child）</em>，<em>祖先（ancestor）</em>，和<em>後代（descendant）</em>在 JavaScript 中並沒有正式的含義，您可以非正式地使用這些術語用於指代原型鏈中處於更高層次或者更低層次的物件。') }}</p> -<p><img alt="figure8.3.png" class="default internal" id="figure8.3" src="/@api/deki/files/4403/=figure8.3.png"><br> - <a><small><strong>圖例 8.3：通過簡單的定義創建物件</strong></small></a></p> +<p><img alt="figure8.3.png" src="/@api/deki/files/4403/=figure8.3.png"><br> + <small><strong>圖例 8.3：通過簡單的定義創建物件</strong></small></p> <h2 id="物件的屬性">物件的屬性</h2> @@ -285,15 +285,15 @@ mark.projects = ["navigator"];</pre> <p>一旦 JavaScript 執行該語句，則 <code>mark</code> 物件也將具有 <code>specialty</code> 屬性，其值為 <code>"none"</code>。下圖展現了在 <code>Employee</code> 原型中添加該屬性，然後在 <code>Engineer</code> 的原型中重載該屬性的效果。</p> -<p><img alt="" class="internal" src="/@api/deki/files/4422/=figure8.4.png" style="height: 519px; width: 833px;"><br> +<p><img alt="" class="internal" src="/@api/deki/files/4422/=figure8.4.png"><br> <small><strong>Figure 8.4: Adding properties</strong></small></p> -<h2 id="more_flexible_constructors"><a>更靈活的建構函數</a></h2> +<h2 id="more_flexible_constructors">更靈活的建構函數</h2> <p>到目前為止所展現的建構函數不允許在創建新的實例時指定屬性值。正如 Java 一樣，可以為建構函數提供參數以便初始化實例的屬性值。下圖展現其中一種做法。</p> -<p><img alt="" class="internal" src="/@api/deki/files/4423/=figure8.5.png" style="height: 481px; width: 1012px;"><br> - <a><small><strong>Figure 8.5: Specifying properties in a constructor, take 1</strong></small></a></p> +<p><img alt="" class="internal" src="/@api/deki/files/4423/=figure8.5.png"><br> + <small><strong>Figure 8.5: Specifying properties in a constructor, take 1</strong></small></p> <p>下面的表格中羅列了這些物件在 Java 和 JavaScript 中的定義。</p> @@ -413,7 +413,7 @@ jane.machine == "belau" <p>到目前為止，建構函數已經能夠創建一個普通物件，然後為新物件指定本地的屬性和屬性值。您還可以通過直接調用原型鏈上的更高層次物件的建構函數，讓建構函數添加更多的屬性。下面的圖例展現這種新定義。</p> -<p><img alt="" class="internal" src="/@api/deki/files/4430/=figure8.6.png" style="height: 534px; width: 1063px;"><br> +<p><img alt="" class="internal" src="/@api/deki/files/4430/=figure8.6.png"><br> <small><strong>Figure 8.6 Specifying properties in a constructor, take 2</strong></small></p> <p>讓我們仔細看看這些定義的其中之一。以下是 <code>Engineer</code> 建構函數的定義：</p> @@ -607,7 +607,9 @@ chris.__proto__.__proto__.__proto__.__proto__.__proto__ == null; } </pre> -<div class="note"><strong>Note:</strong> 在上面的實現中，檢查物件的類型是否為 "xml" 的目的在於解決新近版本的 JavaScript 中表達 XML 物件的特異之處。如果您想瞭解其中瑣碎細節，可以參考 {{ bug(634150) }}。</div> +<div class="notecard note"> + <p><strong>備註：</strong> 在上面的實現中，檢查物件的類型是否為 "xml" 的目的在於解決新近版本的 JavaScript 中表達 XML 物件的特異之處。如果您想瞭解其中瑣碎細節，可以參考 {{ bug(634150) }}。</p> +</div> <pre class="brush: js">instanceOf (chris, Engineer) instanceOf (chris, WorkerBee) diff --git a/files/zh-tw/web/javascript/guide/expressions_and_operators/index.html b/files/zh-tw/web/javascript/guide/expressions_and_operators/index.html index 4e0c8655bc..77075cdd2e 100644 --- a/files/zh-tw/web/javascript/guide/expressions_and_operators/index.html +++ b/files/zh-tw/web/javascript/guide/expressions_and_operators/index.html @@ -212,8 +212,8 @@ var var2 = 4; </tbody> </table> -<div class="note"> -<p><strong>筆記: </strong>(<strong>=>)不是運算子，是</strong> <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭頭函式。</a></p> +<div class="notecard note"> +<p><strong>備註：</strong>(<strong>=>)不是運算子，是</strong> <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">箭頭函式。</a></p> </div> <h3 id="算術運算子">算術運算子</h3> @@ -226,7 +226,7 @@ var var2 = 4; <p>除了標準的算術運算子外 (+, -, * /)， JavaScript 提供以下表中的算術運算子:</p> -<table class="fullwidth-table"> +<table> <caption>算術運算子</caption> <thead> <tr> @@ -388,7 +388,7 @@ var var2 = 4; <p>移動運算子在下表被列出.</p> -<table class="fullwidth-table"> +<table> <caption>位元移動運算子</caption> <thead> <tr> @@ -421,7 +421,7 @@ var var2 = 4; <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators">邏輯運算子</a> 通常被用於布林(邏輯)值; 使用於 布林(邏輯)值時， 它們會回傳布林型態的值。 然而，<code>&&</code> 和 <code>||</code> 運算子實際上是回傳兩指定運算元之一，因此用於非布林型態值時，它可能會回傳一個非布林型態的值。 邏輯運算子將在下表中被詳細解釋。</p> -<table class="fullwidth-table"> +<table> <caption>Logical operators</caption> <thead> <tr> diff --git a/files/zh-tw/web/javascript/guide/functions/index.html b/files/zh-tw/web/javascript/guide/functions/index.html index f71ccfa1e9..af19983b6f 100644 --- a/files/zh-tw/web/javascript/guide/functions/index.html +++ b/files/zh-tw/web/javascript/guide/functions/index.html @@ -72,12 +72,8 @@ y = mycar.make; // y 的值還是 "Honda" </pre> <pre class="brush: js">var square = function(number) {return number * number}; var x = square(4) //x 的值為 16</pre> -<div class="almost_half_cell" id="gt-res-content"> <div>必要時，函式名稱可與函式表達式同時存在，並且可以用於在函式內部代指其本身(遞迴)：</div> -<div> </div> -</div> - <pre class="brush: js">var factorial = function fac(n) {return n<2 ? 1 : n*fac(n-1)}; console.log(factorial(3)); @@ -150,7 +146,7 @@ e = factorial(5); // e gets the value 120 <p>There are other ways to call functions. There are often cases where a function needs to be called dynamically, or the number of arguments to a function vary, or in which the context of the function call needs to be set to a specific object determined at runtime. It turns out that functions are, themselves, objects, and these objects in turn have methods (see the <a href="/en-US/docs/JavaScript/Guide/Obsolete_Pages/Predefined_Core_Objects/Function_Object" title="Function Object"><code>Function</code> object</a>). One of these, the <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function/apply" title="apply"><code>apply()</code></a> method, can be used to achieve this goal.</p> -<h2 class="deki-transform" id="Function_scope">Function scope</h2> +<h2 id="Function_scope">Function scope</h2> <p>Variables defined inside a function cannot be accessed from anywhere outside the function, because the variable is defined only in the scope of the function. However, a function can access all variables and functions defined inside the scope in which it is defined. In other words, a function defined in the global scope can access all variables defined in the global scope. A function defined inside another function can also access all variables defined in it's parent function and any other variable to which the parent function has access.</p> diff --git a/files/zh-tw/web/javascript/guide/grammar_and_types/index.html b/files/zh-tw/web/javascript/guide/grammar_and_types/index.html index 04f4818cdb..a5200c39ec 100644 --- a/files/zh-tw/web/javascript/guide/grammar_and_types/index.html +++ b/files/zh-tw/web/javascript/guide/grammar_and_types/index.html @@ -335,8 +335,8 @@ y = 42 + " is the answer" // "42 is the answer" <pre class="brush: js">var coffees = ['French Roast', 'Colombian', 'Kona']; </pre> -<div class="note"> -<p><strong>Note :</strong> An array literal is a type of object initializer. See <a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Using_object_initializers">Using Object Initializers</a>.</p> +<div class="notecard note"> +<p><strong>Note:</strong> An array literal is a type of object initializer. See <a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Using_object_initializers">Using Object Initializers</a>.</p> </div> <p>If an array is created using a literal in a top-level script, JavaScript interprets the array each time it evaluates the expression containing the array literal. In addition, a literal used in a function is created each time the function is called.</p> @@ -354,8 +354,8 @@ y = 42 + " is the answer" // "42 is the answer" <p>If you include a trailing comma at the end of the list of elements, the comma is ignored. In the following example, the length of the array is three. There is no <code>myList[3]</code>. All other commas in the list indicate a new element.</p> -<div class="note"> -<p><strong>Note :</strong> Trailing commas can create errors in older browser versions and it is a best practice to remove them.</p> +<div class="notecard note"> +<p><strong>Note:</strong> Trailing commas can create errors in older browser versions and it is a best practice to remove them.</p> </div> <pre class="brush: js">var myList = ['home', , 'school', ]; diff --git a/files/zh-tw/web/javascript/guide/index.html b/files/zh-tw/web/javascript/guide/index.html index c7ba53958a..23d3b2a340 100644 --- a/files/zh-tw/web/javascript/guide/index.html +++ b/files/zh-tw/web/javascript/guide/index.html @@ -11,106 +11,168 @@ translation_of: Web/JavaScript/Guide <p>本指南區分成以下數個章節：</p> -<ul class="card-grid"> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction">簡介</a> - - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#Where_to_find_JavaScript_information">關於本指南</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#What_is_JavaScript">關於 JavaScript</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#JavaScript_and_Java">JavaScript 與 Java</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#JavaScript_and_the_ECMAScript_Specification">ECMAScript</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#Getting_started_with_JavaScript">工具</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#Hello_world">Hello World</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types">語法與型別</a> - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Basics">基礎語法 & 註解</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Declarations">宣告</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Variable_scope">變數範圍</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Variable_hoisting">變數提升（Hoisting）</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Data_structures_and_types">資料結構與型態</a><br> - <a href="https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#%E5%AD%97%E9%9D%A2%E5%80%BC%EF%BC%88Literals%EF%BC%89">字面值</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling">流程控制與錯誤處理</a> - <p><code><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#if...else_statement">if...else</a></code><br> - <code><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#switch_statement">switch</a></code><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Exception_handling_statements"><code>try</code>/<code>catch</code>/<code>throw</code></a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Utilizing_Error_objects">Error 物件</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Promises">Promises</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration">迴圈與迭代</a> - <p><code><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement">for</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#while_statement">while</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#do...while_statement">do...while</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#break_statement">break</a>/<a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#continue_statement">continue</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#for...in_statement">for..in</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#for...of_statement">for..of</a></code></p> - </li> +<h2 id="簡介">簡介</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction">簡介</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#Where_to_find_JavaScript_information">關於本指南</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#What_is_JavaScript">關於 JavaScript</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#JavaScript_and_Java">JavaScript 與 Java</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#JavaScript_and_the_ECMAScript_Specification">ECMAScript</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#Getting_started_with_JavaScript">工具</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Introduction#Hello_world">Hello World</a></li> +</ul> + +<h2 id="語法與型別">語法與型別</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types">語法與型別</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Basics">基礎語法 & 註解</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Declarations">宣告</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Variable_scope">變數範圍</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Variable_hoisting">變數提升（Hoisting）</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#Data_structures_and_types">資料結構與型態</a></li> + <li><a href="https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Guide/Grammar_and_types#%E5%AD%97%E9%9D%A2%E5%80%BC%EF%BC%88Literals%EF%BC%89">字面值</a></li> +</ul> + +<h2 id="流程控制與錯誤處理">流程控制與錯誤處理</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling">流程控制與錯誤處理</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#if...else_statement"><code>if...else</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#switch_statement"><code>switch</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Exception_handling_statements"><code>try</code>/<code>catch</code>/<code>throw</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Utilizing_Error_objects">Error 物件</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Promises">Promises</a></li> +</ul> + +<h2 id="迴圈與迭代">迴圈與迭代</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration">迴圈與迭代</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement"><code>for</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#while_statement"><code>while</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#do...while_statement"><code>do...while</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#break_statement"><code>break</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#continue_statement"><code>continue</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#for...in_statement"><code>for..in</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Loops_and_iteration#for...of_statement"><code>for..of</code></a></li> +</ul> + +<h2 id="函數">函數</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Functions">函數</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Defining_functions">定義函數</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Calling_functions">呼叫函數</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Function_scope">函數範圍</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Closures">閉包（Closure）</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Using_the_arguments_object">參數值</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Function_parameters">參數</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Arrow_functions">箭頭函數</a></li> +</ul> + +<h2 id="運算式與運算子">運算式與運算子</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators">運算式與運算子</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment_operators">賦值</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Comparison_operators">比較</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Arithmetic_operators">算數運算子</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Bitwise_operators">位元</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Logical_operators">邏輯運算子</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Conditional_(ternary)_operator">條件（三元）運算子</a></li> +</ul> + +<h2 id="數字與日期">數字與日期</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates">數字與日期</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Numbers">數字書寫法</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Number_object"><code>Number</code> 物件</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Math_object"><code>Math</code> 物件</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Date_object"><code>Date</code> 物件</a></li> +</ul> + +<h2 id="文字格式">文字格式</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting">文字格式</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#String_literals">字串書寫法</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#String_objects"><code>String</code> 物件</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#Multi-line_template_literals">模板書寫法</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#Internationalization">國際化</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Regular_Expressions">正規表示法</a></li> +</ul> + +<h2 id="具索引的集合">具索引的集合</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting">文字格式</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Indexed_collections#Array_object">陣列</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Indexed_collections#Typed_Arrays">型態化陣列</a></li> +</ul> + +<h2 id="具鍵值的集合">具鍵值的集合</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections">具鍵值的集合</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#Map_object"><code>Map</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#WeakMap_object"><code>WeakMap</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#Set_object"><code>Set</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#WeakSet_object"><code>WeakSet</code></a></li> +</ul> + +<h2 id="使用物件">使用物件</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects">使用物件</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties">物件與屬性</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">建立物件</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_methods">定義方法</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">取值器與設值器</a></li> </ul> -<ul class="card-grid"> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions">函數</a> - - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Defining_functions">定義函數</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Calling_functions">呼叫函數</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Function_scope">函數範圍</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Closures">閉包（Closure）</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Using_the_arguments_object">參數值</a> & <a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Function_parameters">參數</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Functions#Arrow_functions">箭頭函數</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators">運算式與運算子</a> - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment_operators">賦值</a> & <a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Comparison_operators">比較</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Arithmetic_operators">算數運算子</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Bitwise_operators">位元</a> & <a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Logical_operators">邏輯運算子</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Expressions_and_Operators#Conditional_(ternary)_operator">條件（三元）運算子</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates">數字與日期</a><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Numbers">數字書寫法</a> - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Number_object"><code>Number</code> 物件</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Math_object"><code>Math</code> 物件</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Numbers_and_dates#Date_object"><code>Date</code> 物件</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting">文字格式</a> - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#String_literals">字串書寫法</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#String_objects"><code>String</code> 物件</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#Multi-line_template_literals">模板書寫法</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Text_formatting#Internationalization">國際化</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Regular_Expressions">正規表示法</a></p> - </li> +<h2 id="深入了解物件模型">深入了解物件模型</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">深入了解物件模型</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Class-based_vs._prototype-based_languages">以原形（Prototype）為基礎的 OOP</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Creating_the_hierarchy">建立物件層級</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Property_inheritance_revisited">繼承</a></li> </ul> -<ul class="card-grid"> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Indexed_collections">具索引的集合</a> - - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Indexed_collections#Array_object">陣列</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Indexed_collections#Typed_Arrays">型態化陣列</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections">具鍵值的集合</a> - <p><code><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#Map_object">Map</a></code><br> - <code><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#WeakMap_object">WeakMap</a></code><br> - <code><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#Set_object">Set</a></code><br> - <code><a href="/zh-TW/docs/Web/JavaScript/Guide/Keyed_collections#WeakSet_object">WeakSet</a></code></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects">使用物件</a> - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties">物件與屬性</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">建立物件</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_methods">定義方法</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">取值器與設值器</a></p> - </li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">深入了解物件模型</a> - <p><a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Class-based_vs._prototype-based_languages">以原形（Prototype）為基礎的 OOP</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Creating_the_hierarchy">建立物件層級</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Property_inheritance_revisited">繼承</a></p> - </li> +<h2 id="迭代器與產生器">迭代器與產生器</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators">迭代器與產生器</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterators">迭代器（Iterator）</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterables">可迭代型態（Iterable）</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators#Generators">產生器（Generator）</a></li> </ul> -<ul class="card-grid"> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators">迭代器與產生器</a><a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterators">迭代器（Iterator）</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterables">可迭代型態（Iterable）</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Iterators_and_Generators#Generators">產生器（Generator）</a></li> - <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming">Meta 程式設計</a> - <p><code><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Proxies">Proxy</a></code><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Handlers_and_traps">Handler 與 Trap</a><br> - <a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Revocable_Proxy">Revocable Proxy</a><br> - <code><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Reflection">Reflect</a></code></p> - </li> +<h2 id="Meta 程式設計">Meta 程式設計</h2> + +<p>概述：<a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming">Meta 程式設計</a></p> + +<ul> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Proxies"><code>Proxy</code></a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Handlers_and_traps">Handler 與 Trap</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Revocable_Proxy">Revocable Proxy</a></li> + <li><a href="/zh-TW/docs/Web/JavaScript/Guide/Meta_programming#Reflection"><code>Reflect</code></a></li> </ul> <p>{{Next("Web/JavaScript/Guide/Introduction")}}</p> diff --git a/files/zh-tw/web/javascript/guide/indexed_collections/index.html b/files/zh-tw/web/javascript/guide/indexed_collections/index.html index a5e843c220..26079e8c09 100644 --- a/files/zh-tw/web/javascript/guide/indexed_collections/index.html +++ b/files/zh-tw/web/javascript/guide/indexed_collections/index.html @@ -36,8 +36,8 @@ var arr = []; arr.length = arrayLength; </pre> -<div class="note"> -<p><strong>Note :</strong> in the above code, <code>arrayLength</code> must be a <code>Number</code>. Otherwise, an array with a single element (the provided value) will be created. Calling <code>arr.length</code> will return <code>arrayLength</code>, but the array actually contains empty (undefined) elements. Running a {{jsxref("Statements/for...in","for...in")}} loop on the array will return none of the array's elements.</p> +<div class="notecard note"> +<p><strong>Note:</strong> in the above code, <code>arrayLength</code> must be a <code>Number</code>. Otherwise, an array with a single element (the provided value) will be created. Calling <code>arr.length</code> will return <code>arrayLength</code>, but the array actually contains empty (undefined) elements. Running a {{jsxref("Statements/for...in","for...in")}} loop on the array will return none of the array's elements.</p> </div> <p>In addition to a newly defined variable as shown above, arrays can also be assigned as a property of a new or an existing object:</p> @@ -79,8 +79,8 @@ emp[1] = 'Phil Lesh'; emp[2] = 'August West'; </pre> -<div class="note"> -<p><strong>Note :</strong> if you supply a non-integer value to the array operator in the code above, a property will be created in the object representing the array, instead of an array element.</p> +<div class="notecard note"> +<p><strong>Note:</strong> if you supply a non-integer value to the array operator in the code above, a property will be created in the object representing the array, instead of an array element.</p> </div> <pre class="brush: js">var arr = []; @@ -104,8 +104,8 @@ var myArray = ['Mango', 'Apple', 'Orange']; <p>You then refer to the first element of the array as <code>myArray[0]</code> and the second element of the array as <code>myArray[1]</code>. The index of the elements begins with zero.</p> -<div class="note"> -<p><strong>Note :</strong> the array operator (square brackets) is also used for accessing the array's properties (arrays are also objects in JavaScript). For example,</p> +<div class="notecard note"> +<p><strong>Note:</strong> the array operator (square brackets) is also used for accessing the array's properties (arrays are also objects in JavaScript). For example,</p> </div> <pre class="brush: js">var arr = ['one', 'two', 'three']; @@ -433,7 +433,7 @@ Row 3: [3, 0] [3, 1] [3, 2] [3, 3] <p>To achieve maximum flexibility and efficiency, JavaScript typed arrays split the implementation into <strong>buffers</strong> and <strong>views</strong>. A buffer (implemented by the {{jsxref("ArrayBuffer")}} object) is an object representing a chunk of data; it has no format to speak of, and offers no mechanism for accessing its contents. In order to access the memory contained in a buffer, you need to use a view. A view provides a context — that is, a data type, starting offset, and number of elements — that turns the data into an actual typed array.</p> -<p><img alt="Typed arrays in an ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p> +<p><img alt="Typed arrays in an ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png"></p> <h3 id="ArrayBuffer">ArrayBuffer</h3> diff --git a/files/zh-tw/web/javascript/guide/introduction/index.html b/files/zh-tw/web/javascript/guide/introduction/index.html index ae980e77b0..fee75789ba 100644 --- a/files/zh-tw/web/javascript/guide/introduction/index.html +++ b/files/zh-tw/web/javascript/guide/introduction/index.html @@ -154,7 +154,7 @@ translation_of: Web/JavaScript/Guide/Introduction </tbody> </table> -<div class="note">注意：ECMA-262 第2版是由已修正錯誤的第1版並加上些微的更動構成。現今由 Ecma International 的 TC39 工作組（TC39 Working Group）所發行的版本是 ECMAScript 5.1版</div> +<div class="notecard note"><p><strong>備註：</strong>ECMA-262 第2版是由已修正錯誤的第1版並加上些微的更動構成。現今由 Ecma International 的 TC39 工作組（TC39 Working Group）所發行的版本是 ECMAScript 5.1版</p></div> <p><a href="/zh-TW/docs/JavaScript/Reference" title="JavaScript/Reference">JavaScript Reference</a> 指出了哪些 JavaScript 的特性是相容於 ECMAScript 的。</p> diff --git a/files/zh-tw/web/javascript/guide/iterators_and_generators/index.html b/files/zh-tw/web/javascript/guide/iterators_and_generators/index.html index 8c53a56eb2..5d5fb327c6 100644 --- a/files/zh-tw/web/javascript/guide/iterators_and_generators/index.html +++ b/files/zh-tw/web/javascript/guide/iterators_and_generators/index.html @@ -70,8 +70,8 @@ console.log("Iterated over sequence of size: ", result.value); // 5 </pre> -<div class="note"> -<p>It is not possible to know reflectively whether a particular object is an iterator. If you need to do this, use <a href="#Iterables">Iterables</a>.</p> +<div class="notecard note"> +<p><strong>Note:</strong> It is not possible to know reflectively whether a particular object is an iterator. If you need to do this, use <a href="#Iterables">Iterables</a>.</p> </div> <h2 id="Generator_functions">Generator functions</h2> diff --git a/files/zh-tw/web/javascript/guide/using_promises/index.html b/files/zh-tw/web/javascript/guide/using_promises/index.html index 1df6376ffd..71b99084e7 100644 --- a/files/zh-tw/web/javascript/guide/using_promises/index.html +++ b/files/zh-tw/web/javascript/guide/using_promises/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Guide/Using_promises <p>舉例來說，下方的範例若用舊方式應該會有兩個 Callback，並根據成功或失敗來決定使用哪個：</p> -<pre class="brush: js line-numbers language-js">function successCallback(result) { +<pre class="brush: js">function successCallback(result) { console.log("It succeeded with " + result); } @@ -24,12 +24,12 @@ doSomething(successCallback, failureCallback); <p>而新作法會回傳一個 Promise，這樣你就可以附加 Callback：</p> -<pre class="brush: js line-numbers language-js">let promise = doSomething(); +<pre class="brush: js">let promise = doSomething(); promise.then(successCallback, failureCallback);</pre> <p>再簡單點：</p> -<pre class="brush: js line-numbers language-js">doSomething().then(successCallback, failureCallback);</pre> +<pre class="brush: js">doSomething().then(successCallback, failureCallback);</pre> <p>我們稱之為 <em>非同步函數呼叫</em>。這個做法有許多好處，我們接下來看看。</p> diff --git a/files/zh-tw/web/javascript/guide/working_with_objects/index.html b/files/zh-tw/web/javascript/guide/working_with_objects/index.html index ec531a1004..31b9403a01 100644 --- a/files/zh-tw/web/javascript/guide/working_with_objects/index.html +++ b/files/zh-tw/web/javascript/guide/working_with_objects/index.html @@ -124,7 +124,7 @@ myCar.year = 1969</pre> <p>JavaScript has a number of predefined objects. In addition, you can create your own objects. You can create an object using an <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer</a>. Alternatively, you can first create a constructor function and then instantiate an object invoking that function in conjunction with the <code>new</code> operator.</p> -<h3 id="Using_object_initializers"><a>Using object initializers</a></h3> +<h3 id="Using_object_initializers">Using object initializers</h3> <p>In addition to creating objects using a constructor function, you can create objects using an <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer</a>. Using object initializers is sometimes referred to as creating objects with literal notation. "Object initializer" is consistent with the terminology used by C++.</p> |