4.8 KiB
title | localeTitle |
---|---|
Spread syntax | Sintaxis extendida |
Sintaxis extendida
La sintaxis de propagación permite que una iterable, como una expresión de matriz o cadena, se expanda en lugares donde se esperan cero o más argumentos (para llamadas a funciones) o elementos (para literales de matriz), o una expresión de objeto para expandirse en lugares donde se espera cero .
Sintaxis
Para llamadas a funciones:
myFunction(...iterableObj);
Para matrices literales o cadenas:
[...iterableObj, '4', 'five', 6];
Ejemplos
Difundir en llamadas de función
Reemplazar aplicar
Es común utilizar Function.prototype.apply
en los casos en los que desee utilizar los elementos de una matriz como argumentos para una función.
function myFunction(x, y, z) { }
var args = [0, 1, 2];
myFunction.apply(null, args);
Con la sintaxis de propagación lo anterior se puede escribir como:
function myFunction(x, y, z) { }
var args = [0, 1, 2];
myFunction(...args);
Cualquier argumento en la lista de argumentos puede usar la sintaxis de propagación y puede usarse varias veces.
function myFunction(v, w, x, y, z) { }
var args = [0, 1];
myFunction(-1, ...args, 2, ...[3]);
Solicitar nuevos
Cuando se llama a un constructor con un new
, no es posible usar directamente una matriz y apply
( apply
hace un [[Call]]
y no un [[Construct]]
). Sin embargo, una matriz se puede utilizar fácilmente con nuevos gracias a la sintaxis de difusión:
var dateFields = [1970, 0, 1]; // 1 Jan 1970
var d = new Date(...dateFields);
Para usar nuevo con una matriz de parámetros sin sintaxis de propagación, tendría que hacerlo indirectamente a través de una aplicación parcial:
function applyAndNew(constructor, args) {
function partial () {
return constructor.apply(this, args);
};
if (typeof constructor.prototype === "object") {
partial.prototype = Object.create(constructor.prototype);
}
return partial;
}
function myConstructor () {
console.log("arguments.length: " + arguments.length);
console.log(arguments);
this.prop1="val1";
this.prop2="val2";
};
var myArguments = ["hi", "how", "are", "you", "mr", null];
var myConstructorWithArguments = applyAndNew(myConstructor, myArguments);
console.log(new myConstructorWithArguments);
// (internal log of myConstructor): arguments.length: 6
// (internal log of myConstructor): ["hi", "how", "are", "you", "mr", null]
// (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"}
Difundir en matrices literales
Un literal de matriz más potente.
Sin la sintaxis de propagación, para crear una nueva matriz utilizando una matriz existente como una parte de la misma, la sintaxis literal de la matriz ya no es suficiente y el código imperativo debe usarse en su lugar utilizando una combinación de empuje, empalme, concat, etc. Con la sintaxis de difusión esto se vuelve mucho más sucinto:
var parts = ['shoulders', 'knees'];
var lyrics = ['head', ...parts, 'and', 'toes'];
// ["head", "shoulders", "knees", "and", "toes"]
Al igual que la propagación de listas de argumentos, ...
se puede usar en cualquier lugar del literal de la matriz y se puede usar varias veces.
Copiar una matriz
var arr = [1, 2, 3];
var arr2 = [...arr]; // like arr.slice()
arr2.push(4);
// arr2 becomes [1, 2, 3, 4]
// arr remains unaffected
Nota : la sintaxis de propagación llega a un nivel de profundidad al copiar una matriz. Por lo tanto, puede no ser adecuado para copiar matrices multidimensionales, como muestra el siguiente ejemplo (es lo mismo con Object.assign () y la sintaxis de propagación).
var a = [[1], [2], [3]];
var b = [...a];
b.shift().shift(); // 1
// Now array a is affected as well: [[], [2], [3]]
Una mejor manera de concatenar matrices.
Array.concat
se usa a menudo para concatenar una matriz hasta el final de una matriz existente. Sin la sintaxis extendida esto se hace como:
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
// Append all items from arr2 onto arr1
arr1 = arr1.concat(arr2);
Con la sintaxis extendida esto se convierte en:
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1 = [...arr1, ...arr2];
Array.unshift
se usa a menudo para insertar una matriz de valores al inicio de una matriz existente. Sin la sintaxis extendida esto se hace como:
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
// Prepend all items from arr2 onto arr1
Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2]
Con la sintaxis extendida esto se convierte en:
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1 = [...arr2, ...arr1]; // arr1 is now [3, 4, 5, 0, 1, 2]