diff options
Diffstat (limited to 'files/it/web/javascript/reference/global_objects/array/slice')
| -rw-r--r-- | files/it/web/javascript/reference/global_objects/array/slice/index.html | 241 |
1 files changed, 241 insertions, 0 deletions
diff --git a/files/it/web/javascript/reference/global_objects/array/slice/index.html b/files/it/web/javascript/reference/global_objects/array/slice/index.html new file mode 100644 index 0000000000..419da77ae4 --- /dev/null +++ b/files/it/web/javascript/reference/global_objects/array/slice/index.html @@ -0,0 +1,241 @@ +--- +title: Array.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/Array/slice +translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice +--- +<div>{{JSRef}}</div> + +<p><code>Il metodo <strong>slice()</strong></code> ritorna la copia di una porzione dell'array contenente gli elementi compresi tra <code>inzio</code> e <code>fine</code> (<code>fine</code> escluso). Il metodo <strong>slice()</strong> ritorna la copia dell'intero array se non contiene gli elementi di inizio e fine. L'array di partenza non viene modificato.</p> + +<pre class="brush: js">var a = ['zero', 'one', 'two', 'three']; +var sliced = a.slice(1, 3); + +console.log(a); // ['zero', 'one', 'two', 'three'] +console.log(sliced); // ['one', 'two'] +</pre> + +<h2 id="Sintassi">Sintassi</h2> + +<pre class="syntaxbox"><var>arr</var>.slice() +<var>arr</var>.slice(<var>inizio</var>) +<var>arr</var>.slice(<var>inizio</var>, <var>fine</var>) +</pre> + +<h3 id="Parametri">Parametri</h3> + +<dl> + <dt><code>begin</code> {{optional_inline}}</dt> + <dd>L'indice zero-based indica da dove inizia l'intervallo da selezionare.</dd> + <dd>Può essere utilizzato un indice negativo, indicante l'offset dall'ultimo elemento dell'array. <code>slice(-2)</code> seleziona gli ultimi due elementi della sequenza.</dd> + <dd>Se <code>begin</code> non viene impostato , <code>slice</code> parte dall'indice <code>0</code>.</dd> + <dt><code>end</code> {{optional_inline}}</dt> + <dd>L' indice zero-base indica dove finisce l'intervallo da selezionare. <code>slice </code>seleziona gli elementi fino a quell'indice ma non l'elemento all'indice <code>end</code>.</dd> + <dd>Per esempio, <code>slice(1,4)</code>estrae dal secondo elemento dell'array al quarto escluso (elementi con indice 1, 2 e 3).</dd> + <dd>Puo essere utilizzato un indice negativo, tale indice indicherebbe l'offset dall'ultimo elemento dell'array. <code>slice(2,-1)</code> estrae dal terzo elemento della sequenza al penuntimo.</dd> + <dd>Se <code>end</code> non viene impostato, <code>slice</code> continua l'estrazione sino al termine dell'array (<code>arr.length</code>).</dd> + <dd>Se <code>end</code> è maggiore della lunghezza della sequenza , <code>slice</code> continua l'estrazione sino al termine dell'array (<code>arr.length</code>).</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>Un nuovo array che contiene gli elementi estratti.</p> + +<h2 id="Descrizione">Descrizione</h2> + +<p><code>slice</code> non modifica l'array originale. Restituisce una copia superficiale degli elementi dell'array originale. Gli elementi dell'array originale vengono copiati nell'array restituito come segue:</p> + +<ul> + <li>Per i riferimenti a oggetti (e non i veri e propri oggetti), <code>slice</code> copia i riferimenti nel nuovo array. Entrambi gli array riferiscono quindi lo stesso oggetto. Se un oggetto riferito viene modificato, le modifiche interessano entrambi gli array.</li> + <li>Per le stringhe, i numeri e i boolean (non oggetti {{jsxref("String")}}, {{jsxref("Number")}} e {{jsxref("Boolean")}} <code>slice</code> copia i valori nel nuovo array. Le modifiche alle stringhe, ai numeri e ai boolean in un array non interessano l'altro array.</li> +</ul> + +<p>Se viene aggiunto un nuovo elemento in uno degli array, l'altro non viene modificato.</p> + +<h2 id="Esempi">Esempi</h2> + +<h3 id="Restituire_una_porzione_dellarray_esistente">Restituire una porzione dell'array esistente</h3> + +<pre class="brush: js">var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']; +var citrus = fruits.slice(1, 3); + +// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'] +// citrus contains ['Orange','Lemon'] +</pre> + +<h3 id="Utilizzare_slice">Utilizzare <code>slice</code></h3> + +<p>Nell'esempio che segue, <code>slice</code> crea un nuovo array, <code>newCar</code>, da <code>myCar</code>. Entrambi includono un riferimento all'oggetto <code>myHonda</code>. Quando il colore di <code>myHonda</code> diventa viola, entrambi gli array riflettono la modifica.</p> + +<pre class="brush: js">// Creare newCar da myCar utilizzando slice. +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); + +// Mostrare i valori di myCar, newCar, e il colore di myHonda +// riferiti da entrambi gli array. +console.log('myCar = ' + JSON.stringify(myCar)); +console.log('newCar = ' + JSON.stringify(newCar)); +console.log('myCar[0].color = ' + myCar[0].color); +console.log('newCar[0].color = ' + newCar[0].color); + +// Modificare il colore di myHonda. +myHonda.color = 'purple'; +console.log('The new color of my Honda is ' + myHonda.color); + +// Mostrare il colore di myHonda riferito da entrambi gli array. +console.log('myCar[0].color = ' + myCar[0].color); +console.log('newCar[0].color = ' + newCar[0].color); +</pre> + +<p>Lo script scrive:</p> + +<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 +newCar[0].color = red +The new color of my Honda is purple +myCar[0].color = purple +newCar[0].color = purple +</pre> + +<h2 id="Oggetti_Array-like">Oggetti Array-like</h2> + +<p>Il metodo <code>slice</code> può essere chiamato anche per convertire gli oggetti o le collezioni Array-like in un nuovo Array. Basta legare il metodo all'oggetto. {{jsxref("Functions/arguments", "arguments")}} all'interno di una funzione è un esempio di 'array-like object'.</p> + +<pre class="brush: js">function list() { + return Array.prototype.slice.call(arguments); +} + +var list1 = list(1, 2, 3); // [1, 2, 3] +</pre> + +<p>Il binding può essere effettuato con la funzione .<code>call</code> di {{jsxref("Function.prototype")}}<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> e può anche essere ridotto utilizzando </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">[].slice.call(arguments)</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> invece di </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">Array.prototype.slice.call</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">. Ad ogni modo, può essere semplificato utilizzando {{jsxref("Function.prototype.bind", "bind")}}.</span></p> + +<pre class="brush: js">var unboundSlice = Array.prototype.slice; +var slice = Function.prototype.call.bind(unboundSlice); + +function list() { + return slice(arguments); +} + +var list1 = list(1, 2, 3); // [1, 2, 3] +</pre> + +<h2 id="Streamlining_cross-browser_behavior">Streamlining cross-browser behavior</h2> + +<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">/** + * 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, + * at least before ES2015, IE hasn't needed to work this way). + * Also works on strings, fixes IE < 9 to allow an explicit undefined + * for the 2nd argument (as in Firefox), and prevents errors when + * called on other DOM objects. + */ +(function () { + 'use strict'; + var _slice = Array.prototype.slice; + + try { + // Can't be used with DOM elements in IE < 9 + _slice.call(document.documentElement); + } catch (e) { // Fails in IE < 9 + // This will work for genuine arrays, array-like objects, + // NamedNodeMap (attributes, entities, notations), + // NodeList (e.g., getElementsByTagName), HTMLCollection (e.g., childNodes), + // and will not fail on other DOM objects (as do DOM elements in IE < 9) + Array.prototype.slice = function(begin, end) { + // IE < 9 gets unhappy with an undefined end argument + end = (typeof end !== 'undefined') ? end : this.length; + + // For native Array objects, we use the native slice function + if (Object.prototype.toString.call(this) === '[object Array]'){ + return _slice.call(this, begin, end); + } + + // For array like object we handle it ourselves. + var i, cloned = [], + size, len = this.length; + + // Handle negative value for "begin" + var start = begin || 0; + start = (start >= 0) ? start : Math.max(0, len + start); + + // Handle negative value for "end" + var upTo = (typeof end == 'number') ? Math.min(end, len) : len; + if (end < 0) { + upTo = len + end; + } + + // Actual expected size of the slice + size = upTo - start; + + if (size > 0) { + cloned = new Array(size); + if (this.charAt) { + for (i = 0; i < size; i++) { + cloned[i] = this.charAt(start + i); + } + } else { + for (i = 0; i < size; i++) { + cloned[i] = this[start + i]; + } + } + } + + return cloned; + }; + } +}()); +</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>Initial definition. Implemented in JavaScript 1.2.</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.4.4.10', 'Array.prototype.slice')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td> + <td>{{Spec2('ES6')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div> + + +<p>{{Compat("javascript.builtins.Array.slice")}}</p> +</div> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{jsxref("Array.prototype.splice()")}}</li> + <li>{{jsxref("Function.prototype.call()")}}</li> + <li>{{jsxref("Function.prototype.bind()")}}</li> +</ul> |