ES6 / TS / Angular2解析JSON到Date

时间:2017-03-24 11:01:21

标签: javascript json angular typescript ecmascript-6

我跟随json:

let JSON_RESPONSE = `{"birthDates": ["2017-01-02","2016-07-15"]}`

我有一个TypeScript对象,声明了Date数组,并且ES6有一个特色构造函数init:

class Children {
  birthDates: Date[] = []

  constructor(values: Object = {}) {
    Object.assign(this, values)
  }
}

我想从JSON输出初始化这个对象:

const children = new Children(JSON.parse(this.JSON_RESPONSE))
children.birthDates.forEach(it => {
  console.log(it.getDate())
})

显然它不起作用,因为Children#birthDates属于Object类型而不是Date。添加显式new Date()初始化有助于:

children.birthDates.forEach(it => {
  console.log(new Date(it).getDate())
})

问题是如何在对象的构造函数阶段轻松地将JSON转换为合法Date对象,而无需手动将每个属性映射到JSON输入。

显然,Object.assign不符合我的要求,并使用类型继承执行shallow副本而不是deep

1 个答案:

答案 0 :(得分:1)

我在构造函数中使用Array.prototype.map来获取所有值作为日期:

type Data = {
    birthDates: string[];
}

class Children {
    birthDates: Date[];

    constructor(values?: Data) {
        if (values) {
            this.birthDates = values.birthDates.map(value => new Date(value));
        } else {
            this.birthDates = [];
        }
    }
}

code in playground

修改

如果数据包含更多字段,您可以使用Object.assign,然后使用映射版本覆盖birthDates属性:

interface IChildren {
    size: number;
    groudId: string;
    birthDates: string[];
}

class Children {
    size: number = 0;
    groudId: string = null;
    birthDates: Date[] = [];

    constructor(values?: IChildren) {
        if (values) {
            Object.assign(this, values);
        }

        this.birthDates = this.birthDates.map(value => new Date(value));
    }
}

code in playground