diff options
author | t7yang <t7yang@gmail.com> | 2022-01-10 08:38:05 +0800 |
---|---|---|
committer | Irvin <irvinfly@gmail.com> | 2022-02-16 02:35:54 +0800 |
commit | 6ca84f1794af830ada9736d7289ce29aabb04ca3 (patch) | |
tree | bb8000558a4eb75d7be1f3543d66bfc4c44bada9 /files | |
parent | 8d1313c84cc82d81363ed62b75baedb9a65ff2e3 (diff) | |
download | translated-content-6ca84f1794af830ada9736d7289ce29aabb04ca3.tar.gz translated-content-6ca84f1794af830ada9736d7289ce29aabb04ca3.tar.bz2 translated-content-6ca84f1794af830ada9736d7289ce29aabb04ca3.zip |
remove `notranslate` class in zh-TW
Diffstat (limited to 'files')
24 files changed, 248 insertions, 248 deletions
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 <p>思考這個例子:</p> <div> -<pre class="brush: js notranslate">function init() { +<pre class="brush: js">function init() { var name = "Mozilla"; // name 是個由 init 建立的局部變數 function displayName() { // displayName() 是內部函式,一個閉包 alert(name); // 使用了父函式宣告的變數 @@ -32,7 +32,7 @@ init();</pre> <p>再思考這個例子:</p> -<pre class="brush: js notranslate">function makeFunc() { +<pre class="brush: js">function makeFunc() { var name = "Mozilla"; function displayName() { alert(name); @@ -52,7 +52,7 @@ myFunc(); <p>這裡有個更有趣的例子:<code>makeAdder</code> 函式:</p> -<pre class="brush: js notranslate">function makeAdder(x) { +<pre class="brush: js">function makeAdder(x) { return function(y) { return x + y; }; @@ -81,7 +81,7 @@ console.log(add10(2)); // 12 <p>例如,假設我們想在網頁上,加個能調整文字大小的按鈕。其中一個方法是用像素指定 <code>body</code> 元素的 font-size,接著透過相對的 em 單位,設置其他頁面的其他元素(如 headers)個大小:</p> -<pre class="brush: css notranslate">body { +<pre class="brush: css">body { font-family: Helvetica, Arial, sans-serif; font-size: 12px; } @@ -99,7 +99,7 @@ h2 { <p>以下是 JavaScript:</p> -<pre class="brush: js notranslate">function makeSizer(size) { +<pre class="brush: js">function makeSizer(size) { return function() { document.body.style.fontSize = size + 'px'; }; @@ -112,12 +112,12 @@ var size16 = makeSizer(16); <p><code>size12</code>、<code>size14</code>、<code>size16</code> 現在變成能調整字體大小到 12、14、與 16 像素的函式。而我們能如下例一般,把他們附加到按鈕上(本例為連結):</p> -<pre class="brush: js notranslate">document.getElementById('size-12').onclick = size12; +<pre class="brush: js">document.getElementById('size-12').onclick = size12; document.getElementById('size-14').onclick = size14; document.getElementById('size-16').onclick = size16; </pre> -<pre class="brush: html notranslate"><a href="#" id="size-12">12</a> +<pre class="brush: html"><a href="#" id="size-12">12</a> <a href="#" id="size-14">14</a> <a href="#" id="size-16">16</a> </pre> @@ -132,7 +132,7 @@ document.getElementById('size-16').onclick = size16; <p>以下展示如何使用閉包來定義一個能夠訪問私有函式與變數的公開函式。這種閉包的用法稱為模組設計模式(<a class="external" href="http://www.google.com/search?q=javascript+module+pattern" title="http://www.google.com/search?q=javascript+module+pattern">module pattern</a>)。</p> -<pre class="brush: js notranslate">var counter = (function() { +<pre class="brush: js">var counter = (function() { var privateCounter = 0; function changeBy(val) { privateCounter += val; @@ -168,7 +168,7 @@ console.log(counter.value()); // logs 1 <p>你應該也發現到我們定義了建立 counter 的匿名函式、而我們接著呼叫它,並給<code>counter</code> 變數指派了回傳值。我們也能在分離的變數 <code>makeCounter</code> 儲存函式並用其建立數個 counter。</p> </div> -<pre class="brush: js notranslate">var makeCounter = function() { +<pre class="brush: js">var makeCounter = function() { var privateCounter = 0; function changeBy(val) { privateCounter += val; @@ -207,13 +207,13 @@ alert(counter2.value()); /* Alerts 0 */ <p>在 ECMAScript 2015 導入 <a href="/zh-TW/docs/Web/JavaScript/Reference/Statements/let" title="let"><code>let</code></a> 前,迴圈內建立的閉包,常會發生問題。請思考以下的範例:</p> -<pre class="brush: html notranslate"><p id="help">Helpful notes will appear here</p> +<pre class="brush: html"><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> </pre> -<pre class="brush: js notranslate">function showHelp(help) { +<pre class="brush: js">function showHelp(help) { document.getElementById('help').innerHTML = help; } @@ -245,7 +245,7 @@ setupHelp(); <p>其中一個解法是使用更多閉包,尤其要使用前述的函式工廠:</p> -<pre class="brush: js notranslate">function showHelp(help) { +<pre class="brush: js">function showHelp(help) { document.getElementById('help').innerHTML = help; } @@ -277,7 +277,7 @@ setupHelp(); <p>用匿名閉包來實做的另一種方法是:</p> -<pre class="brush: js notranslate">function showHelp(help) { +<pre class="brush: js">function showHelp(help) { document.getElementById('help').innerHTML = help; } @@ -302,7 +302,7 @@ setupHelp();</pre> <p>如果你不想用更多閉包的話,你可以使用 ES2015 的 <code><a href="https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/let">let</a></code> 關鍵字:</p> -<pre class="brush: js notranslate">function showHelp(help) { +<pre class="brush: js">function showHelp(help) { document.getElementById('help').innerHTML = help; } @@ -334,7 +334,7 @@ setupHelp(); <p>思考一下這個例子:</p> -<pre class="brush: js notranslate">function MyObject(name, message) { +<pre class="brush: js">function MyObject(name, message) { this.name = name.toString(); this.message = message.toString(); this.getName = function() { @@ -349,7 +349,7 @@ setupHelp(); <p>上面的程式碼並未利用閉包的益處,所以,可以改成這個樣子:</p> -<pre class="brush: js notranslate">function MyObject(name, message) { +<pre class="brush: js">function MyObject(name, message) { this.name = name.toString(); this.message = message.toString(); } @@ -365,7 +365,7 @@ MyObject.prototype = { <p>但我們不建議重新定義原型,因此這個附加到現有原型的例子更佳:</p> -<pre class="brush: js notranslate">function MyObject(name, message) { +<pre class="brush: js">function MyObject(name, message) { this.name = name.toString(); this.message = message.toString(); } @@ -379,7 +379,7 @@ MyObject.prototype.getMessage = function() { <p>以上的程式碼,可以寫得如同下例般簡潔:</p> -<pre class="brush: js notranslate">function MyObject(name, message) { +<pre class="brush: js">function MyObject(name, message) { this.name = name.toString(); this.message = message.toString(); } diff --git a/files/zh-tw/web/javascript/data_structures/index.html b/files/zh-tw/web/javascript/data_structures/index.html index f39aab97d0..a8462f6e55 100644 --- a/files/zh-tw/web/javascript/data_structures/index.html +++ b/files/zh-tw/web/javascript/data_structures/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Data_structures <p>JavaScript 是弱型別,也能說是動態的程式語言。這代表你不必特別宣告變數的型別。程式在運作時,型別會自動轉換。這也代表你可以以不同的型別使用同一個變數。</p> -<pre class="brush: js notranslate">var foo = 42; // foo 目前是數字 +<pre class="brush: js">var foo = 42; // foo 目前是數字 var foo = 'bar'; // foo 目前是字串 var foo = true; // foo 目前是布林值 </pre> @@ -59,7 +59,7 @@ var foo = true; // foo 目前是布林值 <p>The number type has only one integer that has two representations: 0 is represented as -0 and +0. ("0" is an alias for +0). In the praxis, this has almost no impact. For example <code>+0 === -0</code> is <code>true</code>. However, you are able to notice this when you divide by zero:</p> -<pre class="brush: js notranslate">> 42 / +0 +<pre class="brush: js">> 42 / +0 Infinity > 42 / -0 -Infinity 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 2792b5682a..c4a1dd74e6 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 @@ -28,19 +28,19 @@ translation_of: Web/JavaScript/Guide/Expressions_and_Operators <p>JavaScript 同時具有二元運算子及一元運算子, 以及一種特殊的 三元運算子,也就是 條件運算子。 一個二元運算子需要具備兩個運算元, 一個在運算元之前,一個在運算元之後:</p> -<pre class="syntaxbox notranslate"><em>運算元1</em> <em>運算子</em> <em>運算元2</em> +<pre class="syntaxbox"><em>運算元1</em> <em>運算子</em> <em>運算元2</em> </pre> <p>例如, <code>3+4</code> 或 <code>x*y</code>.</p> <p>一個 一元運算子 需要一個運算元, 位於運算子之前或之後:</p> -<pre class="syntaxbox notranslate"><em>運算子</em> <em>運算元</em> +<pre class="syntaxbox"><em>運算子</em> <em>運算元</em> </pre> <p>或</p> -<pre class="syntaxbox notranslate"><em>運算元 運算子</em> +<pre class="syntaxbox"><em>運算元 運算子</em> </pre> <p>例如, <code>x++</code> 或 <code>++x</code>.</p> @@ -133,7 +133,7 @@ translation_of: Web/JavaScript/Guide/Expressions_and_Operators <p>為了進行更複雜的賦值,<a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">解構賦值</a>是 JavaScript 用來從陣列或物件中提取資料的語法。</p> -<pre class="brush: js notranslate">var foo = ['one', 'two', 'three']; +<pre class="brush: js">var foo = ['one', 'two', 'three']; // 不使用解構 var one = foo[0]; @@ -147,7 +147,7 @@ var [one, two, three] = foo;</pre> <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">比較運算子</a> 會比較 運算元 並基於比較的結果回傳邏輯值。 運算元可以是數字,字串,邏輯,或物件的值。 字串的比較是基於字典序的, 使用 Unicode 的值。 在多數情況下,假如兩個運算元不具有相同型態, JavaScript 會嘗試將它們轉換成相同型態。這個行為通常是將運算元以數學形式對待。 在某些的轉換型態的例外中會使用到 <code>===</code> 及 <code>!==</code> 運算子, 它們會嚴格地進行相等或不相等的比較。 這些運算子不會在確認相等與否前嘗試轉換運算元的型態。 下面的表解釋了比較運算子:</p> -<pre class="brush: js notranslate">var var1 = 3; +<pre class="brush: js">var var1 = 3; var var2 = 4; </pre> @@ -220,7 +220,7 @@ var var2 = 4; <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators">算術運算子</a> 以 數值 (文字或變數也可以)作為其運算元,並回傳單一數值。最常見的算術運算元是 加法 (<code>+</code>),減法 (<code>-</code>), 乘法 (<code>*</code>),及除法 (<code>/</code>)。 這些運算子在大多數程式語言中功能相同 (比較特別的是,在除數為0時 {{jsxref("Infinity")}})。例如:</p> -<pre class="brush: js notranslate">1 / 2; // 0.5 +<pre class="brush: js">1 / 2; // 0.5 1 / 2 == 1.0 / 2.0; // 會是 true </pre> @@ -331,7 +331,7 @@ var var2 = 4; <ul> <li>運算元被轉換為32 bits 的整數以二進位形式表示 (0 和 1)。大於 32 bits 的數字將被捨棄多出來的位元。例如, 下列整數大於32個bit但是會被轉換為32個bit的整數: - <pre class="notranslate">轉換之前: 11100110111110100000000000000110000000000001 + <pre>轉換之前: 11100110111110100000000000000110000000000001 轉換之後: 10100000000000000110000000000001</pre> </li> <li>第一個運算元中的每個bit分別對應到第二個運算元的每個bit: 第一個 bit 對 第一個 bit, 第二個 bit 對 第二個 bit, 以此類推。</li> @@ -453,7 +453,7 @@ var var2 = 4; <p>下面是 <code>&&</code> (邏輯 AND) 運算子 的範例。</p> -<pre class="brush: js notranslate">var a1 = true && true; // t && t 回傳 true +<pre class="brush: js">var a1 = true && true; // t && t 回傳 true var a2 = true && false; // t && f 回傳 false var a3 = false && true; // f && t 回傳 false var a4 = false && (3 == 4); // f && f 回傳 false @@ -464,7 +464,7 @@ var a7 = "Cat" && false; // t && f 回傳 false <p>下列是 || (邏輯 OR) 運算子的範例。</p> -<pre class="brush: js notranslate">var o1 = true || true; // t || t 回傳 true +<pre class="brush: js">var o1 = true || true; // t || t 回傳 true var o2 = false || true; // f || t 回傳 true var o3 = true || false; // t || f 回傳 true var o4 = false || (3 == 4); // f || f 回傳 false @@ -475,7 +475,7 @@ var o7 = 'Cat' || false; // t || f 回傳 Cat <p>下列是 ! (邏輯 NOT) 運算子的範例。</p> -<pre class="brush: js notranslate">var n1 = !true; // !t 回傳 false +<pre class="brush: js">var n1 = !true; // !t 回傳 false var n2 = !false; // !f 回傳 true var n3 = !'Cat'; // !t 回傳 false </pre> @@ -497,27 +497,27 @@ var n3 = !'Cat'; // !t 回傳 false <p>例如,</p> -<pre class="brush: js notranslate">console.log('我的 ' + '字串'); // 會印出 字串 "我的字串"。</pre> +<pre class="brush: js">console.log('我的 ' + '字串'); // 會印出 字串 "我的字串"。</pre> <p>簡化的設定運算子 += 也能用於串接字串。</p> <p>例如,</p> -<pre class="brush: js notranslate">var mystring = '字'; +<pre class="brush: js">var mystring = '字'; mystring += '母'; // 得到 "字母" 並賦與給變數 mystring.</pre> <h3 id="條件(三元)運算子">條件(三元)運算子</h3> <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator">條件運算子</a> 是 JavaScript 中唯一需要三個運算元的運算子。 這個運算子接受兩個運算元作為值且一個運算元作為條件。 語法是:</p> -<pre class="syntaxbox notranslate"><em>條件</em> ? <em>值1</em> : <em>值2</em> +<pre class="syntaxbox"><em>條件</em> ? <em>值1</em> : <em>值2</em> </pre> <p>如果 <em>條件</em> 為 true,運算子回傳 <em>值1,</em> 否則回傳 <em>值2。</em> 你可以在任何使用標準運算子的地方改用 條件運算子。</p> <p>例如,</p> -<pre class="brush: js notranslate">var status = (age >= 18) ? '成人' : '小孩'; +<pre class="brush: js">var status = (age >= 18) ? '成人' : '小孩'; </pre> <p>這個陳述句會將 "成人" 賦與給變數 <code>status</code> 假如 <code>age</code> 大於等於18。 否則,會將 "小孩" 賦與給變數 <code>status</code>。</p> @@ -528,7 +528,7 @@ mystring += '母'; // 得到 "字母" 並賦與給變數 mystring.</pre> <p>例如,假如 <code>a</code> 是一個有十個物件在裡面的二維陣列, 下面的程式中就使用了逗點運算子來同時更新兩個變數。 這段程式碼會印出陣列中所有對角線上的物件:</p> -<pre class="brush: js notranslate">for (var i = 0, j = 9; i <= j; i++, j--) +<pre class="brush: js">for (var i = 0, j = 9; i <= j; i++, j--) console.log('a[' + i + '][' + j + ']= ' + a[i][j]); </pre> @@ -540,7 +540,7 @@ mystring += '母'; // 得到 "字母" 並賦與給變數 mystring.</pre> <p><code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">delete</a></code> 運算子會刪除物件,物件的性質,或是陣列中指定 index 的物件。 語法是:</p> -<pre class="brush: js notranslate">delete 物件名稱; +<pre class="brush: js">delete 物件名稱; delete 物件名稱.性質; delete 物件名稱[索引]; delete 性質; // 只有在 with 陳述句中可以使用 @@ -554,7 +554,7 @@ delete 性質; // 只有在 with 陳述句中可以使用 <p>假如 <code>delete</code> 運算子使用成功, 它會將物件 或是 物件的特性設定為 <code>未定義。</code> <code>delete</code> 運算子會在運算成功時回傳 true ,失敗時回傳 <code>false</code> 。</p> -<pre class="brush: js notranslate">x = 42; +<pre class="brush: js">x = 42; var y = 43; myobj = new Number(); myobj.h = 4; // 建立特性 h @@ -571,7 +571,7 @@ delete myobj; // 回傳 true (在隱式宣告時可被刪除) <p>當使用 <code>delete</code> 運算子刪除陣列中的一個元素後, 那個元素便不再存在於陣列中了。 在下面的程式中, <code>trees[3]</code> 被用 delete 移除了。然而, <code>trees[3]</code> 的記憶體位址仍可用並且會回傳 未定義。</p> -<pre class="brush: js notranslate">var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple']; +<pre class="brush: js">var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple']; delete trees[3]; if (3 in trees) { // 不會執行到這裡 @@ -580,7 +580,7 @@ if (3 in trees) { <p>假如你希望給予陣列元素 未定義 的值, 你可以直接使用 <code>undefined</code> 關鍵字而不是使用 delete 運算子。 下列範例中, <code>trees[3]</code> 被指定了 <code>undefined</code>, 然而陣列元素依然存在:</p> -<pre class="brush: js notranslate">var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple']; +<pre class="brush: js">var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple']; trees[3] = undefined; if (3 in trees) { // 會執行這裡 @@ -591,7 +591,7 @@ if (3 in trees) { <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/typeof"><code>typeof</code> 運算子</a> 能以下列任一方式使用:</p> -<pre class="syntaxbox notranslate">typeof 運算元 +<pre class="syntaxbox">typeof 運算元 typeof (運算元) </pre> @@ -599,7 +599,7 @@ typeof (運算元) <p>假設你定義了以下這些變數:</p> -<pre class="brush: js notranslate">var myFun = new Function('5 + 2'); +<pre class="brush: js">var myFun = new Function('5 + 2'); var shape = 'round'; var size = 1; var today = new Date(); @@ -607,7 +607,7 @@ var today = new Date(); <p><code>typeof</code> 運算子會回傳下列結果:</p> -<pre class="brush: js notranslate">typeof myFun; // 回傳 "function" +<pre class="brush: js">typeof myFun; // 回傳 "function" typeof shape; // 回傳 "string" typeof size; // 回傳 "number" typeof today; // 回傳 "object" @@ -616,26 +616,26 @@ typeof doesntExist; // 回傳 "undefined" <p>對於 <code>true</code> 和 <code>null關鍵字,</code> <code>typeof</code> 運算子會回傳下列結果:</p> -<pre class="brush: js notranslate">typeof true; // 回傳 "boolean" +<pre class="brush: js">typeof true; // 回傳 "boolean" typeof null; // 回傳 "object" </pre> <p>對於字串或數字, <code>typeof</code> 運算子會回傳下列結果:</p> -<pre class="brush: js notranslate">typeof 62; // 回傳 "number" +<pre class="brush: js">typeof 62; // 回傳 "number" typeof 'Hello world'; // 回傳 "string" </pre> <p>對於特性,<code>typeof</code> 運算子會回傳 特性的值的類型:</p> -<pre class="brush: js notranslate">typeof document.lastModified; // 回傳 "string" +<pre class="brush: js">typeof document.lastModified; // 回傳 "string" typeof window.length; // 回傳 "number" typeof Math.LN2; // 回傳 "number" </pre> <p>對於 方法 及 函式, <code>typeof</code> 運算子會回傳下列結果:</p> -<pre class="brush: js notranslate">typeof blur; // 回傳 "function" +<pre class="brush: js">typeof blur; // 回傳 "function" typeof eval; // 回傳 "function" typeof parseInt; // 回傳 "function" typeof shape.split; // 回傳 "function" @@ -643,7 +643,7 @@ typeof shape.split; // 回傳 "function" <p>對於內建定義的物件, <code>typeof</code> 運算子會回傳下列結果:</p> -<pre class="brush: js notranslate">typeof Date; // 回傳 "function" +<pre class="brush: js">typeof Date; // 回傳 "function" typeof Function; // 回傳 "function" typeof Math; // 回傳 "object" typeof Option; // 回傳 "function" @@ -654,7 +654,7 @@ typeof String; // 回傳 "function" <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/void"><code>void</code> 運算子 </a>能以下列任一方式使用:</p> -<pre class="syntaxbox notranslate">void (運算式) +<pre class="syntaxbox">void (運算式) void 運算式 </pre> @@ -664,12 +664,12 @@ void 運算式 <p>下列範例是一個在點擊時甚麼都不做的超連結。 當使用者點擊連結時, <code>void(0)</code> 被解析為 未定義, 而甚麼都不會發生。</p> -<pre class="brush: html notranslate"><a href="javascript:void(0)">點擊這裡,甚麼都不會發生</a> +<pre class="brush: html"><a href="javascript:void(0)">點擊這裡,甚麼都不會發生</a> </pre> <p>下列範例是一個在使用者點擊時傳送表單的超連結。</p> -<pre class="brush: html notranslate"><a href="javascript:void(document.form.submit())"> +<pre class="brush: html"><a href="javascript:void(document.form.submit())"> 點擊以送出</a></pre> <h3 id="關係運算子">關係運算子</h3> @@ -680,14 +680,14 @@ void 運算式 <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/in"><code>in </code>運算子</a> 在指定性質存在於物件中時回傳 true 。 語法是:</p> -<pre class="brush: js notranslate">性質名稱 in 物件名稱 +<pre class="brush: js">性質名稱 in 物件名稱 </pre> <p>性質名稱 可以是 字串或數字,或是陣列的索引, 且<code> </code>物件名稱 是物件的名稱。</p> <p>下列範例示範了 <code>in</code> 運算子的一些用法。</p> -<pre class="brush: js notranslate">// 陣列 +<pre class="brush: js">// 陣列 var trees = ['redwood', 'bay', 'cedar', 'oak', 'maple']; 0 in trees; // 回傳 true 3 in trees; // 回傳 true @@ -711,7 +711,7 @@ var mycar = { make: 'Honda', model: 'Accord', year: 1998 }; <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/instanceof"><code>instanceof</code> 運算子</a> 在 指定物件 具有 指定的物件型態 時回傳 true。 語法是:</p> -<pre class="syntaxbox notranslate">物件名稱 instanceof 物件類型 +<pre class="syntaxbox">物件名稱 instanceof 物件類型 </pre> <p><code>物件名稱</code> 是用來與 物件類型 比較的物件的名字, 物件類型 是物件的類型, 例如 {{jsxref("Date")}} 或 {{jsxref("Array")}}。</p> @@ -720,7 +720,7 @@ var mycar = { make: 'Honda', model: 'Accord', year: 1998 }; <p>例如,下列程式碼使用 <code>instanceof</code> 來判斷變數 <code>theDay</code> 是不是 <code>Date</code> 類型的物件。 因為 <code>theDay</code> 是 <code>Date</code> 類型的物件, 所以if 陳述中的陳述句會被執行。</p> -<pre class="brush: js notranslate">var theDay = new Date(1995, 12, 17); +<pre class="brush: js">var theDay = new Date(1995, 12, 17); if (theDay instanceof Date) { // 會被執行的陳述 } @@ -838,13 +838,13 @@ if (theDay instanceof Date) { <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code> 關鍵字</a> 能取得當前所在物件。 一般而言, <code>this</code> 能取得呼叫處所在的物件。 你可以使用 點 或是 中括號 來取用該物件中的特性:</p> -<pre class="syntaxbox notranslate">this['特性名稱'] +<pre class="syntaxbox">this['特性名稱'] this.特性名稱 </pre> <p>以下定義一個叫做 <code>validate</code> 的函式,比較物件中特性 <code>value 與傳入的兩變數</code>:</p> -<pre class="brush: js notranslate">function validate(obj, lowval, hival){ +<pre class="brush: js">function validate(obj, lowval, hival){ if ((obj.value < lowval) || (obj.value > hival)) console.log('不可用的值!'); } @@ -852,7 +852,7 @@ this.特性名稱 <p>你可以在表單的 <code>onChange</code> event handler 中呼叫 <code>validate</code> 函式, 並以 <code>this</code> 來傳入表單的元素, 範例如下:</p> -<pre class="brush: html notranslate"><p>請輸入一介於18 與 99 的數字:</p> +<pre class="brush: html"><p>請輸入一介於18 與 99 的數字:</p> <input type="text" name="age" size=3 onChange="validate(this, 18, 99);"> </pre> @@ -860,7 +860,7 @@ this.特性名稱 <p>分組運算子 <code>( )</code> 控制了運算子的優先順序。 例如,你可以覆寫先乘除,後加減的優先順序,使其變成先加減,後乘除。</p> -<pre class="brush:js notranslate">var a = 1; +<pre class="brush:js">var a = 1; var b = 2; var c = 3; @@ -890,7 +890,7 @@ a * c + b * c // 9 <p>解析在許多程式語言中都存在,允許你快速地基於現存陣列產生新的陣列,例如:</p> -<pre class="brush:js notranslate">[for (i of [ 1, 2, 3 ]) i*i ]; +<pre class="brush:js">[for (i of [ 1, 2, 3 ]) i*i ]; // [ 1, 4, 9 ] var abc = [ 'A', 'B', 'C' ]; @@ -905,14 +905,14 @@ var abc = [ 'A', 'B', 'C' ]; <p>你可以使用 <a href="/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code> 運算子</a> 來建立一個使用者自定義物件或內建物件的實例。 用法如下:</p> -<pre class="brush: js notranslate">var 物件名稱 = new 物件型態([參數1, 參數2, ..., 參數N]); +<pre class="brush: js">var 物件名稱 = new 物件型態([參數1, 參數2, ..., 參數N]); </pre> <h4 id="super">super</h4> <p><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super 關鍵字</a> 用於呼叫物件的父物件中的函式。 在使用 <a href="/en-US/docs/Web/JavaScript/Reference/Classes">類別</a> 來呼叫父類別的建構子時很實用,例如:</p> -<pre class="syntaxbox notranslate">super([參數]); // 呼叫父物件的建構子. +<pre class="syntaxbox">super([參數]); // 呼叫父物件的建構子. super.父物件的函式([參數]); </pre> @@ -922,12 +922,12 @@ super.父物件的函式([參數]); <p><strong>範例:</strong> 現在你想要用已存在的一個陣列做為新的一個陣列的一部份,當字串常數不再可用而你必須使用指令式編程,也就是使用,一連串的 <code>push</code>, <code>splice</code>, <code>concat</code>,等等。 展開運算子能讓過程變得更加簡潔:</p> -<pre class="brush: js notranslate">var parts = ['肩膀', '膝蓋']; +<pre class="brush: js">var parts = ['肩膀', '膝蓋']; var lyrics = ['頭', ...parts, '和', '腳趾'];</pre> <p>相同的,展開運算子也適用於函式呼叫:</p> -<pre class="brush: js notranslate">function f(x, y, z) { } +<pre class="brush: js">function f(x, y, z) { } var args = [0, 1, 2]; f(...參數);</pre> diff --git a/files/zh-tw/web/javascript/guide/numbers_and_dates/index.html b/files/zh-tw/web/javascript/guide/numbers_and_dates/index.html index 88ed75fd3e..4bc86711c0 100644 --- a/files/zh-tw/web/javascript/guide/numbers_and_dates/index.html +++ b/files/zh-tw/web/javascript/guide/numbers_and_dates/index.html @@ -21,7 +21,7 @@ translation_of: Web/JavaScript/Guide/Numbers_and_dates <h3 id="十進制數值">十進制數值</h3> -<pre class="brush: js notranslate">1234567890 +<pre class="brush: js">1234567890 42 // 以零為開頭時要小心: @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Guide/Numbers_and_dates <p>二進制數值以 0 為開頭並跟著一個大寫或小寫的英文字母 「B」 (<code>0b</code> 或 <code>0B</code>)。如果 <code>0b</code> 後面接著的數字不是 0 或 1,那會丟出 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError(語法錯誤)</a></code>: "Missing binary digits after 0b"。</p> -<pre class="brush: js notranslate">var FLT_SIGNBIT = 0b10000000000000000000000000000000; // 2147483648 +<pre class="brush: js">var FLT_SIGNBIT = 0b10000000000000000000000000000000; // 2147483648 var FLT_EXPONENT = 0b01111111100000000000000000000000; // 2139095040 var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607</pre> @@ -44,27 +44,27 @@ var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607</pre> <p>八進制數值以 0 為開頭。如果 <code>0</code> 後面的數字超出 0 到 7 這個範圍,將會被解析成十進制數值。</p> -<pre class="brush: js notranslate">var n = 0755; // 493 +<pre class="brush: js">var n = 0755; // 493 var m = 0644; // 420 </pre> <p>Strict mode in ECMAScript 5 forbids octal syntax. Octal syntax isn't part of ECMAScript 5, but it's supported in all browsers by prefixing the octal number with a zero: <code>0644 === 420</code> and<code>"\045" === "%"</code>. In ECMAScript 2015, octal numbers are supported if they are prefixed with <code>0o</code>, e.g.: </p> -<pre class="brush: js notranslate">var a = 0o10; // ES2015: 8 +<pre class="brush: js">var a = 0o10; // ES2015: 8 </pre> <h3 id="十六進制數值">十六進制數值</h3> <p>十六進制數值以 0 為開頭並跟著一個大寫或小寫的英文字母 「X」(<code>0x</code> 或 <code>0X</code>)。如果 <code>0b</code> 後面接著的值超出範圍 (0123456789ABCDEF),那會丟出 <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError">SyntaxError(語法錯誤)</a></code>:"Identifier starts immediately after numeric literal"。</p> -<pre class="brush: js notranslate">0xFFFFFFFFFFFFFFFFF // 295147905179352830000 +<pre class="brush: js">0xFFFFFFFFFFFFFFFFF // 295147905179352830000 0x123456789ABCDEF // 81985529216486900 0XA // 10 </pre> <h3 id="指數運算">指數運算</h3> -<pre class="brush: js notranslate">1E3 // 1000 +<pre class="brush: js">1E3 // 1000 2e6 // 2000000 0.1e2 // 10</pre> @@ -72,7 +72,7 @@ var m = 0644; // 420 <p>The built-in {{jsxref("Number")}} object has properties for numerical constants, such as maximum value, not-a-number, and infinity. You cannot change the values of these properties and you use them as follows:</p> -<pre class="brush: js notranslate">var biggestNum = Number.MAX_VALUE; +<pre class="brush: js">var biggestNum = Number.MAX_VALUE; var smallestNum = Number.MIN_VALUE; var infiniteNum = Number.POSITIVE_INFINITY; var negInfiniteNum = Number.NEGATIVE_INFINITY; @@ -196,12 +196,12 @@ var notANum = Number.NaN; <p>The built-in {{jsxref("Math")}} object has properties and methods for mathematical constants and functions. For example, the <code>Math</code> object's <code>PI</code> property has the value of pi (3.141...), which you would use in an application as</p> -<pre class="brush: js notranslate">Math.PI +<pre class="brush: js">Math.PI </pre> <p>Similarly, standard mathematical functions are methods of <code>Math</code>. These include trigonometric, logarithmic, exponential, and other functions. For example, if you want to use the trigonometric function sine, you would write</p> -<pre class="brush: js notranslate">Math.sin(1.56) +<pre class="brush: js">Math.sin(1.56) </pre> <p>Note that all trigonometric methods of <code>Math</code> take arguments in radians.</p> @@ -288,7 +288,7 @@ var notANum = Number.NaN; <p>創建一個<code>Date</code>物件:</p> -<pre class="brush: js notranslate">var dateObjectName = new Date([parameters]); +<pre class="brush: js">var dateObjectName = new Date([parameters]); </pre> <p>在這裡創建一個名為<code>dateObjectName</code> 的 <code>Date</code> 物件;它可以是一個新的物件或是某個以存在的物件當中的屬性。</p> @@ -328,7 +328,7 @@ var notANum = Number.NaN; <p>舉例,假設你定義了一個日期如下:</p> -<pre class="brush: js notranslate">var Xmas95 = new Date('December 25, 1995'); +<pre class="brush: js">var Xmas95 = new Date('December 25, 1995'); </pre> <p>那 <code>Xmas95.getMonth()</code> 將會回傳 11, <code>Xmas95.getFullYear()</code> 會回傳 1995。</p> @@ -337,7 +337,7 @@ var notANum = Number.NaN; <p>For example, the following code displays the number of days left in the current year:</p> -<pre class="brush: js notranslate">var today = new Date(); +<pre class="brush: js">var today = new Date(); var endYear = new Date(1995, 11, 31, 23, 59, 59, 999); // Set day and month endYear.setFullYear(today.getFullYear()); // Set year to this year var msPerDay = 24 * 60 * 60 * 1000; // Number of milliseconds per day @@ -349,7 +349,7 @@ var daysLeft = Math.round(daysLeft); //returns days left in the year <p>The <code>parse</code> method is useful for assigning values from date strings to existing <code>Date</code> objects. For example, the following code uses <code>parse</code> and <code>setTime</code> to assign a date value to the <code>IPOdate</code> object:</p> -<pre class="brush: js notranslate">var IPOdate = new Date(); +<pre class="brush: js">var IPOdate = new Date(); IPOdate.setTime(Date.parse('Aug 9, 1995')); </pre> @@ -357,7 +357,7 @@ IPOdate.setTime(Date.parse('Aug 9, 1995')); <p>下面這個範例,<code>JSClock()</code> 這個函式將會以數位時鐘的格式回傳時間。</p> -<pre class="brush: js notranslate">function JSClock() { +<pre class="brush: js">function JSClock() { var time = new Date(); var hour = time.getHours(); var minute = time.getMinutes(); diff --git a/files/zh-tw/web/javascript/inheritance_and_the_prototype_chain/index.html b/files/zh-tw/web/javascript/inheritance_and_the_prototype_chain/index.html index 12ae7cee8d..744f6d9575 100644 --- a/files/zh-tw/web/javascript/inheritance_and_the_prototype_chain/index.html +++ b/files/zh-tw/web/javascript/inheritance_and_the_prototype_chain/index.html @@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain <p>以下是嘗試存取屬性時會發生的事:</p> -<pre class="brush: js notranslate">// 利用含有 a 與 b 屬性的 f 函式,建立一個 o 物件: +<pre class="brush: js">// 利用含有 a 與 b 屬性的 f 函式,建立一個 o 物件: let f = function () { this.a = 1; this.b = 2; @@ -74,7 +74,7 @@ console.log(o.d); // undefined <p>當繼承函式執行時,<a href="/zh-TW/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> 值指向繼承的物件,而不是在函式內擁有屬性的原型物件。</p> -<pre class="brush: js notranslate">var o = { +<pre class="brush: js">var o = { a: 2, m: function() { return this.a + 1; @@ -98,7 +98,7 @@ console.log(p.m()); // 5 <h3 id="含有語法結構的物件">含有語法結構的物件</h3> -<pre class="brush: js notranslate">var o = {a: 1}; +<pre class="brush: js">var o = {a: 1}; // 新建的 o 有個自己的 [[Prototype]] 稱為 Object.prototype // o 自己並沒有稱為「hasOwnProperty」的屬性 @@ -125,7 +125,7 @@ function f() { <p>JavaScript 建構子,就、只、是、個、被 <a href="/zh-TW/docs/Web/JavaScript/Reference/Operators/new">new 運算子</a>呼叫的函式。</p> -<pre class="brush: js notranslate">function Graph() { +<pre class="brush: js">function Graph() { this.vertices = []; this.edges = []; } @@ -145,7 +145,7 @@ var g = new Graph(); <p>ECMAScript 5 引入了新方法:{{jsxref("Object.create()")}}。呼叫這個方法就可以建立新的物件。這個物件的原型,為函式的第一個參數。</p> -<pre class="brush: js notranslate">var a = {a: 1}; +<pre class="brush: js">var a = {a: 1}; // a ---> Object.prototype ---> null var b = Object.create(a); @@ -165,7 +165,7 @@ console.log(d.hasOwnProperty); <p>ECMAScript 2015 引入了新的<a href="/zh-TW/docs/Web/JavaScript/Reference/Classes">類別</a>實做。儘管對那些基於類別的開發者來說,這種結構體令他們感到熟悉,它們依舊不一樣。JavaScript 依舊是基於原型的。新的關鍵字包括 {{jsxref("Statements/class", "class")}}、{{jsxref("Classes/constructor", "constructor")}}、{{jsxref("Classes/static", "static")}}、{{jsxref("Classes/extends", "extends")}}、{{jsxref("Operators/super", "super")}}。</p> -<pre class="brush: js notranslate">'use strict'; +<pre class="brush: js">'use strict'; class Polygon { constructor(height, width) { @@ -198,7 +198,7 @@ var square = new Square(2); <p>要檢查物件<em>本身</em>有沒有指定的屬性、也不需要查找整個原型鏈時,你必須使用由 <code>Object.prototype</code> 繼承的 <a href="/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a> 方法。</p> -<pre class="brush: js notranslate">console.log(g.hasOwnProperty('vertices')); +<pre class="brush: js">console.log(g.hasOwnProperty('vertices')); // true console.log(g.hasOwnProperty('nope')); @@ -227,7 +227,7 @@ console.log(g.__proto__.hasOwnProperty('addVertex')); <p><code>B</code> 要繼承自 <code>A</code>:</p> -<pre class="brush: js notranslate">function A(a) { +<pre class="brush: js">function A(a) { this.varA = a; } @@ -291,17 +291,17 @@ b.doSomething(); <p>因此當你:</p> -<pre class="brush: js notranslate">var o = new Foo();</pre> +<pre class="brush: js">var o = new Foo();</pre> <p>JavaScript 其實會:</p> -<pre class="brush: js notranslate">var o = new Object(); +<pre class="brush: js">var o = new Object(); o.[[Prototype]] = Foo.prototype; Foo.call(o);</pre> <p>或偶爾這樣:</p> -<pre class="brush: js notranslate">o.someProp;</pre> +<pre class="brush: js">o.someProp;</pre> <p>時,它檢查了 <code>o</code> 有沒有 <code>someProp</code> 屬性。如果沒有,就檢查 <code>Object.getPrototypeOf(o).someProp</code>;再沒有就檢查 <code>Object.getPrototypeOf(Object.getPrototypeOf(o)).someProp</code>,依此類推。</p> diff --git a/files/zh-tw/web/javascript/memory_management/index.html b/files/zh-tw/web/javascript/memory_management/index.html index d63cb223ff..16376c4d40 100644 --- a/files/zh-tw/web/javascript/memory_management/index.html +++ b/files/zh-tw/web/javascript/memory_management/index.html @@ -31,7 +31,7 @@ translation_of: Web/JavaScript/Memory_Management <p>為了不讓開發者對配置感到困擾,JavaScript 會在宣告值的同時完成記憶體配置</p> -<pre class="brush: js notranslate">var n = 123; // 配置一記憶體空間給數字 +<pre class="brush: js">var n = 123; // 配置一記憶體空間給數字 var s = 'azerty'; // 配置記憶體空間給字串 var o = { @@ -57,13 +57,13 @@ someElement.addEventListener('click', function() { <p>有些函式呼叫後產生物件配置。</p> -<pre class="brush: js notranslate">var d = new Date(); // 配置一個日期物件 +<pre class="brush: js">var d = new Date(); // 配置一個日期物件 var e = document.createElement('div'); // 配置一個 DOM 物件</pre> <p>有些方法配置新的值或物件:</p> -<pre class="brush: js notranslate">var s = 'azerty'; +<pre class="brush: js">var s = 'azerty'; var s2 = s.substr(0, 3); // s2 是一個新字串 // 因為字串是一種不可變的值, // JavaScript 會決定不分配新的記憶體, @@ -104,7 +104,7 @@ var a3 = a.concat(a2); <h4 id="範例">範例</h4> -<pre class="brush: js notranslate">var o = { +<pre class="brush: js">var o = { a: { b: 2 } @@ -135,7 +135,7 @@ oa = null; // 現在把 oa 變成 null <p>當涉及到循環時有一個限制。在下面的例子中,創造兩個物件並相互參考,從而製作一個循環。當呼叫函式時,他們應該超出作用範圍,因此他們實際上是無用且可釋放。但垃圾回收參考計數演算法會認為,兩個物件都至少被參考一次,因此兩個都是不能被回收的。</p> -<pre class="brush: js notranslate">function f() { +<pre class="brush: js">function f() { var o = {}; var o2 = {}; o.a = o2; // o 參考 o2 @@ -151,7 +151,7 @@ f(); <p>Internet Explorer 6和7有一個DOM物件的垃圾回收參考計數。循環是一個造成記憶體洩漏(memory leaks)的常見問題:</p> -<pre class="brush: js notranslate">var div; +<pre class="brush: js">var div; window.onload = function() { div = document.getElementById('myDivElement'); div.circularReference = div; @@ -193,7 +193,7 @@ window.onload = function() { <p>We can also expose the garbage collector for debugging memory issues using a flag and the <a href="https://nodejs.org/en/docs/guides/debugging-getting-started/">Chrome Debugger</a>:</p> -<pre class="notranslate">node --expose-gc --inspect index.js</pre> +<pre>node --expose-gc --inspect index.js</pre> <h2 id="可以參考">可以參考</h2> diff --git a/files/zh-tw/web/javascript/reference/classes/constructor/index.html b/files/zh-tw/web/javascript/reference/classes/constructor/index.html index 8da81e9b71..aa0e2bf896 100644 --- a/files/zh-tw/web/javascript/reference/classes/constructor/index.html +++ b/files/zh-tw/web/javascript/reference/classes/constructor/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Classes/constructor <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">constructor([arguments]) { ... }</pre> +<pre class="syntaxbox">constructor([arguments]) { ... }</pre> <h2 id="敘述">敘述</h2> @@ -23,7 +23,7 @@ translation_of: Web/JavaScript/Reference/Classes/constructor <p>這段程式碼是從 <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">classes sample</a> 擷取而來。(<a href="https://googlechrome.github.io/samples/classes-es6/index.html">線上範例</a>)</p> -<pre class="brush: js notranslate">class Square extends Polygon { +<pre class="brush: js">class Square extends Polygon { constructor(length) { // 我們在這裡呼叫了 class 的建構子提供多邊形的長寬值 super(length, length); @@ -44,12 +44,12 @@ translation_of: Web/JavaScript/Reference/Classes/constructor <p>如上文所說:如果不指定建構子,就會使用預設的建構子。對 base classes 而言,預設的建構子長得像這樣:</p> -<pre class="brush: js notranslate">constructor() {} +<pre class="brush: js">constructor() {} </pre> <p>對 derived class 而言,預設的建構子長得像這樣:</p> -<pre class="brush: js notranslate">constructor(...args) { +<pre class="brush: js">constructor(...args) { super(...args); }</pre> diff --git a/files/zh-tw/web/javascript/reference/functions/arguments/index.html b/files/zh-tw/web/javascript/reference/functions/arguments/index.html index 6b1d6a45a1..ddccefae10 100644 --- a/files/zh-tw/web/javascript/reference/functions/arguments/index.html +++ b/files/zh-tw/web/javascript/reference/functions/arguments/index.html @@ -16,7 +16,7 @@ translation_of: Web/JavaScript/Reference/Functions/arguments <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">arguments</pre> +<pre class="syntaxbox">arguments</pre> <h2 id="描述">描述</h2> @@ -32,20 +32,20 @@ translation_of: Web/JavaScript/Reference/Functions/arguments <p>For example, if a function is passed three arguments, you can refer to them as follows:</p> -<pre class="brush: js notranslate">arguments[0] +<pre class="brush: js">arguments[0] arguments[1] arguments[2] </pre> <p>arguments 也可以被指定:</p> -<pre class="brush: js notranslate">arguments[1] = 'new value';</pre> +<pre class="brush: js">arguments[1] = 'new value';</pre> <p><code>arguments</code> 物件不是陣列。它與陣列非常相似,但是它沒有除了 <code>length</code> 這個屬性以外的其他陣列屬性。舉例,它沒有 <code>pop</code> 這個陣列方法。</p> <p>然而,它依然可以被轉換為真正的陣列(Array)。</p> -<pre class="brush: js notranslate">var args = Array.prototype.slice.call(arguments); +<pre class="brush: js">var args = Array.prototype.slice.call(arguments); var args = [].slice.call(arguments); // ES2015 @@ -55,7 +55,7 @@ const args = Array.from(arguments); <div class="warning"> <p class="brush: js">Using slice on arguments prevents optimizations in some JavaScript engines (V8 for example - <a href="https://github.com/petkaantonov/bluebird/wiki/Optimization-killers#3-managing-arguments">more information</a>). If you care for them, try constructing a new array by iterating through the arguments object instead. An alternative would be to use the despised <code>Array</code> constructor as a function:</p> -<pre class="brush: js notranslate">var args = (arguments.length === 1 ? [arguments[0]] : Array.apply(null, arguments));</pre> +<pre class="brush: js">var args = (arguments.length === 1 ? [arguments[0]] : Array.apply(null, arguments));</pre> </div> <p>You can use the <code>arguments</code> object if you call a function with more arguments than it is formally declared to accept. This technique is useful for functions that can be passed a variable number of arguments. Use <code><a href="/en-US/docs/JavaScript/Reference/Functions_and_function_scope/arguments/length">arguments.length</a></code> to determine the number of arguments passed to the function, and then process each argument by using the <code>arguments</code> object. To determine the number of parameters in the function <a href="/en-US/docs/Glossary/Signature/Function">signature</a>, use the <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function/length">Function.length</a></code> property.</p> @@ -64,17 +64,17 @@ const args = Array.from(arguments); <p>The typeof arguments returns 'object'. </p> -<pre class="notranslate">console.log(typeof arguments); // 'object' </pre> +<pre>console.log(typeof arguments); // 'object' </pre> <p>The typeof individual arguments can be determined with the use of indexing.</p> -<pre class="notranslate">console.log(typeof arguments[0]); //this will return the typeof individual arguments.</pre> +<pre>console.log(typeof arguments[0]); //this will return the typeof individual arguments.</pre> <h3 id="Using_the_Spread_Syntax_with_Arguments">Using the Spread Syntax with Arguments</h3> <p>You can also use the {{jsxref("Array.from()")}} method or the <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator">spread operator</a> to convert arguments to a real Array:</p> -<pre class="brush: js notranslate">var args = Array.from(arguments); +<pre class="brush: js">var args = Array.from(arguments); var args = [...arguments]; </pre> @@ -97,14 +97,14 @@ var args = [...arguments]; <p>This example defines a function that concatenates several strings. The only formal argument for the function is a string that specifies the characters that separate the items to concatenate. The function is defined as follows:</p> -<pre class="brush:js notranslate">function myConcat(separator) { +<pre class="brush:js">function myConcat(separator) { var args = Array.prototype.slice.call(arguments, 1); return args.join(separator); }</pre> <p>You can pass any number of arguments to this function, and it creates a list using each argument as an item in the list.</p> -<pre class="brush:js notranslate">// returns "red, orange, blue" +<pre class="brush:js">// returns "red, orange, blue" myConcat(', ', 'red', 'orange', 'blue'); // returns "elephant; giraffe; lion; cheetah" @@ -117,7 +117,7 @@ myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');</pre> <p>This example defines a function that creates a string containing HTML for a list. The only formal argument for the function is a string that is "<code>u</code>" if the list is to be unordered (bulleted), or "<code>o</code>" if the list is to be ordered (numbered). The function is defined as follows:</p> -<pre class="brush:js notranslate">function list(type) { +<pre class="brush:js">function list(type) { var result = '<' + type + 'l><li>'; var args = Array.prototype.slice.call(arguments, 1); result += args.join('</li><li>'); @@ -128,7 +128,7 @@ myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');</pre> <p>You can pass any number of arguments to this function, and it adds each argument as an item to a list of the type indicated. For example:</p> -<pre class="brush:js notranslate">var listHTML = list('u', 'One', 'Two', 'Three'); +<pre class="brush:js">var listHTML = list('u', 'One', 'Two', 'Three'); /* listHTML is: @@ -140,7 +140,7 @@ myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');</pre> <p>The <code>arguments</code> object can be used in conjunction with <a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">rest</a>, <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters">default</a>, and <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destructured</a> parameters.</p> -<pre class="brush: js notranslate">function foo(...args) { +<pre class="brush: js">function foo(...args) { return args; } foo(1, 2, 3); // [1,2,3] @@ -150,7 +150,7 @@ foo(1, 2, 3); // [1,2,3] <p>When a non-strict function <strong><strong>does </strong>not</strong> contain <a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">rest</a>, <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters">default</a>, or <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destructured</a> parameters, then the values in the <code>arguments</code> object <strong>do</strong> track the values of the arguments (and vice versa). See the code below:</p> -<pre class="brush: js notranslate">function func(a) { +<pre class="brush: js">function func(a) { arguments[0] = 99; // updating arguments[0] also updates a console.log(a); } @@ -159,7 +159,7 @@ func(10); // 99 <p>and</p> -<pre class="brush: js notranslate">function func(a) { +<pre class="brush: js">function func(a) { a = 99; // updating a also updates arguments[0] console.log(arguments[0]); } @@ -168,7 +168,7 @@ func(10); // 99 <p>When a non-strict function <strong>does</strong> contain <a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">rest</a>, <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters">default</a>, or <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destructured</a> parameters, then the values in the <code>arguments</code> object <strong>do not</strong> track the values of the arguments (and vice versa). Instead, they reflect the arguments provided at the time of invocation:</p> -<pre class="brush: js notranslate">function func(a = 55) { +<pre class="brush: js">function func(a = 55) { arguments[0] = 99; // updating arguments[0] does not also update a console.log(a); } @@ -176,7 +176,7 @@ func(10); // 10</pre> <p>and</p> -<pre class="brush: js notranslate">function func(a = 55) { +<pre class="brush: js">function func(a = 55) { a = 99; // updating a does not also update arguments[0] console.log(arguments[0]); } @@ -185,7 +185,7 @@ func(10); // 10 <p>and</p> -<pre class="brush: js notranslate">function func(a = 55) { +<pre class="brush: js">function func(a = 55) { console.log(arguments[0]); } func(); // undefined</pre> diff --git a/files/zh-tw/web/javascript/reference/functions/arrow_functions/index.html b/files/zh-tw/web/javascript/reference/functions/arrow_functions/index.html index 82285afeae..0b53f14444 100644 --- a/files/zh-tw/web/javascript/reference/functions/arrow_functions/index.html +++ b/files/zh-tw/web/javascript/reference/functions/arrow_functions/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Functions/Arrow_functions <h2 id="基本語法">基本語法</h2> -<pre class="syntaxbox notranslate">(參數1, 參數2, …, 參數N) => { 陳述式; } +<pre class="syntaxbox">(參數1, 參數2, …, 參數N) => { 陳述式; } (參數1, 參數2, …, 參數N) => 表示式; // 等相同(參數1, 參數2, …, 參數N) => { return 表示式; } @@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Functions/Arrow_functions <h2 id="進階語法">進階語法</h2> -<pre class="syntaxbox notranslate">// 用大括號將內容括起來,返回一個物件字面值表示法: +<pre class="syntaxbox">// 用大括號將內容括起來,返回一個物件字面值表示法: params => ({foo: bar}) // 支援<a href="/zh-TW/docs/Web/JavaScript/Reference/Functions/rest_parameters">其餘參數</a>與<a href="/zh-TW/docs/Web/JavaScript/Reference/Functions/Default_parameters">預設參數</a> @@ -46,7 +46,7 @@ var f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c; f(); // 6 <h3 id="更短的函式寫法">更短的函式寫法</h3> -<pre class="brush: js notranslate">var elements = [ +<pre class="brush: js">var elements = [ 'Hydrogen', 'Helium', 'Lithium', @@ -96,7 +96,7 @@ elements.map(({ length }) => length); // [8, 6, 7, 9] <p>事實證明這對物件導向程式設計來說並不理想。</p> -<pre class="brush: js notranslate">function Person() { +<pre class="brush: js">function Person() { // Person() 建構式將 this 定義為它自己的一個實體 this.age = 0; @@ -112,7 +112,7 @@ var p = new Person();</pre> <p>在 ECMAScript 3/5 裡面,有關 <code>this</code> 的問題,可以透過指派 <code>this</code> 值給可以關閉的變數解決。</p> -<pre class="brush: js notranslate">function Person() { +<pre class="brush: js">function Person() { var self = this; // 有些人喜歡 `that` 而不是 `self`. // 選好一種取法後始終如一 self.age = 0; @@ -129,7 +129,7 @@ var p = new Person();</pre> <p>因此,在以下程式碼內,傳遞給 <code>setInterval</code> 的 箭頭函式中的<code>this</code> ,會與封閉函式的 <code>this</code> 值相同:</p> -<pre class="brush: js notranslate">function Person(){ +<pre class="brush: js">function Person(){ this.age = 0; setInterval(() => { @@ -143,7 +143,7 @@ var p = new Person();</pre> <p>由於 <code>this</code> 變數具有詞彙上綁定意義,所以<a href="/zh-TW/docs/Web/JavaScript/Reference/Strict_mode">嚴格模式</a>的宣告對 <code>this</code> 的作用將被忽略。</p> -<pre class="brush: js notranslate">var f = () => {'use strict'; return this}; +<pre class="brush: js">var f = () => {'use strict'; return this}; f() === window; // 或是 global 物件</pre> <p>但嚴格模式的其他作用依舊存在。</p> @@ -152,7 +152,7 @@ f() === window; // 或是 global 物件</pre> <p>由於箭頭函式並沒有自己的 <code>this</code>,所以透過 <code>call()</code> 或 <code>apply()</code> 呼叫箭頭函式只能傳入參數。<code>thisArg</code> 將會被忽略。</p> -<pre class="brush: js notranslate">var adder = { +<pre class="brush: js">var adder = { base : 1, add : function(a) { var f = v => v + this.base; @@ -174,7 +174,7 @@ console.log(adder.addThruCall(1)); // 依舊顯示 2 <p>箭頭函式並沒有自己的 <a href="/zh-TW/docs/Web/JavaScript/Reference/Functions/arguments"><code>arguments</code> 物件</a>。所以在此例中,<code>arguments</code> 只是參考到 enclosing 作用域裡面的相同變數:</p> -<pre class="brush: js notranslate">var arguments = [1, 2, 3]; +<pre class="brush: js">var arguments = [1, 2, 3]; var arr = () => arguments[0]; arr(); // 1 @@ -188,7 +188,7 @@ foo(1); // 2</pre> <p>大多時候,使用<a href="/zh-TW/docs/Web/JavaScript/Reference/Functions/rest_parameters">其餘參數</a> 是取代 <code>arguments</code> 物件的較好方式。</p> -<pre class="brush: js notranslate">function foo(n) { +<pre class="brush: js">function foo(n) { var f = (...args) => args[0] + n; return f(10); } @@ -199,7 +199,7 @@ foo(1); // 11</pre> <p>如同前述,箭頭函式運算式最適合用在非方法的函式。來看看如果要把它們當成方法來用,會發生什麼事:</p> -<pre class="brush: js notranslate"><code>'use strict'; +<pre class="brush: js"><code>'use strict'; var obj = { i: 10, b: () => console.log(this.i, this), @@ -212,7 +212,7 @@ obj.c(); // 印出 10, Object {...}</code></pre> <p>箭頭函式並沒有自己的 <code>this</code>。另一個例子與 {{jsxref("Object.defineProperty()")}} 有關:</p> -<pre class="brush: js notranslate">'use strict'; +<pre class="brush: js">'use strict'; var obj = { a: 10 @@ -230,14 +230,14 @@ Object.defineProperty(obj, 'b', { <p>箭頭函式不可作為建構式使用;若使用於建構式,會在使用 <code>new</code> 時候拋出錯誤。</p> -<pre class="brush: js notranslate">var Foo = () => {}; +<pre class="brush: js">var Foo = () => {}; var foo = new Foo(); // TypeError: Foo is not a constructor</pre> <h3 id="使用_prototype_屬性">使用 <code>prototype</code> 屬性</h3> <p>箭頭函式並沒有原型(<code>prototype</code>)屬性。</p> -<pre class="brush: js notranslate">var Foo = () => {}; +<pre class="brush: js">var Foo = () => {}; console.log(Foo.prototype); // undefined </pre> @@ -251,21 +251,21 @@ console.log(Foo.prototype); // undefined <p>在 concise body 裡面只需要輸入運算式,就會附上內建的回傳。在 block body 裡面就必須附上明確的 <code>return</code> 宣告。</p> -<pre class="brush: js notranslate"><code>var func = x => x * x; // concise 語法會內建 "return" +<pre class="brush: js"><code>var func = x => x * x; // concise 語法會內建 "return" var func = (x, y) => { return x + y; }; // block body 需要明確的 "return"</code></pre> <h2 id="回傳物件字面值">回傳物件字面值</h2> <p>請注意只使用 <code>params => {object:literal}</code> 並不會按照期望般回傳物件字面值(object literal)。</p> -<pre class="brush: js notranslate"><code>var func = () => { foo: 1 }; // Calling func() returns undefined! +<pre class="brush: js"><code>var func = () => { foo: 1 }; // Calling func() returns undefined! var func = () => { foo: function() {} }; // SyntaxError: Unexpected token (</code></pre> <p>因為在大括弧(<code>{}</code>)裡面的文字會被解析為有序宣告(例如 <code>foo</code> 會被當作標記(label)、而不是物件的 key )</p> <p>要記得把物件字面值包在圓括弧內。</p> -<pre class="brush: js notranslate"><code>var func = () => ({foo: 1}); +<pre class="brush: js"><code>var func = () => ({foo: 1}); var func = () => ({ foo: function() {} }); </code> </pre> @@ -273,14 +273,14 @@ var func = () => ({ foo: function() {} }); </code> <p>箭頭函式不可以在參數及箭頭間包含換行。</p> -<pre class="brush: js notranslate"><code>var func = () +<pre class="brush: js"><code>var func = () => 1; // SyntaxError: expected expression, got '=>'</code></pre> <h2 id="Parsing_order">Parsing order</h2> <p>箭頭函式的箭頭儘管不是操作符,但藉著<a href="https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">運算子優先等級</a>,箭頭函式有著和普通函式不相同的特殊解析規則。</p> -<pre class="brush: js notranslate"><code>let callback; +<pre class="brush: js"><code>let callback; callback = callback || function() {}; // ok callback = callback || () => {}; // SyntaxError: invalid arrow-function arguments @@ -288,7 +288,7 @@ callback = callback || (() => {}); // ok</code></pre> <h2 id="更多範例">更多範例</h2> -<pre class="brush: js notranslate">// 回傳 undefined 的箭頭函式 +<pre class="brush: js">// 回傳 undefined 的箭頭函式 let empty = () => {}; (() => "foobar")() // 回傳 "foobar" diff --git a/files/zh-tw/web/javascript/reference/functions/default_parameters/index.html b/files/zh-tw/web/javascript/reference/functions/default_parameters/index.html index 6faacba9a3..e7a796f4d1 100644 --- a/files/zh-tw/web/javascript/reference/functions/default_parameters/index.html +++ b/files/zh-tw/web/javascript/reference/functions/default_parameters/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Functions/Default_parameters <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">function [<em>name</em>]([<em>param1</em>[ = defaultValue1 ][, ..., <em>paramN</em>[ = defaultValueN ]]]) { +<pre class="syntaxbox">function [<em>name</em>]([<em>param1</em>[ = defaultValue1 ][, ..., <em>paramN</em>[ = defaultValueN ]]]) { <em>要執行的程序</em> } </pre> @@ -20,7 +20,7 @@ translation_of: Web/JavaScript/Reference/Functions/Default_parameters <p>以往設定預設值有個普遍方法:在函式的內容裡檢查傳入參數是否為 <code>undefined ,如果是的話,爲他指定一個值。如下列範例,若函式被呼叫時,並沒有提供 b 的值,它的值就會是 undefined,在計算 a*b 時,以及呼叫 multiply 時,就會回傳 NaN。然而這在範例的第二行被阻止了:</code>:</p> -<pre class="brush: js notranslate">function multiply(a, b) { +<pre class="brush: js">function multiply(a, b) { b = (typeof b !== 'undefined') ? b : 1; return a * b; } @@ -32,7 +32,7 @@ multiply(5); // 5 <p>有了 ES2015 的預設參數,再也不用於函式進行檢查了,現在只要簡單的在函式的起始處為 b 指定 1 的值:</p> -<pre class="brush: js notranslate">function multiply(a, b = 1) { +<pre class="brush: js">function multiply(a, b = 1) { return a * b; } @@ -47,7 +47,7 @@ multiply(5); // 5 <p>這邊第二段函式呼叫中,僅管第二個傳入參數在呼叫時明確地指定為undefined(雖不是null),其顏色參數的值是預設值(rosybrown)。</p> -<pre class="brush: js notranslate">function setBackgroundColor(element, color = 'rosybrown') { +<pre class="brush: js">function setBackgroundColor(element, color = 'rosybrown') { element.style.backgroundColor = color; } @@ -60,7 +60,7 @@ setBackgroundColor(someDiv, 'blue'); // color set to 'blue' <p>跟Python等語言不同的地方是,先前預設的代數值會拿來進行函式內的程序,也因此在函式呼叫的時候,會建立新物件。</p> -<pre class="brush: js notranslate">function append(value, array = []) { +<pre class="brush: js">function append(value, array = []) { array.push(value); return array; } @@ -71,7 +71,7 @@ append(2); //[2], 而非 [1, 2] <p>諸如此類的做法,也適用在函式和變量。</p> -<pre class="brush: js notranslate">function callSomething(thing = something()) { +<pre class="brush: js">function callSomething(thing = something()) { return thing; } @@ -85,7 +85,7 @@ callSomething(); //sth</pre> <p>先前有碰到的參數,後來的即可使用。</p> -<pre class="brush: js notranslate">function singularAutoPlural(singular, plural = singular + '們', +<pre class="brush: js">function singularAutoPlural(singular, plural = singular + '們', rallyingCry = plural + ',進攻啊!!!') { return [singular, plural, rallyingCry]; } @@ -103,7 +103,7 @@ singularAutoPlural('鹿兒', '鹿兒們', '鹿兒們平心靜氣的 \ <p>This functionality is approximated in a straight forward fashion and demonstrates how many edge cases are handled.</p> -<pre class="brush: js notranslate">function go() { +<pre class="brush: js">function go() { return ':P'; } @@ -145,7 +145,7 @@ withoutDefaults.call({value: '=^_^='}); <p>Introduced in Gecko 33 {{geckoRelease(33)}}. Functions declared in the function body cannot be referred inside default parameters and throw a {{jsxref("ReferenceError")}} (currently a {{jsxref("TypeError")}} in SpiderMonkey, see {{bug(1022967)}}). Default parameters are always executed first, function declarations inside the function body evaluate afterwards.</p> -<pre class="brush: js notranslate">// 行不通的! 最後會丟出 ReferenceError。 +<pre class="brush: js">// 行不通的! 最後會丟出 ReferenceError。 function f(a = go()) { function go() { return ':P'; } } @@ -155,7 +155,7 @@ function f(a = go()) { <p>Prior to Gecko 26 {{geckoRelease(26)}}, the following code resulted in a {{jsxref("SyntaxError")}}. This has been fixed in {{bug(777060)}} and works as expected in later versions. Parameters are still set left-to-right, overwriting default parameters even if there are later parameters without defaults.</p> -<pre class="brush: js notranslate">function f(x = 1, y) { +<pre class="brush: js">function f(x = 1, y) { return [x, y]; } @@ -167,7 +167,7 @@ f(2); // [2, undefined] <p>You can use default value assignment with the <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destructuring assignment</a> notation:</p> -<pre class="brush: js notranslate">function f([x, y] = [1, 2], {z: z} = {z: 3}) { +<pre class="brush: js">function f([x, y] = [1, 2], {z: z} = {z: 3}) { return x + y + z; } diff --git a/files/zh-tw/web/javascript/reference/global_objects/array/length/index.html b/files/zh-tw/web/javascript/reference/global_objects/array/length/index.html index 453564d528..1b6497b07a 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/array/length/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/array/length/index.html @@ -7,7 +7,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/length <p><code><strong>length</strong></code> 為<code>Array物件的屬性</code> ,可供設定或回傳該陣列實體中包含的元素個數。其值必為一大於零、32位元、且恆大於該陣列最大索引數的正整數。</p> -<pre class="brush: js notranslate">var items = ['shoes', 'shirts', 'socks', 'sweaters']; +<pre class="brush: js">var items = ['shoes', 'shirts', 'socks', 'sweaters']; items.length; // returns 4</pre> @@ -16,7 +16,7 @@ items.length; <p><code>length</code> 屬性的值必為一正整數,其值必介於 0 ~ 2<sup>32</sup> (不包含)之間.</p> -<pre class="brush: js notranslate">var namelistA = new Array(4294967296); //2<sup>32</sup><sup> = </sup>4294967296 +<pre class="brush: js">var namelistA = new Array(4294967296); //2<sup>32</sup><sup> = </sup>4294967296 var namelistC = new Array(-100) //負數 console.log(namelistA.length); //RangeError: Invalid array length @@ -32,7 +32,7 @@ console.log(namelistB.length); <p>你可以透過改變 <code>length</code> 屬性來改變陣列的長度。當你透過 <code>length</code> 屬性來增加陣列的長度時,陣列中實際的元素也會隨之增加。舉例來說,當你將 array.length 由 2 增加為3,則改動後該陣列即擁有3個元素,該新增的元素則會是一個不可迭代(non-iterable)的空槽(empty slot)。</p> -<pre class="notranslate">const arr = [1, 2]; +<pre>const arr = [1, 2]; console.log(arr); // [ 1, 2 ] @@ -62,7 +62,7 @@ arr.forEach(element => console.log(element)); // 空元素無法被迭代 <p>以下範例中, 陣列 <code>numbers</code> 透過 <code>length</code> 屬性進行迭代操作,並將其內容值加倍。</p> -<pre class="brush: js notranslate">var numbers = [1, 2, 3, 4, 5]; +<pre class="brush: js">var numbers = [1, 2, 3, 4, 5]; var length = numbers.length; for (var i = 0; i < length; i++) { numbers[i] *= 2; @@ -74,7 +74,7 @@ for (var i = 0; i < length; i++) { <p>以下範例中, 陣列 <code>numbers</code> 的長度若大於 3,則將其長度縮減至 3。</p> -<pre class="brush: js notranslate">var numbers = [1, 2, 3, 4, 5]; +<pre class="brush: js">var numbers = [1, 2, 3, 4, 5]; if (numbers.length > 3) { numbers.length = 3; diff --git a/files/zh-tw/web/javascript/reference/global_objects/array/slice/index.html b/files/zh-tw/web/javascript/reference/global_objects/array/slice/index.html index e9cb1fb02c..7079acee9d 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/array/slice/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/array/slice/index.html @@ -19,7 +19,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate"><var>arr</var>.slice(<em>[</em><var>begin[</var>, <var>end]]</var>) +<pre class="syntaxbox"><var>arr</var>.slice(<em>[</em><var>begin[</var>, <var>end]]</var>) </pre> <h3 id="參數">參數</h3> @@ -56,7 +56,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice <h3 id="Return_a_portion_of_an_existing_array">Return a portion of an existing array</h3> -<pre class="brush: js notranslate">var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']; +<pre class="brush: js">var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']; var citrus = fruits.slice(1, 3); // fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'] @@ -67,7 +67,7 @@ var citrus = fruits.slice(1, 3); <p>In the following example, <code>slice</code> creates a new array, <code>newCar</code>, from <code>myCar</code>. Both include a reference to the object <code>myHonda</code>. When the color of <code>myHonda</code> is changed to purple, both arrays reflect the change.</p> -<pre class="brush: js notranslate">// Using slice, create newCar from myCar. +<pre class="brush: js">// Using slice, create newCar from myCar. var myHonda = { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }; var myCar = [myHonda, 2, 'cherry condition', 'purchased 1997']; var newCar = myCar.slice(0, 2); @@ -90,7 +90,7 @@ console.log('newCar[0].color = ' + newCar[0].color); <p>This script writes:</p> -<pre class="brush: js notranslate">myCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2, +<pre class="brush: js">myCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2, 'cherry condition', 'purchased 1997'] newCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2] myCar[0].color = red @@ -104,7 +104,7 @@ newCar[0].color = purple <p><code>slice</code> method can also be called to convert Array-like objects / collections to a new Array. You just bind the method to the object. The {{jsxref("Functions/arguments", "arguments")}} inside a function is an example of an 'array-like object'.</p> -<pre class="brush: js notranslate">function list() { +<pre class="brush: js">function list() { return Array.prototype.slice.call(arguments); } @@ -113,7 +113,7 @@ var list1 = list(1, 2, 3); // [1, 2, 3] <p>Binding can be done with the .<code>call</code> function of {{jsxref("Function.prototype")}} and it can also be reduced using <code>[].slice.call(arguments)</code> instead of <code>Array.prototype.slice.call</code>. Anyway, it can be simplified using {{jsxref("Function.prototype.bind", "bind")}}.</p> -<pre class="brush: js notranslate">var unboundSlice = Array.prototype.slice; +<pre class="brush: js">var unboundSlice = Array.prototype.slice; var slice = Function.prototype.call.bind(unboundSlice); function list() { @@ -127,7 +127,7 @@ var list1 = list(1, 2, 3); // [1, 2, 3] <p>Although host objects (such as DOM objects) are not required by spec to follow the Mozilla behavior when converted by <code>Array.prototype.slice</code> and IE < 9 does not do so, versions of IE starting with version 9 do allow this. “Shimming” it can allow reliable cross-browser behavior. As long as other modern browsers continue to support this ability, as currently do IE, Mozilla, Chrome, Safari, and Opera, developers reading (DOM-supporting) slice code relying on this shim will not be misled by the semantics; they can safely rely on the semantics to provide the now apparently <em>de facto</em> standard behavior. (The shim also fixes IE to work with the second argument of <code>slice()</code> being an explicit {{jsxref("null")}}/{{jsxref("undefined")}} value as earlier versions of IE also did not allow but all modern browsers, including IE >= 9, now do.)</p> -<pre class="brush: js notranslate">/** +<pre class="brush: js">/** * Shim for "fixing" IE's lack of support (IE < 9) for applying slice * on host objects like NamedNodeMap, NodeList, and HTMLCollection * (technically, since host objects have been implementation-dependent, diff --git a/files/zh-tw/web/javascript/reference/global_objects/date/getday/index.html b/files/zh-tw/web/javascript/reference/global_objects/date/getday/index.html index fb55827283..18d250f6fd 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/date/getday/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/date/getday/index.html @@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDay <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate"><code><var>dateObj</var>.getDay()</code></pre> +<pre class="syntaxbox"><code><var>dateObj</var>.getDay()</code></pre> <h3 id="返回值">返回值</h3> @@ -25,7 +25,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDay <p>下面第二行表示根據日期對象'Xmas95'的值,把1賦值給'weekday'。則1995年12月25日是星期一。</p> -<pre class="brush: js notranslate">var Xmas95 = new Date('December 25, 1995 23:15:30'); +<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30'); var weekday = Xmas95.getDay(); console.log(weekday); // 1 @@ -34,7 +34,7 @@ console.log(weekday); // 1 <div class="blockIndicator note"> <p><strong>Note:</strong> 如果需要,可以使用{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}加上<code>options</code>參數來獲取星期幾全名。使使用此方法能輕鬆做出各種國際語言:</p> -<pre class="brush: js notranslate">var options = { weekday: 'long'}; +<pre class="brush: js">var options = { weekday: 'long'}; console.log(new Intl.DateTimeFormat('en-US', options).format(Xmas95)); // Monday console.log(new Intl.DateTimeFormat('de-DE', options).format(Xmas95)); diff --git a/files/zh-tw/web/javascript/reference/global_objects/math/pow/index.html b/files/zh-tw/web/javascript/reference/global_objects/math/pow/index.html index 2bf7ffdc68..7119ba5862 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/math/pow/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/math/pow/index.html @@ -11,7 +11,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/pow <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate"><code>Math.pow(<var>base</var>, <var>exponent</var>)</code></pre> +<pre class="syntaxbox"><code>Math.pow(<var>base</var>, <var>exponent</var>)</code></pre> <h3 id="參數">參數</h3> @@ -36,7 +36,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/pow <h3 id="使用_Math.pow">使用 <code>Math.pow()</code></h3> -<pre class="brush: js notranslate">// simple +<pre class="brush: js">// simple Math.pow(7, 2); // 49 Math.pow(7, 3); // 343 Math.pow(2, 10); // 1024 diff --git a/files/zh-tw/web/javascript/reference/global_objects/math/random/index.html b/files/zh-tw/web/javascript/reference/global_objects/math/random/index.html index 1613c18777..896d4ab948 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/math/random/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/math/random/index.html @@ -18,7 +18,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/random <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">Math.random()</pre> +<pre class="syntaxbox">Math.random()</pre> <h3 id="回傳值_Return_value">回傳值 Return value</h3> @@ -30,7 +30,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/random <h3 id="Getting_a_random_number_between_0_inclusive_and_1_exclusive">Getting a random number between 0 (inclusive) and 1 (exclusive)</h3> -<pre class="brush: js notranslate">function getRandom() { +<pre class="brush: js">function getRandom() { return Math.random(); } </pre> @@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/random <p>This example returns a random number between the specified values. The returned value is no lower than (and may possibly equal) <code>min</code>, and is less than (and not equal) <code>max</code>.</p> -<pre class="brush: js notranslate">function getRandomArbitrary(min, max) { +<pre class="brush: js">function getRandomArbitrary(min, max) { return Math.random() * (max - min) + min; } </pre> @@ -48,7 +48,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/random <p>This example returns a random <em>integer</em> between the specified values. The value is no lower than <code>min</code> (or the next integer greater than <code>min</code> if <code>min</code> isn't an integer), and is less than (but not equal to) <code>max</code>.</p> -<pre class="brush: js notranslate">function getRandomInt(min, max) { +<pre class="brush: js">function getRandomInt(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (max - min) + min); //The maximum is exclusive and the minimum is inclusive @@ -63,7 +63,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Math/random <p>While the <code>getRandomInt()</code> function above is inclusive at the minimum, it's exclusive at the maximum. What if you need the results to be inclusive at both the minimum and the maximum? The <code>getRandomIntInclusive()</code> function below accomplishes that.</p> -<pre class="brush: js notranslate">function getRandomIntInclusive(min, max) { +<pre class="brush: js">function getRandomIntInclusive(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (max - min + 1) + min); //The maximum is inclusive and the minimum is inclusive diff --git a/files/zh-tw/web/javascript/reference/global_objects/number/tofixed/index.html b/files/zh-tw/web/javascript/reference/global_objects/number/tofixed/index.html index addec4288b..99a2ef5dc6 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/number/tofixed/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/number/tofixed/index.html @@ -18,7 +18,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate"><code><var>numObj</var>.toFixed([<var>digits</var>])</code></pre> +<pre class="syntaxbox"><code><var>numObj</var>.toFixed([<var>digits</var>])</code></pre> <h3 id="參數">參數</h3> @@ -48,7 +48,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed <h3 id="Using_toFixed">Using <code>toFixed</code></h3> -<pre class="brush: js notranslate">var numObj = 12345.6789; +<pre class="brush: js">var numObj = 12345.6789; numObj.toFixed(); // Returns '12346': note rounding, no fractional part numObj.toFixed(1); // Returns '12345.7': note rounding diff --git a/files/zh-tw/web/javascript/reference/global_objects/object/assign/index.html b/files/zh-tw/web/javascript/reference/global_objects/object/assign/index.html index f4dfca5af7..65330a6196 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/object/assign/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/object/assign/index.html @@ -9,7 +9,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">Object.assign(<var>target</var>, ...<var>sources</var>)</pre> +<pre class="syntaxbox">Object.assign(<var>target</var>, ...<var>sources</var>)</pre> <h3 id="參數">參數</h3> @@ -40,7 +40,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign <h3 id="複製物件">複製物件</h3> -<pre class="brush: js notranslate">var obj = { a: 1 }; +<pre class="brush: js">var obj = { a: 1 }; var copy = Object.assign({}, obj); console.log(copy); // { a: 1 } </pre> @@ -49,7 +49,7 @@ console.log(copy); // { a: 1 } <p>深層複製(deep clone)需要使用其他的替代方案,因為 <code>Object.assign()</code> 僅複製屬性值。若來源物件的值參照到一個子物件,它只會複製該子物件的參照。</p> -<pre class="brush: js notranslate">function test() { +<pre class="brush: js">function test() { let a = { b: {c:4} , d: { e: {f:1}} } let g = Object.assign({},a) // 淺層 let h = JSON.parse(JSON.stringify(a)); // 深層 @@ -70,7 +70,7 @@ test(); <h3 id="合併物件">合併物件</h3> -<pre class="brush: js notranslate">var o1 = { a: 1 }; +<pre class="brush: js">var o1 = { a: 1 }; var o2 = { b: 2 }; var o3 = { c: 3 }; @@ -80,7 +80,7 @@ console.log(o1); // { a: 1, b: 2, c: 3 }, 目標物件本身也被改變。</pr <h3 id="有相同屬性時合併物件">有相同屬性時合併物件</h3> -<pre class="brush: js notranslate">var o1 = { a: 1, b: 1, c: 1 }; +<pre class="brush: js">var o1 = { a: 1, b: 1, c: 1 }; var o2 = { b: 2, c: 2 }; var o3 = { c: 3 }; @@ -91,7 +91,7 @@ console.log(obj); // { a: 1, b: 2, c: 3 },屬性c為o3.c的值,最後一個 <h3 id="複製_Symbol_型別的屬性">複製 Symbol 型別的屬性</h3> -<pre class="brush: js notranslate">var o1 = { a: 1 }; +<pre class="brush: js">var o1 = { a: 1 }; var o2 = { [Symbol('foo')]: 2 }; var obj = Object.assign({}, o1, o2); @@ -101,7 +101,7 @@ Object.getOwnPropertySymbols(obj); // [Symbol(foo)]非不在 <h3 id="在屬性鏈中的不可列舉屬性不會被複製">在屬性鏈中的不可列舉屬性不會被複製</h3> -<pre class="brush: js notranslate">var obj = Object.create({ foo: 1 }, { // foo 是 obj 的屬性鏈。 +<pre class="brush: js">var obj = Object.create({ foo: 1 }, { // foo 是 obj 的屬性鏈。 bar: { value: 2 // bar 是不可列舉的屬性,因為enumerable預設為false。 }, @@ -117,7 +117,7 @@ console.log(copy); // { baz: 3 } <h3 id="原始型別會被包成物件">原始型別會被包成物件</h3> -<pre class="brush: js notranslate">var v1 = 'abc'; +<pre class="brush: js">var v1 = 'abc'; var v2 = true; var v3 = 10; var v4 = Symbol('foo'); @@ -130,7 +130,7 @@ console.log(obj); // { "0": "a", "1": "b", "2": "c" } <h3 id="任何異常將會中斷正進行的複製程序">任何異常將會中斷正進行的複製程序</h3> -<pre class="brush: js notranslate">var target = Object.defineProperty({}, 'foo', { +<pre class="brush: js">var target = Object.defineProperty({}, 'foo', { value: 1, writable: false }); // target.foo 是 read-only (唯讀)屬性 @@ -148,7 +148,7 @@ console.log(target.baz); // undefined, 第三個來源物件也不會被複製 <h3 id="複製的存取程序">複製的存取程序</h3> -<pre class="brush: js notranslate">var obj = { +<pre class="brush: js">var obj = { foo: 1, get bar() { return 2; @@ -187,7 +187,7 @@ console.log(copy); <p>{{Glossary("Polyfill","polyfill")}} 不支援Symbol屬性,因為ES5沒有Symbol型別。</p> -<pre class="brush: js notranslate">if (typeof Object.assign != 'function') { +<pre class="brush: js">if (typeof Object.assign != 'function') { Object.assign = function (target, varArgs) { // .length of function is 2 'use strict'; if (target == null) { // TypeError if undefined or null diff --git a/files/zh-tw/web/javascript/reference/global_objects/object/index.html b/files/zh-tw/web/javascript/reference/global_objects/object/index.html index 3885c44a15..cf55c9b004 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/object/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/object/index.html @@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Object <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">// Object initialiser or literal +<pre class="syntaxbox">// Object initialiser or literal { [ <var>nameValuePair1</var>[, <var>nameValuePair2</var>[, ...<var>nameValuePairN</var>] ] ] } // Called as a constructor @@ -110,24 +110,24 @@ new Object([<var>value</var>])</pre> <p>下面例子儲存一個空物件至變數o</p> -<pre class="brush: js notranslate">var o = new Object(); +<pre class="brush: js">var o = new Object(); </pre> -<pre class="brush: js notranslate">var o = new Object(undefined); +<pre class="brush: js">var o = new Object(undefined); </pre> -<pre class="brush: js notranslate">var o = new Object(null); +<pre class="brush: js">var o = new Object(null); </pre> <h3 id="Using_Object_to_create_Boolean_objects">Using <code>Object</code> to create <code>Boolean</code> objects</h3> <p>下面例子儲存 {{jsxref("Boolean")}} 物件在 <code>o</code>:</p> -<pre class="brush: js notranslate">// equivalent to o = new Boolean(true); +<pre class="brush: js">// equivalent to o = new Boolean(true); var o = new Object(true); </pre> -<pre class="brush: js notranslate">// equivalent to o = new Boolean(false); +<pre class="brush: js">// equivalent to o = new Boolean(false); var o = new Object(Boolean()); </pre> diff --git a/files/zh-tw/web/javascript/reference/global_objects/proxy/index.html b/files/zh-tw/web/javascript/reference/global_objects/proxy/index.html index 54a71be888..f41b0a6caa 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/proxy/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/proxy/index.html @@ -27,7 +27,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Proxy <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">var p = new Proxy(target, handler); +<pre class="syntaxbox">var p = new Proxy(target, handler); </pre> <h3 id="參數">參數</h3> @@ -58,7 +58,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Proxy <p>In this simple example the number <code>37</code> gets returned as the default value when the property name is not in the object. It is using the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/get"><code>get</code></a> handler.</p> -<pre class="brush: js notranslate">var handler = { +<pre class="brush: js">var handler = { get: function(target, name) { return name in target ? target[name] : @@ -78,7 +78,7 @@ console.log('c' in p, p.c); // false, 37 <p>In this example, we are using a native JavaScript object to which our proxy will forward all operations that are applied to it.</p> -<pre class="brush: js notranslate">var target = {}; +<pre class="brush: js">var target = {}; var p = new Proxy(target, {}); p.a = 37; // operation forwarded to the target @@ -90,7 +90,7 @@ console.log(target.a); // 37. The operation has been properly forwarded <p>With a <code>Proxy</code>, you can easily validate the passed value for an object. This example uses the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set"><code>set</code></a> handler.</p> -<pre class="brush: js notranslate">let validator = { +<pre class="brush: js">let validator = { set: function(obj, prop, value) { if (prop === 'age') { if (!Number.isInteger(value)) { @@ -120,7 +120,7 @@ person.age = 300; // Throws an exception</pre> <p>A function proxy could easily extend a constructor with a new constructor. This example uses the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/construct"><code>construct</code></a> and <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/apply"><code>apply</code></a> handlers.</p> -<pre class="brush: js notranslate">function extend(sup, base) { +<pre class="brush: js">function extend(sup, base) { var descriptor = Object.getOwnPropertyDescriptor( base.prototype, 'constructor' ); @@ -161,7 +161,7 @@ console.log(Peter.age); // 13</pre> <p>Sometimes you want to toggle the attribute or class name of two different elements. Here's how using the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set"><code>set</code></a> handler.</p> -<pre class="brush: js notranslate">let view = new Proxy({ +<pre class="brush: js">let view = new Proxy({ selected: null }, { @@ -196,7 +196,7 @@ console.log(i2.getAttribute('aria-selected')); // 'true'</pre> <p>The <code>products</code> proxy object evaluates the passed value and convert it to an array if needed. The object also supports an extra property called <code>latestBrowser</code> both as a getter and a setter.</p> -<pre class="brush: js notranslate">let products = new Proxy({ +<pre class="brush: js">let products = new Proxy({ browsers: ['Internet Explorer', 'Netscape'] }, { @@ -241,7 +241,7 @@ console.log(products.latestBrowser); // 'Chrome'</pre> <p>This proxy extends an array with some utility features. As you see, you can flexibly "define" properties without using <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties"><code>Object.defineProperties</code></a>. This example can be adapted to find a table row by its cell. In that case, the target will be <a href="/en-US/docs/DOM/table.rows"><code>table.rows</code></a>.</p> -<pre class="brush: js notranslate">let products = new Proxy([ +<pre class="brush: js">let products = new Proxy([ { name: 'Firefox', type: 'browser' }, { name: 'SeaMonkey', type: 'browser' }, { name: 'Thunderbird', type: 'mailer' } @@ -302,7 +302,7 @@ console.log(products.number); // 3 <p>Now in order to create a complete sample <code>traps</code> list, for didactic purposes, we will try to proxify a <em>non native</em> object that is particularly suited to this type of operation: the <code>docCookies</code> global object created by <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie/Simple_document.cookie_framework" title="https://developer.mozilla.org/en-US/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support">the "little framework" published on the <code>document.cookie</code> page</a>.</p> -<pre class="brush: js notranslate">/* +<pre class="brush: js">/* var docCookies = ... get the "docCookies" object here: https://developer.mozilla.org/en-US/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support */ diff --git a/files/zh-tw/web/javascript/reference/global_objects/set/index.html b/files/zh-tw/web/javascript/reference/global_objects/set/index.html index 2b3f80fdd1..7875873120 100644 --- a/files/zh-tw/web/javascript/reference/global_objects/set/index.html +++ b/files/zh-tw/web/javascript/reference/global_objects/set/index.html @@ -19,7 +19,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">new Set([<em>iterable</em>]);</pre> +<pre class="syntaxbox">new Set([<em>iterable</em>]);</pre> <h3 id="參數">參數</h3> @@ -67,7 +67,7 @@ translation_of: Web/JavaScript/Reference/Global_Objects/Set <h3 id="使用_Set_物件">使用 <code>Set</code> 物件</h3> -<pre class="brush: js notranslate">var mySet = new Set(); +<pre class="brush: js">var mySet = new Set(); mySet.add(1); // Set [ 1 ] mySet.add(5); // Set [ 1, 5 ] @@ -95,7 +95,7 @@ console.log(mySet);// Set [ 1, "some text", Object {a: 1, b: 2}, Object {a: 1, b <h3 id="迭代_Sets">迭代 Sets</h3> -<pre class="brush: js notranslate">// iterate over items in set +<pre class="brush: js">// iterate over items in set // logs the items in the order: 1, "some text", {"a": 1, "b": 2}, {"a": 1, "b": 2} for (let item of mySet) console.log(item); @@ -139,7 +139,7 @@ mySet.forEach(function(value) { <h3 id="實作基本的_set_操作">實作基本的 set 操作</h3> -<pre class="brush: js notranslate">Set.prototype.isSuperset = function(subset) { +<pre class="brush: js">Set.prototype.isSuperset = function(subset) { for (var elem of subset) { if (!this.has(elem)) { return false; @@ -188,7 +188,7 @@ setA.difference(setC); // => Set [1, 2] <h3 id="與_Array_物件關聯">與 <code>Array</code> 物件關聯</h3> -<pre class="brush: js notranslate">var myArray = ['value1', 'value2', 'value3']; +<pre class="brush: js">var myArray = ['value1', 'value2', 'value3']; // Use the regular Set constructor to transform an Array into a Set var mySet = new Set(myArray); @@ -200,7 +200,7 @@ console.log([...mySet]); // Will show you exactly the same Array as myArray</pre <h3 id="與_Strings_關聯">與 <code>Strings</code> 關聯</h3> -<pre class="brush: js notranslate">var text = 'India'; +<pre class="brush: js">var text = 'India'; var mySet = new Set(text); // Set ['I', 'n', 'd', 'i', 'a'] mySet.size; // 5 diff --git a/files/zh-tw/web/javascript/reference/operators/conditional_operator/index.html b/files/zh-tw/web/javascript/reference/operators/conditional_operator/index.html index cd0ccfa160..cd7f851374 100644 --- a/files/zh-tw/web/javascript/reference/operators/conditional_operator/index.html +++ b/files/zh-tw/web/javascript/reference/operators/conditional_operator/index.html @@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate"><var>condition</var> ? <var>exprIfTrue</var> : <var>exprIfFalse</var></pre> +<pre class="syntaxbox"><var>condition</var> ? <var>exprIfTrue</var> : <var>exprIfFalse</var></pre> <h3 id="參數">參數</h3> @@ -32,14 +32,14 @@ translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator <p>一個簡單的範例:</p> -<pre class="brush: js notranslate">var age = 26; +<pre class="brush: js">var age = 26; var beverage = (age >= 21) ? "Beer" : "Juice"; console.log(beverage); // "Beer" </pre> <p>一個常用來處理 <code>null</code> 的用法 : </p> -<pre class="brush: js notranslate">function greeting(person) { +<pre class="brush: js">function greeting(person) { var name = person ? person.name : "stranger"; return "Howdy, " + name; } @@ -52,7 +52,7 @@ console.log(greeting(null)); // "Howdy, stranger" <p>條件 (三元) 運算子是右相依性的 (right-associative), 代表他可以以下面的方式鏈結 , 類似於 <code>if … else if … else if … else</code> 的鏈結方法 :</p> -<pre class="brush: js notranslate">function example(…) { +<pre class="brush: js">function example(…) { return condition1 ? value1 : condition2 ? value2 : condition3 ? value3 diff --git a/files/zh-tw/web/javascript/reference/operators/spread_syntax/index.html b/files/zh-tw/web/javascript/reference/operators/spread_syntax/index.html index fe6ea9a383..42793870c0 100644 --- a/files/zh-tw/web/javascript/reference/operators/spread_syntax/index.html +++ b/files/zh-tw/web/javascript/reference/operators/spread_syntax/index.html @@ -15,16 +15,16 @@ translation_of: Web/JavaScript/Reference/Operators/Spread_syntax <p>用在呼叫函式時:</p> -<pre class="syntaxbox notranslate"><var>myFunction</var>(...<var>iterableObj</var>); +<pre class="syntaxbox"><var>myFunction</var>(...<var>iterableObj</var>); </pre> <p>用在陣列或字串時:</p> -<pre class="syntaxbox notranslate">[...<var>iterableObj</var>, '4', 'five', 6];</pre> +<pre class="syntaxbox">[...<var>iterableObj</var>, '4', 'five', 6];</pre> <p>用在物件時(new in ECMAScript 2018):</p> -<pre class="syntaxbox notranslate">let <var>objClone</var> = { ...<var>obj</var> };</pre> +<pre class="syntaxbox">let <var>objClone</var> = { ...<var>obj</var> };</pre> <h2 id="Rest_syntax_parameters">Rest syntax (parameters)</h2> @@ -38,19 +38,19 @@ translation_of: Web/JavaScript/Reference/Operators/Spread_syntax <p>It is common to use {{jsxref("Function.prototype.apply()")}} in cases where you want to use the elements of an array as arguments to a function.</p> -<pre class="brush: js notranslate">function myFunction(x, y, z) { } +<pre class="brush: js">function myFunction(x, y, z) { } const args = [0, 1, 2]; myFunction.apply(null, args);</pre> <p>With spread syntax the above can be written as:</p> -<pre class="brush: js notranslate">function myFunction(x, y, z) { } +<pre class="brush: js">function myFunction(x, y, z) { } const args = [0, 1, 2]; myFunction(...args);</pre> <p>Any argument in the argument list can use spread syntax, and the spread syntax can be used multiple times.</p> -<pre class="brush: js notranslate">function myFunction(v, w, x, y, z) { } +<pre class="brush: js">function myFunction(v, w, x, y, z) { } const args = [0, 1]; myFunction(-1, ...args, 2, ...[3]);</pre> @@ -58,13 +58,13 @@ myFunction(-1, ...args, 2, ...[3]);</pre> <p>When calling a constructor with {{jsxref("Operators/new", "new")}} it's not possible to <strong>directly</strong> use an array and <code>apply()</code> (<code>apply()</code> does a <code>[[Call]]</code> and not a <code>[[Construct]]</code>). However, an array can be easily used with <code>new</code> thanks to spread syntax:</p> -<pre class="brush: js notranslate">const dateFields = [1970, 0, 1]; // 1 Jan 1970 +<pre class="brush: js">const dateFields = [1970, 0, 1]; // 1 Jan 1970 const d = new Date(...dateFields); </pre> <p>To use <code>new</code> with an array of parameters without spread syntax, you would have to do it <strong>indirectly</strong> through partial application:</p> -<pre class="brush: js notranslate">function applyAndNew(constructor, args) { +<pre class="brush: js">function applyAndNew(constructor, args) { function partial () { return constructor.apply(this, args); }; @@ -96,7 +96,7 @@ console.log(new myConstructorWithArguments); <p>Without spread syntax, to create a new array using an existing array as one part of it, the array literal syntax is no longer sufficient and imperative code must be used instead using a combination of {{jsxref("Array.prototype.push", "push()")}}, {{jsxref("Array.prototype.splice", "splice()")}}, {{jsxref("Array.prototype.concat", "concat()")}}, etc. With spread syntax this becomes much more succinct:</p> -<pre class="brush: js notranslate">const parts = ['shoulders', 'knees']; +<pre class="brush: js">const parts = ['shoulders', 'knees']; const lyrics = ['head', ...parts, 'and', 'toes']; // ["head", "shoulders", "knees", "and", "toes"] </pre> @@ -105,7 +105,7 @@ const lyrics = ['head', ...parts, 'and', 'toes']; <h4 id="Copy_an_array">Copy an array</h4> -<pre class="brush: js notranslate">const arr = [1, 2, 3]; +<pre class="brush: js">const arr = [1, 2, 3]; const arr2 = [...arr]; // like arr.slice() arr2.push(4); @@ -116,7 +116,7 @@ arr2.push(4); <div class="blockIndicator note"> <p><strong>Note:</strong> Spread syntax effectively goes one level deep while copying an array. Therefore, it may be unsuitable for copying multidimensional arrays, as the following example shows. (The same is true with {{jsxref("Object.assign()")}} and spread syntax.)</p> -<pre class="brush: js example-bad notranslate">const a = [[1], [2], [3]]; +<pre class="brush: js example-bad">const a = [[1], [2], [3]]; const b = [...a]; b.shift().shift(); @@ -132,7 +132,7 @@ a <p>{{jsxref("Array.prototype.concat()")}} is often used to concatenate an array to the end of an existing array. Without spread syntax, this is done as:</p> -<pre class="brush: js notranslate">const arr1 = [0, 1, 2]; +<pre class="brush: js">const arr1 = [0, 1, 2]; const arr2 = [3, 4, 5]; // Append all items from arr2 onto arr1 @@ -140,7 +140,7 @@ arr1 = arr1.concat(arr2);</pre> <p>With spread syntax this becomes:</p> -<pre class="brush: js notranslate">let arr1 = [0, 1, 2]; +<pre class="brush: js">let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1 = [...arr1, ...arr2]; @@ -150,7 +150,7 @@ arr1 = [...arr1, ...arr2]; <p>{{jsxref("Array.prototype.unshift()")}} is often used to insert an array of values at the start of an existing array. Without spread syntax, this is done as:</p> -<pre class="brush: js notranslate">const arr1 = [0, 1, 2]; +<pre class="brush: js">const arr1 = [0, 1, 2]; const arr2 = [3, 4, 5]; // Prepend all items from arr2 onto arr1 @@ -160,7 +160,7 @@ Array.prototype.unshift.apply(arr1, arr2) <p>With spread syntax, this becomes:</p> -<pre class="brush: js notranslate">let arr1 = [0, 1, 2]; +<pre class="brush: js">let arr1 = [0, 1, 2]; let arr2 = [3, 4, 5]; arr1 = [...arr2, ...arr1]; @@ -177,7 +177,7 @@ arr1 = [...arr2, ...arr1]; <p>Shallow-cloning (excluding prototype) or merging of objects is now possible using a shorter syntax than {{jsxref("Object.assign()")}}.</p> -<pre class="brush: js notranslate">const obj1 = { foo: 'bar', x: 42 }; +<pre class="brush: js">const obj1 = { foo: 'bar', x: 42 }; const obj2 = { foo: 'baz', y: 13 }; const clonedObj = { ...obj1 }; @@ -190,7 +190,7 @@ const mergedObj = { ...obj1, ...obj2 }; <p>Note that you cannot replace or mimic the {{jsxref("Object.assign()")}} function:</p> -<pre class="brush: js notranslate">let obj1 = { foo: 'bar', x: 42 }; +<pre class="brush: js">let obj1 = { foo: 'bar', x: 42 }; let obj2 = { foo: 'baz', y: 13 }; const merge = ( ...objects ) => ( { ...objects } ); @@ -208,7 +208,7 @@ let mergedObj2 = merge ({}, obj1, obj2); <p>Spread syntax (other than in the case of spread properties) can be applied only to <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator">iterable</a> objects:</p> -<pre class="brush: js notranslate">const obj = {'key1': 'value1'}; +<pre class="brush: js">const obj = {'key1': 'value1'}; const array = [...obj]; // TypeError: obj is not iterable </pre> diff --git a/files/zh-tw/web/javascript/reference/statements/if...else/index.html b/files/zh-tw/web/javascript/reference/statements/if...else/index.html index a9317aa8a6..9224af1894 100644 --- a/files/zh-tw/web/javascript/reference/statements/if...else/index.html +++ b/files/zh-tw/web/javascript/reference/statements/if...else/index.html @@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Statements/if...else <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">if (<em>條件式</em>) +<pre class="syntaxbox">if (<em>條件式</em>) <em>statement1</em> [else <em>statement2</em>] @@ -39,7 +39,7 @@ translation_of: Web/JavaScript/Reference/Statements/if...else <p>多重的 <code>if...else</code> 陳述式可以使用 <code>else if</code> 子句來建立一個巢狀結構的句子。要記住,在JavaScript中沒有 <code>elseif</code> (一個單字) 的語法可以用。</p> -<pre class="eval notranslate">if (<em>condition1</em>) +<pre class="eval">if (<em>condition1</em>) <em>statement1</em> else if (<em>condition2</em>) <em>statement2</em> @@ -52,7 +52,7 @@ else <p>將巢狀結構適當的排版後,我們能更了解其背後運作的邏輯:</p> -<pre class="eval notranslate">if (<em>condition1</em>) +<pre class="eval">if (<em>condition1</em>) <em>statement1</em> else if (<em>condition2</em>) @@ -64,7 +64,7 @@ else <p>如果在一個條件式中有多個陳述要執行,可以使用區塊陳述式(<code>{ ... }</code>) 把所有陳述包在一起。 通常來說,無論如何都使用區塊陳述式是個很好的習慣,尤其是當你使用巢狀結構的 <code>if</code> 陳述式時,這會讓人更容易理解你的程式碼。</p> -<pre class="eval notranslate">if (<em>condition</em>) { +<pre class="eval">if (<em>condition</em>) { <em>statements1</em> } else { <em>statements2</em> @@ -73,7 +73,7 @@ else <p>不要被<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean" title="en/JavaScript/Reference/Global_Objects/Boolean">Boolean</a>物件中,布林值的 <code>true</code> 和 <code>false</code> 給混淆了。任何值只要不是 <code>false</code>、 <code>undefined</code>、 <code>null</code>、 <code>0</code>、 <code>NaN</code>,或者空字串 (<code>""</code>),並且任何物件,包括其值是 <code>false</code>的布林物件 ,仍然會被條件陳述式視為條件成立。舉例而言:</p> -<pre class="brush: js notranslate">var b = new Boolean(false); +<pre class="brush: js">var b = new Boolean(false); if (b) // this condition is truthy </pre> @@ -81,7 +81,7 @@ if (b) // this condition is truthy <h3 id="使用_if...else">使用 <code>if...else</code></h3> -<pre class="brush: js notranslate">if (cipher_char === from_char) { +<pre class="brush: js">if (cipher_char === from_char) { result = result + to_char; x++; } else { @@ -93,7 +93,7 @@ if (b) // this condition is truthy <p>要記得JavaScript沒有 <code>elseif</code> 可以使用。不過,你可以使用 <code>else</code> 和 <code>if</code>中間夾著空白的語法:</p> -<pre class="brush: js notranslate">if (x > 5) { +<pre class="brush: js">if (x > 5) { /* do the right thing */ } else if (x > 50) { /* do the right thing */ @@ -105,14 +105,14 @@ if (b) // this condition is truthy <p>建議不要在條件表達式中直接對物件賦值,因為這會使人在瀏覽程式碼時很容易將賦值( assignment )與相等( equality )混淆。舉例而言,不要使用以下寫法:</p> -<pre class="brush: js example-bad notranslate">if (x = y) { +<pre class="brush: js example-bad">if (x = y) { /* do the right thing */ } </pre> <p>如果你必須在條件表達式中使用賦值,最好ˇ的作法是以額外的括號包住賦值語句,如下所示:</p> -<pre class="brush: js example-good notranslate">if ((x = y)) { +<pre class="brush: js example-good">if ((x = y)) { /* do the right thing */ } </pre> diff --git a/files/zh-tw/web/javascript/reference/statements/let/index.html b/files/zh-tw/web/javascript/reference/statements/let/index.html index 0cdc8806be..f3170bb603 100644 --- a/files/zh-tw/web/javascript/reference/statements/let/index.html +++ b/files/zh-tw/web/javascript/reference/statements/let/index.html @@ -13,7 +13,7 @@ translation_of: Web/JavaScript/Reference/Statements/let <h2 id="語法">語法</h2> -<pre class="syntaxbox notranslate">let var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]];</pre> +<pre class="syntaxbox">let var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]];</pre> <h3 id="參數">參數</h3> @@ -32,7 +32,7 @@ translation_of: Web/JavaScript/Reference/Statements/let <p>宣告 <code>let</code> 的作用範圍是它們被定義的區塊,以及該區塊包含的子區塊。這樣看起來功能跟 <strong><code>var</code></strong> 很相似。主要不同的地方在於 <strong><code>var</code></strong> 作用範圍是「整個」function:</p> -<pre class="brush:js notranslate">function varTest() { +<pre class="brush:js">function varTest() { var x = 1; { var x = 2; // 這裡的 x 與 function 區塊內部的 x 是一樣的,因此會影響 function 區塊內所有的 x @@ -52,7 +52,7 @@ function letTest() { <p>在上列例子裡的最前行 <code>let</code> 和 <code>var</code> 不同,<code>let</code> 並不會在全域物件中建立變數。舉例來說:</p> -<pre class="brush:js notranslate">var x = 'global'; +<pre class="brush:js">var x = 'global'; let y = 'global'; console.log(this.x); // "global" console.log(this.y); // undefined @@ -62,7 +62,7 @@ console.log(this.y); // undefined <p>In dealing with <a href="/en-US/docs/Glossary/Constructor">constructors</a> it is possible to use the <strong><code>let</code></strong> bindings to share one or more private members without using <a href="/en-US/docs/Web/JavaScript/Closures">closures</a>:</p> -<pre class="brush:js notranslate">var Thing; +<pre class="brush:js">var Thing; { let privateScope = new WeakMap(); @@ -104,21 +104,21 @@ thing.showPrivate(); <p>Redeclaring the same variable within the same function or block scope raises a {{jsxref("SyntaxError")}}.</p> -<pre class="brush: js example-bad notranslate">if (x) { +<pre class="brush: js example-bad">if (x) { let foo; let foo; // SyntaxError thrown. }</pre> <p>In ECMAScript 2015, <strong><code>let</code></strong> bindings are not subject to <strong>Variable Hoisting</strong>, which means that <strong><code>let</code></strong> declarations do not move to the top of the current execution context. Referencing the variable in the block before the initialization results in a <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/ReferenceError">ReferenceError</a></code> (contrary to a variable declared with <a href="/en-US/docs/Web/JavaScript/Reference/Statements/var#var_hoisting">var</a>, which will just have the undefined value). The variable is in a "temporal dead zone" from the start of the block until the initialization is processed.</p> -<pre class="brush: js notranslate">function do_something() { +<pre class="brush: js">function do_something() { console.log(foo); // ReferenceError let foo = 2; }</pre> <p>你可能會在 <a href="https://developer.mozilla.org/zh-TW/docs/JavaScript/Reference/Statements/switch" title="switch"><code>switch</code></a> 中遇到錯誤,因為所有的 <code>case</code> 都屬於同樣的區塊中。</p> -<pre class="brush: js notranslate">switch (x) { +<pre class="brush: js">switch (x) { case 0: let foo; break; @@ -132,7 +132,7 @@ thing.showPrivate(); <p>You can use the <code>let</code> keyword to bind variables locally in the scope of <code>for</code> loops. This is different from the var keyword in the head of a for loop, which makes the variables visible in the whole function containing the loop.</p> -<pre class="brush:js notranslate">var i=0; +<pre class="brush:js">var i=0; for ( let i=i ; i < 10 ; i++ ) { console.log(i); } @@ -140,7 +140,7 @@ for ( let i=i ; i < 10 ; i++ ) { <p>However, it's important to point out that a block nested inside a case clause will create a new block scoped lexical environment, which will not produce the redeclaration errors shown above.</p> -<pre class="brush: js notranslate">let x = 1; +<pre class="brush: js">let x = 1; switch(x) { case 0: { @@ -157,7 +157,7 @@ switch(x) { <p>Unlike with simply undeclared variables and variables that hold a value of <code>undefined</code>, using the <code>typeof</code> operator to check for the type of a variable in that variable's TDZ will throw a <code>ReferenceError</code>:</p> -<pre class="brush: js notranslate">// prints out 'undefined' +<pre class="brush: js">// prints out 'undefined' console.log(typeof undeclaredVariable); // results in a 'ReferenceError' console.log(typeof i); @@ -168,7 +168,7 @@ let i = 10;</pre> <p>Due to lexical scoping, the identifier<strong> "foo"</strong> inside the expression <code>(foo + 55)</code> evaluates to the <u>if block's foo</u>, and <strong>not</strong> the <u>overlying variable foo</u> with the value of 33.<br> In that very line, the <u>if block's "foo"</u> has already been created in the lexical environment, but has not yet reached (and <strong>terminated</strong>) its initialization (which is part of the statement itself): it's still in the temporal dead zone.</p> -<pre class="brush: js example-bad notranslate">function test(){ +<pre class="brush: js example-bad">function test(){ var foo = 33; { let foo = (foo + 55); // ReferenceError @@ -178,7 +178,7 @@ test();</pre> <p>This phenomenon may confuse you in a situation like the following. The instruction <code>let n of n.a</code> is already inside the private scope of the <u>for loop's block</u>, hence the identifier<strong> "n.a"</strong> is resolved to the property 'a' of the <u>'n' object located in the first part of the instruction itself</u> ("let n"), which is still in the temporal dead zone since its declaration statement has not been reached and <strong>terminated</strong>.</p> -<pre class="brush: js example-bad notranslate">function go(n) { +<pre class="brush: js example-bad">function go(n) { // n here is defined! console.log(n); // Object {a: [1,2,3]} @@ -194,7 +194,7 @@ go({a: [1, 2, 3]}); <p>When used inside a block, <strong><code>let</code></strong> limits the variable's scope to that block. Note the difference between <code><strong>var</strong></code><em> </em>whose scope is inside the function where it is declared.</p> -<pre class="brush: js notranslate">var a = 1; +<pre class="brush: js">var a = 1; var b = 2; if (a === 1) { |