diff options
Diffstat (limited to 'files/zh-tw/web/javascript/reference/operators/spread_syntax/index.html')
-rw-r--r-- | files/zh-tw/web/javascript/reference/operators/spread_syntax/index.html | 36 |
1 files changed, 18 insertions, 18 deletions
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> |