JSON에서 TypeScript 클래스 인스턴스로?

JSON에서 TypeScript 클래스 인스턴스로?

이 질문에는 이미 답변이 있습니다.

JSON-Object를 사용하여 TypeScript 개체를 초기화하려면 어떻게 해야 합니까? (18개 답변)

닫힘6년 전에요.

조사를 좀 해봤지만, 제가 발견한 것에 완전히 만족하지는 않아요.만약을 위해 질문 하나 하겠습니다.JSON을 TypeScript 런타임 클래스 인스턴스로 역직렬화하는 가장 강력하고 우아한 자동화 솔루션은 무엇입니까?

내가 이 수업을 받았다고 가정해봐:

class Foo {
  name: string;
  GetName(): string { return this.name };
}

디시리얼라이제이션용으로 다음과 같은 JSON 스트링이 있다고 합시다.

{"name": "John Doe"}

이름이 "John Doe"로 설정된 Foo 클래스의 인스턴스와 메서드 GetName()이 작동하도록 하기 위해 가장 잘 유지 보수 가능한 솔루션은 무엇입니까?순수 데이터 객체로 역직렬화하는 것이 쉽다는 것을 알기 때문에 특별히 물어봅니다.수동 해석이나 수동 데이터 복사 없이 작업 메서드로 클래스 인스턴스를 얻을 수 있는지 궁금합니다.완전히 자동화된 솔루션이 불가능할 경우 차선책은 무엇입니까?

이 질문은 매우 광범위하기 때문에 몇 가지 해결책을 제시하겠습니다.

해결책 1: 도우미 방법

다음은 필요에 따라 변경할 수 있는 도우미 방법을 사용하는 예입니다.

class SerializationHelper {
    static toInstance<T>(obj: T, json: string) : T {
        var jsonObj = JSON.parse(json);

        if (typeof obj["fromJSON"] === "function") {
            obj["fromJSON"](jsonObj);
        }
        else {
            for (var propName in jsonObj) {
                obj[propName] = jsonObj[propName]
            }
        }

        return obj;
    }
}

그 후 사용:

var json = '{"name": "John Doe"}',
    foo = SerializationHelper.toInstance(new Foo(), json);

foo.GetName() === "John Doe";

고도의 역직렬화

, 인 「Deserialization」, 「Deserialization」, 「Deserialization」을 으로, 커스텀의 .fromJSON (은 method to class (method to class) ( to class (method to class, method to class))와 잘 )JSON.stringify toJSON메표표표표표표표 （ ） 。

interface IFooSerialized {
    nameSomethingElse: string;
}

class Foo {
  name: string;
  GetName(): string { return this.name }

  toJSON(): IFooSerialized {
      return {
          nameSomethingElse: this.name
      };
  }

  fromJSON(obj: IFooSerialized) {
        this.name = obj.nameSomethingElse;
  }
}

그 후 사용:

var foo1 = new Foo();
foo1.name = "John Doe";

var json = JSON.stringify(foo1);

json === '{"nameSomethingElse":"John Doe"}';

var foo2 = SerializationHelper.toInstance(new Foo(), json);

foo2.GetName() === "John Doe";

솔루션 2: 기본 클래스

다른 방법은 자체 기본 클래스를 만드는 것입니다.

class Serializable {
    fillFromJSON(json: string) {
        var jsonObj = JSON.parse(json);
        for (var propName in jsonObj) {
            this[propName] = jsonObj[propName]
        }
    }
}

class Foo extends Serializable {
    name: string;
    GetName(): string { return this.name }
}

그 후 사용:

var foo = new Foo();
foo.fillFromJSON(json);

베이스 클래스를 사용한 커스텀 디시리얼라이제이션의 실장은, 여러가지 방법이 있기 때문에, 고객님이 원하시는 대로 하겠습니다.

해서 '어울리지 않다'를 할 수 되었습니다.Object.assign(target, ...sources)예를 들어 다음과 같이 사용할 수 있습니다.

class Foo {
  name: string;
  getName(): string { return this.name };
}

let fooJson: string = '{"name": "John Doe"}';
let foo: Foo = Object.assign(new Foo(), JSON.parse(fooJson));

console.log(foo.getName()); //returns John Doe

Object.assign는 ECMAScript 2015의 일부로 현재 대부분의 최신 브라우저에서 사용할 수 있습니다.

JSON을 TypeScript 런타임 클래스 인스턴스로 역직렬화하는 가장 강력하고 우아한 자동화 솔루션은 무엇입니까?

ReflectDecorator와 함께 속성 데코레이터를 사용하여 런타임에 액세스할 수 있는 유형 정보를 기록함으로써 역직렬화 프로세스에서 사용할 수 있는 놀랍도록 깨끗하고 광범위하게 적응할 수 있는 접근 방식을 제공하고 기존 코드에도 아름답게 들어맞습니다.또한 완전 자동화가 가능하며 중첩된 개체에도 작동합니다.

이 아이디어의 구현은 TypeJ입니다.SON, 이 작업을 위해 정확하게 작성했습니다.

@JsonObject
class Foo {
    @JsonMember
    name: string;

    getName(): string { return this.name };
}

var foo = TypedJSON.parse('{"name": "John Doe"}', Foo);

foo instanceof Foo; // true
foo.getName(); // "John Doe"

왜 그냥 이렇게 하지 않았니?

class Foo {
  constructor(myObj){
     Object.assign(this, myObj);
  }
  get name() { return this._name; }
  set name(v) { this._name = v; }
}

let foo = new Foo({ name: "bat" });
foo.toJSON() //=> your json ...

Typescript 클래스와 json 객체를 다룰 때 찾은 최고의 솔루션: typescript 클래스에 json 데이터를 매개 변수로 사용하는 생성자를 추가합니다.이 컨스트럭터에서는 다음과 같이 jQuery를 사용하여 json 객체를 확장합니다.$ . extend ( this , json Data ) 。$.204를 사용하면 json 객체의 속성을 추가하는 동안 Javascript 프로토타입을 유지할 수 있습니다.

export class Foo
{
    Name: string;
    getName(): string { return this.Name };

    constructor( jsonFoo: any )
    {
        $.extend( this, jsonFoo);
    }
}

ajax 콜백에서는 다음과 같이 jons를 typescript 객체로 변환합니다.

onNewFoo( jsonFoos : any[] )
{
  let receviedFoos = $.map( jsonFoos, (json) => { return new Foo( json ); } );

  // then call a method:
  let firstFooName = receviedFoos[0].GetName();
}

컨스트럭터를 추가하지 않으면 ajax 콜백을 호출합니다.

let newFoo = new Foo();
$.extend( newFoo, jsonData);
let name = newFoo.GetName()

...그러나 constructor는 children json 오브젝트도 변환하는 경우에 편리합니다.자세한 답변은 이쪽입니다.

언급URL : https://stackoverflow.com/questions/29758765/json-to-typescript-class-instance