TypeScript를 사용하여 중첩 된 JSON 속성에 액세스하는 방법은 무엇입니까?

Sunknudsen

다음 코드 블록은 TypeScript 오류를 반환합니다.

'문자열'유형의 표현식은 '{id : string; 유형을 색인화하는 데 사용할 수 없기 때문에 요소가 암시 적으로'모든 '유형을 갖습니다. 경로 : 문자열; basename : 문자열; createdOn : 문자열; modifiedOn : 문자열; 내용 : 문자열; } '.

대괄호는 JavaScript (또는 //@ts-ignore) 에서 잘 작동합니다 .

TypeScript에서 올바른 방법은 무엇입니까?

export interface Data {
  [key: string]: {
    id: string
    path: string
    basename: string
    createdOn: string
    modifiedOn: string
    content: string
  }
}

const data = _data as Data // _data is JSON

for (let item in data) {
  for (let property in data[item]) {
    console.log(property)
    if (["createdOn", "modifiedOn"].includes(property)) {
      data[item][property] = new Date(data[item][property])
    }
  }
}

다음은 JSON의 _data모양입니다.

{
  "readme": {
    "id": "3905d7917f2b3429490b01cfb60d8f5b",
    "path": "README.md",
    "basename": "README.md",
    "createdOn": "2020-02-26T12:29:26.181Z",
    "modifiedOn": "2020-02-26T12:29:26.181Z",
    "content": "<!--\nTitle: Privacy guides\nDescription: Privacy guides will be published shortly...\n-->\n\n# Privacy guides\n\nPrivacy guides will be published shortly...\n"
  },
  ...
}
테리 직물

그 이유는 두 가지입니다.

  1. property갖는 string대신 중첩 된 객체의 키로서 공지되는, 유형
  2. data[item][property] = new Date(...) 중첩 된 개체는 문자열 만 값으로 예상하기 때문에 어쨌든 오류를 반환합니다.

유형을 적절히 사용 .includes()하거나 .indexOf()좁히지 않기 때문에 기본적으로 올바른 키를 반환하는 함수를 만들어야합니다. 이것은 공용체 유형에서 올바른 유형을 리턴 하는 유형 가드 역할을합니다 .

function hasPossibleDateAsValue(value: string): value is 'createdOn' | 'modifiedOn' {
  return ["createdOn", "modifiedOn"].includes(value);
}

그런 다음 TypeScript에서 오류 / 경고를 표시하지 않고이를 수행 할 수 있습니다.

for (let item in data) {
  for (let property in data[item]) {
    if (hasPossibleDateAsValue(property)) {
      data[item][property] = new Date(data[item][property]);
    }
  }
}

TypeScript 플레이 라운드에 대한 개념 증명을 참조하십시오 .

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

ReactJS로 중첩 된 JSON에 액세스하는 방법은 무엇입니까?

분류에서Dev

중첩 된 Bigquery 속성에 액세스하는 방법은 무엇입니까?

분류에서Dev

Python Pandas를 사용하여 중첩 된 JSON 데이터를 CSV에 쓰는 방법은 무엇입니까?

분류에서Dev

jquery를 사용하여 중첩 된 JSON 개체에서 값을 가져 오는 방법은 무엇입니까?

분류에서Dev

Apex를 사용하여 중첩 된 JSON에서 값을 읽는 방법은 무엇입니까?

분류에서Dev

다른 속성의 값을 기반으로 중첩 된 JSON 속성에 액세스하는 방법은 무엇입니까?

분류에서Dev

중첩 된 개체 배열 내부의 개체 속성에 액세스하는 방법은 무엇입니까?

분류에서Dev

중첩 된 JSON 데이터에 document.getElementById (). textContent를 사용하는 방법은 무엇입니까?

분류에서Dev

중첩 된 json 배열의 첫 번째 요소에 DataContract를 사용하는 방법은 무엇입니까?

분류에서Dev

Jackson을 사용하여 중첩 된 JSON을 작성하는 방법은 무엇입니까?

분류에서Dev

대시를 사용하여 중첩 된 JSON 속성에 액세스

분류에서Dev

jQuery를 사용하여 단일 패스에서 중첩 된 JSON을 반복하는 방법은 무엇입니까?

분류에서Dev

SwiftUI를 사용하여 중첩 된 JSON 요소를 디코딩하고 뷰에 정보를 표시하는 방법은 무엇입니까?

분류에서Dev

json_extract ()를 사용하여 SQL에서 중첩 된 JSON 데이터 값을 쿼리하는 방법은 무엇입니까?

분류에서Dev

EmberData를 사용하여 EmberJS에서 중첩 된 모델로 구성된 약속을 반환하는 방법은 무엇입니까?

분류에서Dev

ngFor를 사용하여 Angular에서 중첩 된 json 객체의 알 수없는 수를 반복하는 방법은 무엇입니까?

분류에서Dev

자바 스크립트를 사용하여 중첩 된 객체에서 모든 자식의 단일 속성을 얻는 방법은 무엇입니까?

분류에서Dev

Node.js를 사용하여 JSON에서 중첩 된 객체를 반복하는 방법은 무엇입니까?

분류에서Dev

Ionic 프레임 워크에서 ng-repeat를 사용하여 중첩 된 JSON 객체를 표시하는 방법은 무엇입니까?

분류에서Dev

jquery 또는 javascript를 사용하여 중첩 된 JSON 데이터에 액세스 하시겠습니까?

분류에서Dev

하위 키만으로 중첩 된 사전의 값에 액세스하는 방법은 무엇입니까?

분류에서Dev

Windows Form 내부의 컨트롤에 액세스하는 중첩 된 메서드를 작성하는 방법은 무엇입니까?

분류에서Dev

변경되는 중첩 된 사전 키에 액세스하는 방법은 무엇입니까?

분류에서Dev

AngularJS를 사용하여 중첩 된 JSON에 액세스

분류에서Dev

AlamoFire / ObjectMapper를 사용하여 JSON 사전에 포함 된 링크에 액세스하는 방법은 무엇입니까?

분류에서Dev

중첩 된 JSON의 길이를 계산하는 방법은 무엇입니까?

분류에서Dev

중첩 된 JSON의 길이를 계산하는 방법은 무엇입니까?

분류에서Dev

XAML 내부에서 중첩 된 네임 스페이스에 액세스하는 방법은 무엇입니까?

분류에서Dev

C # 중첩 된 JSON의 일부를 개체 속성에 저장하지만 역 직렬화하지 않는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    ReactJS로 중첩 된 JSON에 액세스하는 방법은 무엇입니까?

  2. 2

    중첩 된 Bigquery 속성에 액세스하는 방법은 무엇입니까?

  3. 3

    Python Pandas를 사용하여 중첩 된 JSON 데이터를 CSV에 쓰는 방법은 무엇입니까?

  4. 4

    jquery를 사용하여 중첩 된 JSON 개체에서 값을 가져 오는 방법은 무엇입니까?

  5. 5

    Apex를 사용하여 중첩 된 JSON에서 값을 읽는 방법은 무엇입니까?

  6. 6

    다른 속성의 값을 기반으로 중첩 된 JSON 속성에 액세스하는 방법은 무엇입니까?

  7. 7

    중첩 된 개체 배열 내부의 개체 속성에 액세스하는 방법은 무엇입니까?

  8. 8

    중첩 된 JSON 데이터에 document.getElementById (). textContent를 사용하는 방법은 무엇입니까?

  9. 9

    중첩 된 json 배열의 첫 번째 요소에 DataContract를 사용하는 방법은 무엇입니까?

  10. 10

    Jackson을 사용하여 중첩 된 JSON을 작성하는 방법은 무엇입니까?

  11. 11

    대시를 사용하여 중첩 된 JSON 속성에 액세스

  12. 12

    jQuery를 사용하여 단일 패스에서 중첩 된 JSON을 반복하는 방법은 무엇입니까?

  13. 13

    SwiftUI를 사용하여 중첩 된 JSON 요소를 디코딩하고 뷰에 정보를 표시하는 방법은 무엇입니까?

  14. 14

    json_extract ()를 사용하여 SQL에서 중첩 된 JSON 데이터 값을 쿼리하는 방법은 무엇입니까?

  15. 15

    EmberData를 사용하여 EmberJS에서 중첩 된 모델로 구성된 약속을 반환하는 방법은 무엇입니까?

  16. 16

    ngFor를 사용하여 Angular에서 중첩 된 json 객체의 알 수없는 수를 반복하는 방법은 무엇입니까?

  17. 17

    자바 스크립트를 사용하여 중첩 된 객체에서 모든 자식의 단일 속성을 얻는 방법은 무엇입니까?

  18. 18

    Node.js를 사용하여 JSON에서 중첩 된 객체를 반복하는 방법은 무엇입니까?

  19. 19

    Ionic 프레임 워크에서 ng-repeat를 사용하여 중첩 된 JSON 객체를 표시하는 방법은 무엇입니까?

  20. 20

    jquery 또는 javascript를 사용하여 중첩 된 JSON 데이터에 액세스 하시겠습니까?

  21. 21

    하위 키만으로 중첩 된 사전의 값에 액세스하는 방법은 무엇입니까?

  22. 22

    Windows Form 내부의 컨트롤에 액세스하는 중첩 된 메서드를 작성하는 방법은 무엇입니까?

  23. 23

    변경되는 중첩 된 사전 키에 액세스하는 방법은 무엇입니까?

  24. 24

    AngularJS를 사용하여 중첩 된 JSON에 액세스

  25. 25

    AlamoFire / ObjectMapper를 사용하여 JSON 사전에 포함 된 링크에 액세스하는 방법은 무엇입니까?

  26. 26

    중첩 된 JSON의 길이를 계산하는 방법은 무엇입니까?

  27. 27

    중첩 된 JSON의 길이를 계산하는 방법은 무엇입니까?

  28. 28

    XAML 내부에서 중첩 된 네임 스페이스에 액세스하는 방법은 무엇입니까?

  29. 29

    C # 중첩 된 JSON의 일부를 개체 속성에 저장하지만 역 직렬화하지 않는 방법은 무엇입니까?

뜨겁다태그

보관