TypeScript에서 객체 리터럴의 유형 정의

TypeScript에서 객체 리터럴의 유형 정의

---

TypeScript 클래스에서는 다음과 같이 속성 유형을 선언 할 수 있습니다.

class className {
  property: string;
};

객체 리터럴에서 속성 유형을 어떻게 선언합니까?

다음 코드를 시도했지만 컴파일되지 않습니다.

var obj = {
  property: string;
};

다음과 같은 오류가 발생합니다.

현재 범위에 'string'이름이 없습니다.

내가 잘못하고 있거나 버그입니까?

---

당신은 꽤 가깝습니다. 당신은를로 대체해야 =합니다 :. 객체 유형 리터럴 (사양 섹션 3.5.3 참조) 또는 인터페이스를 사용할 수 있습니다. 객체 타입 리터럴을 사용하는 것은 당신이 가진 것에 가깝습니다.

var obj: { property: string; } = { property: "foo" };

그러나 인터페이스를 사용할 수도 있습니다

interface MyObjLayout {
    property: string;
}

var obj: MyObjLayout = { property: "foo" };

---

캐스트 연산자를 사용하여 간결하게 만드십시오 (널을 원하는 유형으로 캐스트).

var obj = {
    property: <string> null
};

더 긴 예 :

var call = {
    hasStarted: <boolean> null,
    hasFinished: <boolean> null,
    id: <number> null,
};

두 부분으로 구성하는 것 (하나는 형식을 선언하고 다른 하나는 기본값을 선언하는 것)보다 훨씬 낫습니다.

var callVerbose: {
    hasStarted: boolean;
    hasFinished: boolean;
    id: number;
} = {
    hasStarted: null,
    hasFinished: null,
    id: null,
};

2016-02-10 업데이트-TSX 처리 (감사 @Josh)

TSX에 대해 as 연산자를 사용하십시오.

var obj = {
    property: null as string
};

더 긴 예 :

var call = {
    hasStarted: null as boolean,
    hasFinished: null as boolean,
    id: null as number,
};

2019-05-15 업데이트 (대체 코드 패턴 개선)

const더 많은 기능 코드 를 사용 하고 혜택을 얻은 후 수년이 지난 후에 대부분의 경우 위의 코드를 사용하지 않는 것이 좋습니다. 위의 내용은 변경 가능한 객체를 생성하여 함수 전체에서 한 번에 대신 필드 전체를 설정하여 일관성이없는 버그를 유발합니다.

대신 const가능한 한 변수를 사용 하고 객체를 마지막 단계로 작성하는 것이 좋습니다 .

const id = GetId();
const hasStarted = true;
...
const hasFinished = false;
...
return {hasStarted, hasFinished, id};

• 이렇게하면 명시 적으로 입력 할 필요없이 모든 것을 올바르게 입력 할 수 있습니다.
• 필드 이름을 다시 입력 할 필요가 없습니다.
• 이것은 내 경험에서 가장 깨끗한 코드로 이어집니다.
• 이를 통해 컴파일러는 더 많은 상태 확인을 제공 할 수 있습니다 (예를 들어, 여러 위치로 반환하는 경우 컴파일러는 동일한 유형의 객체가 항상 반환되도록합니다. 이렇게하면 각 위치에서 전체 반환 값을 선언하도록 장려 함) 그 가치의 의도).

---

타입 주석을 작성하려는 경우 구문은 다음과 같습니다.

var x: { property: string; } = ...;

객체 리터럴을 작성하려는 경우 구문은 다음과 같습니다.

var x = { property: 'hello' };

코드가 값 위치에 유형 이름을 사용하려고합니다.

---

TypeScript에서 객체를 선언하면 다음 구문을 사용합니다.

[access modifier] variable name : { /* structure of object */ }

예를 들면 다음과 같습니다.

private Object:{ Key1: string, Key2: number }

---

아무도 이것을 언급하지 않은 것에 놀랐습니다.하지만 유형의 쌍 ObjectLiteral을 허용 하는 인터페이스를 만들 수 있습니다 .key: valuestring: any

interface ObjectLiteral {
  [key: string]: any;
}

그런 다음 다음과 같이 사용하십시오.

let data: ObjectLiteral = {
  hello: "world",
  goodbye: 1,
  // ...
};

또한 보너스는 원하는만큼 많은 객체에서이 인터페이스를 필요한만큼 여러 번 재사용 할 수 있다는 것입니다.

행운을 빕니다.

---

당신이에 typings를 추가하려는 경우 탈구 함수에 인수 예를 들어, 객체 리터럴, 구문은 다음과 같습니다

function foo({ bar, baz }: { bar: boolean, baz: string }) {
  // ...
}

foo({ bar: true, baz: 'lorem ipsum' });

---

귀하의 코드에서 :

var obj = {
  myProp: string;
};

실제로 객체 리터럴을 작성하고 변수 문자열을 특성 myProp에 지정합니다. 매우 나쁜 연습이지만 실제로는 유효한 TS 코드입니다 (사용하지 마십시오!).

var string = 'A string';

var obj = {
  property: string
};

---

그러나 원하는 것은 객체 리터럴이 입력되는 것입니다. 이것은 다양한 방법으로 달성 될 수 있습니다 :

상호 작용:

interface myObj {
    property: string;
}

var obj: myObj = { property: "My string" };

맞춤 유형 :

type myObjType = {
    property: string
};

var obj: myObjType = { property: "My string" };

캐스트 연산자 :

var obj = {
    myString: <string> 'hi',
    myNumber: <number> 132,
};

객체 유형 리터럴 :

var obj: { property: string; } = { property: "Mystring" };

---

// Use ..

const Per = {
  name: 'HAMZA',
  age: 20,
  coords: {
    tele: '09',
    lan: '190'
  },
  setAge(age: Number): void {
    this.age = age;
  },
  getAge(): Number {
    return age;
  }
};
const { age, name }: { age: Number; name: String } = Per;
const {
  coords: { tele, lan }
}: { coords: { tele: String; lan: String } } = Per;

console.log(Per.getAge());

참고 URL : https://stackoverflow.com/questions/12787781/type-definition-in-object-literal-in-typescript