javascript - component - load external js script dynamically in angular 4

Copia profunda de una matriz en Angular 2+TypeScript

Question

Tengo una matriz de objetos que es una entrada. Vamos a llamarlo content .

Al intentar copiarlo en profundidad, todavía tiene una referencia a la matriz anterior.

Necesito duplicar esa matriz de entrada y cambiar una propiedad de la parte duplicada.

Tanto tiempo he probado diferentes métodos que no tuvieron éxito.

Manera ES6:

public duplicateArray() {
arr = [...this.content]
arr.map((x) => {x.status = DEFAULT});
return this.content.concat(arr);
}

La forma de slice :

public duplicateArray() {
arr = this.content.slice(0);
arr.map((x) => {x.status = DEFAULT});
return this.content.concat(arr);
}

En ambos, todos los objetos dentro de la matriz tienen status: ''Default'' .

¿Cuál es el mejor enfoque para copiar en profundidad la matriz en Angular 2?

Answer 1

Alternativamente, puede usar el proyecto ts-deepcopy , que también está disponible en npm, para clonar su objeto, o simplemente incluir el fragmento de código a continuación.

/**
* Deep copy function for TypeScript.
* @param T Generic type of target/copied value.
* @param target Target value to be copied.
* @see Source project, ts-deepcopy https://github.com/ykdr2017/ts-deepcopy
* @see Code pen https://codepen.io/erikvullings/pen/ejyBYg
*/
export const deepCopy = <T>(target: T): T => {
if (target === null) {
return target;
}
if (target instanceof Date) {
return new Date(target.getTime()) as any;
}
if (target instanceof Array) {
const cp = [] as any[];
(target as any[]).forEach((v) => { cp.push(v); });
return cp.map((n: any) => deepCopy<any>(n)) as any;
}
if (typeof target === ''object'' && target !== {}) {
const cp = { ...(target as { [key: string]: any }) } as { [key: string]: any };
Object.keys(cp).forEach(k => {
cp[k] = deepCopy<any>(cp[k]);
});
return cp as T;
}
return target;
};

Answer 2

Aquí está el mío. No funciona para casos complejos, pero para una simple matriz de objetos, es lo suficientemente bueno.

 deepClone(oldArray: Object[]) {
let newArray: any = [];
oldArray.forEach((item) => {
newArray.push(Object.assign({}, item));
});
return newArray;
}

Answer 3

Esta es la sugerencia de Daria (ver comentario sobre la pregunta) que funciona a partir de TypeScript 2.1 y básicamente clona cada elemento de la matriz :

this.clonedArray = theArray.map(e => ({ ... e }));

Answer 4

Esto es trabajo para mí:

this.listCopy = Object.assign([], this.list);

Answer 5

La única solución que he encontrado (casi al instante después de publicar la pregunta), es recorrer la matriz y usar Object.assign()

Me gusta esto:

public duplicateArray() {
let arr = [];
this.content.forEach((x) => {
arr.push(Object.assign({}, x));
})
arr.map((x) => {x.status = DEFAULT});
return this.content.concat(arr);
}

Sé que esto no es óptimo. Y me pregunto si hay mejores soluciones.

Answer 6

Mira esto:

 let cloned = source.map(x => Object.assign({}, x));

Answer 7

Sencillo:

let objCopy = JSON.parse(JSON.stringify(obj));

Answer 8

Una forma limpia de copiar en profundidad los objetos que tienen objetos anidados en el interior es mediante el método cloneDeep de lodash.

Para Angular, puede hacerlo así:

Instale lodash con yarn add lodash o npm install lodash .

En su componente, importe cloneDeep y cloneDeep :

import * as cloneDeep from ''lodash/cloneDeep'';
...
clonedObject = cloneDeep(originalObject);

Solo se agregan 18kb a su construcción, vale la pena por los beneficios.

También he escrito un artículo aquí , si necesita más información sobre por qué usar el clonDeep de lodash.

Answer 9

puedes usar JQuery para copiar en profundidad:

var arr =[[''abc''],[''xyz'']];
var newArr = $.extend(true, [], arr);
newArr.shift().shift();
console.log(arr); //arr still has [[''abc''],[''xyz'']]

Answer 10

let newArr = arr.slice();

Así es como se copian las matrices JS. ¡No hay necesidad de pensar en algo nuevo!

Answer 11

let originalArray :string[] = [''one'', ''two'', ''Sc-fi''];
let cloneArray :string[] = originalArray.concat([]);