web-dev-qa-db-fra.com

propagation syntaxe vs méthode slice

J'essayais de comprendre quelle est la différence entre la méthode de propagation syntaxe vs slice dans l'approche suivante.

supposons que je veuille faire une copie réelle d'un tableau, je peux probablement le faire facilement en utilisant la syntaxe spread

var fruits = ["Banana", "Chips" , "Orange", "Lemon", "Apple", "Mango"]
var newCitrus = [...fruits]

Si je console.log ceci

["Banana", "Chips", "Orange", "Lemon", "Apple", "Mango"] 

mais je peux aussi créer une copie d'un tableau en utilisant la méthode slice. Considérant le même tableau ci-dessus, si je fais quelque chose comme ça ...

var citrus = fruits.slice(0);

puis consignez-le, cela me donnera exactement le même tableau que j’aurais eu grâce à la syntaxe répandue

["Banana", "Chips", "Orange", "Lemon", "Apple", "Mango"] 

Puisque les deux prennent à peu près le même temps pour coder/écrire, quelle est la différence ici? Quelle approche devrais-je habituellement choisir? 

7
iRohitBhatia

Les performances mises à part slice sont simplement une fonction de Array.prototype et ne fonctionneront donc que pour les tableaux. Par contre, la syntaxe Spread fonctionnera pour tout objet itérable (objet satisfaisant protocole itérable ), de sorte qu'il fonctionnera immédiatement avec tout objet String, Array, TypedArray, Map et Set. Vous pouvez aussi facilement créer des iterables personnalisés .

La syntaxe Spread peut également être utilisée pour créer des clones d'objets peu profonds:

const obj = { foo: 'bar', baz: 42 };
const clone = { ...obj1 };
obj.foo === clone.foo // true
obj.baz === clone.baz // true
obj === clone         // false (references are different)
5
Bartosz Gościński

Les performances dépendent du moteur sur lequel il tourne. Et comme avec la plupart des codes Javscript, il fonctionnera probablement dans différents moteurs. Alors, utilisez ce que vous ressentez esthétiquement mieux. Pour moi c'est répandu.

... est pure beauté.

Si vous décidez d'aller avec slice, ignorez le 0, dites simplement .slice().

3
rmn

Mesurer en Chrome montre que la tranche est beaucoup plus performante que l'opérateur étalonné, avec 67 millions d'opérations par seconde contre 4 millions d'opérations par seconde. Si vous construisez pour Chrome ou pour une application Electron (qui utilise Chromium), je choisirais une tranche, en particulier pour les applications de données volumineuses et en temps réel.

 Measure results

2
Jonathan Bursztyn