打字稿本地存储兼容性

时间:2017-12-12 13:53:37

标签: javascript angular typescript local-storage

Typescript是否与本地存储兼容?我通过以下方式设置项目:

 localStorage.setItem('someString', JSON.stringify(MyTypescriptObject));

将对象存储为纯字符串。例如:

 private _id: string;

 get id(): string {
   return this._id;
 }
 set id(value: string) {
   this._id = value;
 }

当我得到它时:

return <MyTypescriptObject>JSON.parse(localStorage.getItem('someString'));

我明白了:

{_id: "1"...}

如果它们不兼容,我看不出使用Typescript的任何理由。更糟糕的是,我必须重新编写所有当前代码才能删除它。

1 个答案:

答案 0 :(得分:3)

这个问题与本地存储没有任何关系,你可以用JSON格式将数据保存在数据中,然后你必须将数据恢复到类的新实例。

您可以轻松添加一个构造函数,该构造函数接受json对象并将其应用于该类的实例:

class MyTypescript {
    constructor()
    constructor(id: string, name: string)
    constructor(data: Partial<MyTypescript>)
    constructor() {

        if (arguments.length == 1) {
            let data = arguments[0];
            Object.assign(this, data);
            return
        }
        let id = arguments[0];
        let name = arguments[1];
        this._id = id;
        this._name = name;
    }
    // Alternative to using a constructor, you can use MyTypescript.fromJson(data)
    public fromJson(data?: Partial<MyTypescript>) {
        var result = new MyTypescript();
        Object.assign(result, data);
        return result;
    }
    private _name: string;
    private _id: string;

    get id(): string {
    return this._id;
    }
    set id(value: string) {
    this._id = value;
    }
}

var obj = new MyTypescript();
obj.id = "10";
var data =  JSON.stringify(obj);
var obj2= new MyTypescript(JSON.parse(data));

更一般地说,如果你所看到的只是一个对象来保存一些数据,那么接口可能是更好的方法。在Typescript中,声明一个具有简单数据类属性的类是过分的,通常的做法是声明一个接口并将对象文字分配给该类型的变量。这将与JSON

更加无缝地协作
interface MyTypescript {
    id: string;
    name: string
}

var obj : MyTypescript = {
    id: "10",
    name: "foo"
};
var data = JSON.stringify(obj);
var obj2: MyTypescript = JSON.parse(data);