Aku punya kelas super yang merupakan induk ( Entity) untuk banyak subclass ( Customer, Product, ProductCategory...)

Saya mencari untuk mengkloning secara dinamis suatu objek yang berisi sub objek yang berbeda dalam naskah.

Sebagai contoh: a Customeryang berbeda Productyang memiliki aProductCategory

var cust:Customer  = new Customer ();

cust.name = "someName";
cust.products.push(new Product(someId1));
cust.products.push(new Product(someId2));

Untuk mengkloning seluruh pohon objek saya membuat fungsi di Entity

public clone():any {
    var cloneObj = new this.constructor();
    for (var attribut in this) {
        if(typeof this[attribut] === "object"){
           cloneObj[attribut] = this.clone();
        } else {
           cloneObj[attribut] = this[attribut];
        }
    }
    return cloneObj;
}

The newnaik error berikut ketika transpiled ke javascript:error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.

Meskipun skrip berfungsi, saya ingin menyingkirkan kesalahan yang ditransformasikan

Memecahkan Masalah Khusus

Anda bisa menggunakan pernyataan tipe untuk memberi tahu kompiler bahwa Anda lebih tahu:

public clone(): any {
    var cloneObj = new (this.constructor() as any);
    for (var attribut in this) {
        if (typeof this[attribut] === "object") {
            cloneObj[attribut] = this[attribut].clone();
        } else {
            cloneObj[attribut] = this[attribut];
        }
    }
    return cloneObj;
}

Kloning

Ingatlah bahwa kadang-kadang lebih baik menulis pemetaan Anda sendiri - daripada menjadi benar-benar dinamis. Namun, ada beberapa trik "kloning" yang dapat Anda gunakan yang memberi Anda efek perbedaan.

Saya akan menggunakan kode berikut untuk semua contoh berikut:

class Example {
  constructor(public type: string) {

  }
}

class Customer {
  constructor(public name: string, public example: Example) {

  }

  greet() {
    return 'Hello ' + this.name;
  }
}

var customer = new Customer('David', new Example('DavidType'));

Opsi 1: Sebarkan

Properti: Ya
Metode: Tidak
Salin Jauh: Tidak

var clone = { ...customer };

alert(clone.name + ' ' + clone.example.type); // David DavidType
//alert(clone.greet()); // Not OK

clone.name = 'Steve';
clone.example.type = 'SteveType';

alert(customer.name + ' ' + customer.example.type); // David SteveType

Opsi 2: Object.assign

Properti: Ya
Metode: Tidak
Salin Jauh: Tidak

var clone = Object.assign({}, customer);

alert(clone.name + ' ' + clone.example.type); // David DavidType
alert(clone.greet()); // Not OK, although compiler won't spot it

clone.name = 'Steve';
clone.example.type = 'SteveType';

alert(customer.name + ' ' + customer.example.type); // David SteveType

Opsi 3: Object.create

Properti: Metode Warisan
: Salinan Jauh Warisan : Warisan Dangkal (perubahan mendalam memengaruhi dokumen asli dan klon)

var clone = Object.create(customer);

alert(clone.name + ' ' + clone.example.type); // David DavidType
alert(clone.greet()); // OK

customer.name = 'Misha';
customer.example = new Example("MishaType");

// clone sees changes to original 
alert(clone.name + ' ' + clone.example.type); // Misha MishaType

clone.name = 'Steve';
clone.example.type = 'SteveType';

// original sees changes to clone
alert(customer.name + ' ' + customer.example.type); // Misha SteveType

Opsi 4: Fungsi Salin Jauh

Properti: Ya
Metode: Tidak
Salin Jauh: Ya

function deepCopy(obj) {
    var copy;

    // Handle the 3 simple types, and null or undefined
    if (null == obj || "object" != typeof obj) return obj;

    // Handle Date
    if (obj instanceof Date) {
        copy = new Date();
        copy.setTime(obj.getTime());
        return copy;
    }

    // Handle Array
    if (obj instanceof Array) {
        copy = [];
        for (var i = 0, len = obj.length; i < len; i++) {
            copy[i] = deepCopy(obj[i]);
        }
        return copy;
    }

    // Handle Object
    if (obj instanceof Object) {
        copy = {};
        for (var attr in obj) {
            if (obj.hasOwnProperty(attr)) copy[attr] = deepCopy(obj[attr]);
        }
        return copy;
    }

    throw new Error("Unable to copy obj! Its type isn't supported.");
}

var clone = deepCopy(customer) as Customer;

alert(clone.name + ' ' + clone.example.type); // David DavidType
// alert(clone.greet()); // Not OK - not really a customer

clone.name = 'Steve';
clone.example.type = 'SteveType';

alert(customer.name + ' ' + customer.example.type); // David DavidType

1.Gunakan operator spread

const obj1 = { param: "value" };
const obj2 = { ...obj1 };

Operator spread mengambil semua bidang dari obj1 dan menyebarkannya di obj2. Dalam hasilnya Anda mendapatkan objek baru dengan referensi baru dan bidang yang sama dengan yang asli.

Ingat bahwa itu adalah salinan dangkal, itu berarti bahwa jika objek bersarang maka params komposit bersarangnya akan ada di objek baru dengan referensi yang sama.

2.Object.assign ()

const obj1={ param: "value" };
const obj2:any = Object.assign({}, obj1);

Object.assign membuat salinan nyata, tetapi hanya memiliki properti sendiri, sehingga properti dalam prototipe tidak akan ada di objek yang disalin. Ini juga merupakan salinan dangkal.

3.Object.create ()

const obj1={ param: "value" };
const obj2:any = Object.create(obj1);

Object.create tidak melakukan kloning nyata , itu menciptakan objek dari prototipe. Jadi gunakan itu jika objek harus mengkloning properti tipe primer, karena penugasan properti tipe primer tidak dilakukan oleh referensi.

Plus dari Object.create adalah bahwa fungsi apa pun yang dinyatakan dalam prototipe akan tersedia di objek kami yang baru dibuat.

Beberapa hal tentang salinan dangkal

Salinan dangkal menempatkan objek baru ke semua bidang yang lama, tetapi itu juga berarti bahwa jika objek asli memiliki bidang tipe komposit (objek, array, dll.) Maka bidang tersebut dimasukkan ke objek baru dengan referensi yang sama. Mutasi bidang tersebut dalam objek asli akan tercermin dalam objek baru.

Mungkin terlihat seperti jebakan, tetapi benar-benar situasi ketika seluruh objek kompleks perlu disalin jarang terjadi. Salinan dangkal akan menggunakan kembali sebagian besar memori yang berarti sangat murah dibandingkan dengan salinan dalam.

Salinan dalam

Operator spread dapat berguna untuk salinan dalam.

const obj1 = { param: "value", complex: { name: "John"}}
const obj2 = { ...obj1, complex: {...obj1.complex}};

Kode di atas membuat salinan obj1 yang dalam. "Komposit" bidang komposit juga disalin ke obj2. Bidang mutasi "kompleks" tidak akan mencerminkan salinan.

Coba ini:

let copy = (JSON.parse(JSON.stringify(objectToCopy)));

Ini adalah solusi yang baik sampai Anda menggunakan objek yang sangat besar atau objek Anda memiliki sifat yang tidak dapat diubah.

Untuk menjaga keamanan jenis, Anda dapat menggunakan fungsi penyalinan di kelas tempat Anda ingin membuat salinan:

getCopy(): YourClassName{
    return (JSON.parse(JSON.stringify(this)));
}

atau dengan cara statis:

static createCopy(objectToCopy: YourClassName): YourClassName{
    return (JSON.parse(JSON.stringify(objectToCopy)));
}

TypeScript / JavaScript memiliki operator sendiri untuk kloning dangkal:

let shallowClone = { ...original };

Sangat mudah untuk mendapatkan salinan yang dangkal dengan "Object Spread" yang diperkenalkan di TypeScript 2.1

TypeScript ini: let copy = { ...original };

menghasilkan JavaScript ini:

var __assign = (this && this.__assign) || Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};
var copy = __assign({}, original);

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html

Untuk klon dalam yang dapat disambungkan, dengan Jenis Informasi adalah,

export function clone<T>(a: T): T {
  return JSON.parse(JSON.stringify(a));
}

Pandangan saya:

Object.assign(...) hanya menyalin properti dan kami kehilangan prototipe dan metode.

Object.create(...) tidak menyalin properti untuk saya dan hanya membuat prototipe.

Apa yang berhasil bagi saya adalah membuat prototipe menggunakan Object.create(...)dan menyalin properti menggunakan itu Object.assign(...):

Jadi untuk objek foo, buat klon seperti ini:

Object.assign(Object.create(foo), foo)

Anda juga dapat memiliki sesuatu seperti ini:

class Entity {
    id: number;

    constructor(id: number) {
        this.id = id;
    }

    clone(): this {
        return new (this.constructor as typeof Entity)(this.id) as this;
    }
}

class Customer extends Entity {
    name: string;

    constructor(id: number, name: string) {
        super(id);
        this.name = name;
    }

    clone(): this {
        return new (this.constructor as typeof Customer)(this.id, this.name) as this;
    }
}

Pastikan Anda mengganti clonemetode di semua Entitysubclass jika tidak, Anda akan berakhir dengan klon parsial.

Jenis pengembalian thisakan selalu cocok dengan jenis instance.

Tambahkan "lodash.clonedeep": "^4.5.0"ke package.json. Kemudian gunakan seperti ini:

import * as _ from 'lodash';

...

const copy = _.cloneDeep(original)

Jika Anda mendapatkan kesalahan ini:

TypeError: this.constructor(...) is not a function

Ini skrip yang benar:

public clone(): any {
    var cloneObj = new (<any>this.constructor)(); // line fixed
    for (var attribut in this) {
        if (typeof this[attribut] === "object") {
            cloneObj[attribut] = this[attribut].clone();
        } else {
            cloneObj[attribut] = this[attribut];
        }
    }
    return cloneObj;
}

Datang di masalah ini sendiri dan pada akhirnya menulis perpustakaan kecil cloneable-ts yang menyediakan kelas abstrak, yang menambahkan metode klon ke kelas mana pun memperluasnya. Kelas abstrak meminjam Fungsi Salin Jauh yang dijelaskan dalam jawaban yang diterima oleh Fenton hanya menggantikan copy = {};dengan copy = Object.create(originalObj)untuk mempertahankan kelas objek asli. Berikut ini adalah contoh penggunaan kelas.

import {Cloneable, CloneableArgs} from 'cloneable-ts';

// Interface that will be used as named arguments to initialize and clone an object
interface PersonArgs {
    readonly name: string;
    readonly age: number;
}

// Cloneable abstract class initializes the object with super method and adds the clone method
// CloneableArgs interface ensures that all properties defined in the argument interface are defined in class
class Person extends Cloneable<TestArgs>  implements CloneableArgs<PersonArgs> {
    readonly name: string;
    readonly age: number;

    constructor(args: TestArgs) {
        super(args);
    }
}

const a = new Person({name: 'Alice', age: 28});
const b = a.clone({name: 'Bob'})
a.name // Alice
b.name // Bob
b.age // 28

Atau Anda bisa menggunakan Cloneable.clonemetode pembantu:

import {Cloneable} from 'cloneable-ts';

interface Person {
    readonly name: string;
    readonly age: number;
}

const a: Person = {name: 'Alice', age: 28};
const b = Cloneable.clone(a, {name: 'Bob'})
a.name // Alice
b.name // Bob
b.age // 28    

Ini tumbuk saya! Dan di sini ada tautan StackBlitz . Saat ini terbatas hanya menyalin tipe dan tipe objek sederhana tetapi dapat dimodifikasi dengan mudah saya pikir.

   let deepClone = <T>(source: T): { [k: string]: any } => {
      let results: { [k: string]: any } = {};
      for (let P in source) {
        if (typeof source[P] === 'object') {
          results[P] = deepClone(source[P]);
        } else {
          results[P] = source[P];
        }
      }
      return results;
    };

Karena TypeScript 3.7 dirilis, alias tipe rekursif sekarang didukung dan memungkinkan kita untuk mendefinisikan deepCopy()fungsi tipe aman :

// DeepCopy type can be easily extended by other types,
// like Set & Map if the implementation supports them.
type DeepCopy<T> =
    T extends undefined | null | boolean | string | number ? T :
    T extends Function | Set<any> | Map<any, any> ? unknown :
    T extends ReadonlyArray<infer U> ? Array<DeepCopy<U>> :
    { [K in keyof T]: DeepCopy<T[K]> };

function deepCopy<T>(obj: T): DeepCopy<T> {
    // implementation doesn't matter, just use the simplest
    return JSON.parse(JSON.stringify(obj));
}

interface User {
    name: string,
    achievements: readonly string[],
    extras?: {
        city: string;
    }
}

type UncopiableUser = User & {
    delete: () => void
};

declare const user: User;
const userCopy: User = deepCopy(user); // no errors

declare const uncopiableUser: UncopiableUser;
const uncopiableUserCopy: UncopiableUser = deepCopy(uncopiableUser); // compile time error

Tempat bermain

Untuk klon sederhana dari konten objek lubang, saya cukup merinci dan menguraikan contoh:

let cloneObject = JSON.parse(JSON.stringify(objectToClone))

Sedangkan saya mengubah data di pohon objectToClone, tidak ada perubahan dalam cloneObject. Itu adalah permintaan saya.

Semoga ini bisa membantu

Saya akhirnya melakukan:

public clone(): any {
  const result = new (<any>this.constructor);

  // some deserialization code I hade in place already...
  // which deep copies all serialized properties of the
  // object graph
  // result.deserialize(this)

  // you could use any of the usggestions in the other answers to
  // copy over all the desired fields / properties

  return result;
}

Karena:

var cloneObj = new (<any>this.constructor());

dari @Fenton memberikan kesalahan runtime.

Versi naskah: 2.4.2

Bagaimana dengan jQuery lama yang bagus ?! Ini klon yang dalam:

var clone = $.extend(true, {}, sourceObject);

Saya mencoba membuat layanan copy / klon generik yang mempertahankan tipe untuk objek bersarang. Senang umpan balik jika saya melakukan sesuatu yang salah, tetapi tampaknya berfungsi sejauh ini ...

import { Injectable } from '@angular/core';

@Injectable()
export class CopyService {

  public deepCopy<T>(objectToClone: T): T {
    // If it's a simple type or null, just return it.
    if (typeof objectToClone === 'string' ||
      typeof objectToClone === 'number' ||
      typeof objectToClone === 'undefined' ||
      typeof objectToClone === 'symbol' ||
      typeof objectToClone === 'function' ||
      typeof objectToClone === 'boolean' ||
      objectToClone === null
    ) {
      return objectToClone;
    }

    // Otherwise, check if it has a constructor we can use to properly instantiate it...
    let ctor = Object.getPrototypeOf(objectToClone).constructor;
    if (ctor) {
      let clone = new ctor();

      // Once we've instantiated the correct type, assign the child properties with deep copies of the values
      Object.keys(objectToClone).forEach(key => {
        if (Array.isArray(objectToClone[key]))
          clone[key] = objectToClone[key].map(item => this.deepCopy(item));
        else
          clone[key] = this.deepCopy(objectToClone[key]);
      });

      if (JSON.stringify(objectToClone) !== JSON.stringify(clone))
        console.warn('object cloned, but doesnt match exactly...\nobject: ' + JSON.stringify(objectToClone) + "\nclone: " + JSON.stringify(clone))

      // return our cloned object...
      return clone;
    }
    else {
      //not sure this will ever get hit, but figured I'd have a catch call.
      console.log('deep copy found something it didnt know: ' + JSON.stringify(objectToClone));
      return objectToClone;
    }
  }
}

Dalam typeScript saya uji dengan sudut, dan itu baik-baik saja

deepCopy(obj) {


        var copy;

        // Handle the 3 simple types, and null or undefined
        if (null == obj || "object" != typeof obj) return obj;

        // Handle Date
        if (obj instanceof Date) {
            copy = new Date();
            copy.setTime(obj.getTime());
            return copy;
        }

        // Handle Array
        if (obj instanceof Array) {
            copy = [];
            for (var i = 0, len = obj.length; i < len; i++) {
                copy[i] = this.deepCopy(obj[i]);
            }
            return copy;
        }

        // Handle Object
        if (obj instanceof Object) {
            copy = {};
            for (var attr in obj) {
                if (obj.hasOwnProperty(attr)) copy[attr] = this.deepCopy(obj[attr]);
            }
            return copy;
        }

        throw new Error("Unable to copy obj! Its type isn't supported.");
    }

Untuk kloning mendalam suatu objek yang dapat berisi objek lain, array dan sebagainya saya gunakan:

const clone = <T>(source: T): T => {
  if (source === null) return source

  if (source instanceof Date) return new Date(source.getTime()) as any

  if (source instanceof Array) return source.map((item: any) => clone<any>(item)) as any

  if (typeof source === 'object' && source !== {}) {
    const clonnedObj = { ...(source as { [key: string]: any }) } as { [key: string]: any }
    Object.keys(clonnedObj).forEach(prop => {
      clonnedObj[prop] = clone<any>(clonnedObj[prop])
    })

    return clonnedObj as T
  }

  return source
}

Menggunakan:

const obj = {a: [1,2], b: 's', c: () => { return 'h'; }, d: null, e: {a:['x'] }}
const objClone = clone(obj)

Anda bisa menggunakan tugas penataan dengan sintaks spread :

var obj = {id = 1, name = 'product1'};
var clonedObject = {...obj};

Jika Anda sudah memiliki objek target, jadi Anda tidak ingin membuatnya lagi (seperti jika memperbarui array) Anda harus menyalin properti.
Jika telah melakukannya dengan cara ini:

Object.keys(source).forEach((key) => {
    copy[key] = source[key]
})

Pujian sudah jatuh tempo. (lihat judul "versi 2")