克隆 TypeScript 对象

Question

我有打字稿class

export class Restaurant {

  constructor ( private id: string, private name: string ) {

  }

  public getId() : string {
    return this.id;
  }

  public setId(_id : string) {
    this.id = _id;
  }

  public getName () {
    return this.name;
  }

  public setName ( _name:string ) {
    this.name = _name;
  }

}

然后我有一个这个 class 的实例（这是一个例子）：

restaurant:Restaurant = new Restaurant(1,"TestRest");

然后我将这个餐厅对象存储在某种缓存中

cache.store( restaurant );

然后在我的应用程序中我找回了餐厅

var restToEdit = cache.get( "1" );
restToEdit.setName( "NewName" );

但是由于 javascripts 通过引用传递对象，我对 restToEdit 所做的更改也会保存在缓存中的餐厅中。

我基本上希望缓存中的餐厅是与 restToEdit 完全不同的实例。

我试过使用 jQuery.clone 和扩展，但它似乎不起作用，我认为这是因为它是一个打字稿对象。或者这无关紧要？

任何关于如何克隆此对象的答案将不胜感激

谢谢

Answer 1

.clone() only clones DOM elements. In order to clone JavaScript objects try jQuery.extend。像这样

// Shallow copy
var newObject = jQuery.extend({}, oldObject);

// Deep copy
var newObject = jQuery.extend(true, {}, oldObject);

Typescript 转换为 JavaScript。所以，JavaScript 方法会很好。

演示：

// Transpiled version of TypeScript
"use strict";
    var Restaurant = (function () {
        function Restaurant(id, name) {
            this.id = id;
            this.name = name;
        }
        Restaurant.prototype.getId = function () {
            return this.id;
        };
        Restaurant.prototype.setId = function (_id) {
            this.id = _id;
        };
        Restaurant.prototype.getName = function () {
            return this.name;
        };
        Restaurant.prototype.setName = function (_name) {
            this.name = _name;
        };
        return Restaurant;
    }());

// Test Snippet
var r1 = new Restaurant(1, "A");
var r2 = jQuery.extend(true, {}, r1);

r2.setName("B");

console.log(r1.name);
console.log(r2.name);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

使用标准 ES6 features
```
const clone = Object.assign({}, myObject)
```
警告：这执行的是浅克隆。

此 excellent page from MDN 包含大量关于克隆的详细信息，包括 ES5 的 polyfill
一种"quick"深度克隆的方法是使用JSON实用程序
```
const clone = JSON.parse(JSON.stringify(myObject))
```
一种"proper"的克隆方式是实现克隆方法或复制构造函数...

我知道，我知道，not enough JQuery

Answer 3

这似乎对我有用：

var newObject = Object.assign(Object.create(oldObj), oldObj)

Object.create 创建一个具有空属性的新实例 Object.assign 然后采用该新实例并分配属性

克隆函数的更强大版本

    clone(obj) {
        if(Array.isArray(obj)) {
            return Array.from(obj);
        } else {
            return Object.assign(Object.create(obj), obj);
        }
    }

Answer 4

如果您使用的是 TS 2.1，则可以使用对象展开运算符创建浅拷贝：

const obj = { a: 1 };
const clonedObj = { ...obj };

克隆 TypeScript 对象

Cloning a TypeScript Object

javascript

clone

typescript