Typescript: 모든 공용체 멤버에 정의되지 않은 속성에 대해 개체 유형의 공용체에서 속성에 액세스 할 수 없음

문서는 말한다 :

동일한 코드가 작동하도록하려면 유형 어설 션을 사용해야합니다.

let pet = getSmallPet();

if ((<Fish>pet).swim) {
    (<Fish>pet).swim();
}
else {
    (<Bird>pet).fly();
}

http://www.typescriptlang.org/docs/handbook/advanced-types.html

그런 다음 샘플에서 :

if ((<A>AorB).a) {
    // use AorB.a
}

여기서 문제는 B 가 a 속성을 선언하지 않기 때문에 런타임에 가능한 모든 유형의 a 속성을 가질 수 있다는 것입니다 ( 문자열 유형의 b 속성이있는 한 B 에 속성 집합이있는 개체). B 에서 a: undefined 속성을 명시 적으로 선언하여 작동하도록 만들 수 있습니다 (따라서 B 임의의 a 속성이 없도록 보장).

type A = { a: string; } 
type B = { b: string; a: undefined }
type AorB = A | B;

declare const AorB: AorB;

if (AorB.a) {
    // Ok
}

완벽합니다. 뇌 방귀.

유형 B에 a: undefined 를 정의하면 변수를 생성 / 전달할 때 undefined 로 설정해야합니다.
이 문제를 해결하기 위해 a 를 a?: undefined 로 선언 할 수 있으며 생략하면 typescript가 만족 스러울 것입니다.

댓글을 올바르게 이해하면 작동합니다 (하지만 던짐, 플레이 그라운드에서 테스트 됨). 버그인지 아닌지? 🤔

type LinkProps = {
    to: string;
    onClick?: undefined;
    // Link specific props:
    target: string;
}

type ButtonProps = {
    to?: undefined;
    onClick: Function;
    // Button specific props:
    disabled: boolean;
}

type ActionProps = LinkProps | ButtonProps;

const Action = (props: ActionProps) =>
    props.to ?
        'Link with target: ' + props.target // Error not on ButtonProps
    :
        'Button with disabled: ' + props.disabled; // Error: not on LinkProps

Action({
  to: 'dssd',
  target: '_blank'
});

나는 이것을 전혀 이해하지 못한다. if ((<A>AorB).a) 은 A 다시 입력하도록 강제하기 때문에 if (A.a) 를 사용하는 것과 동일하지 않습니까?

유형 B에 a: undefined 를 정의하면 변수를 생성 / 전달할 때 undefined 로 설정해야합니다.
이 문제를 해결하기 위해 a 를 a?: undefined 로 선언 할 수 있으며 생략하면 typescript가 만족 스러울 것입니다.

a?: never 더 좋을 수 있습니다. 이제 실수로 undefined 를 할당 할 수 없습니다.

노조의 각 구성원에게 이름을주지 않으면 어떻게됩니까? (어설 션 된 유형의 이름 없이는 위와 같이 유형 어설 션을 만들 수 없습니까?)

type u = "str" | {prop:"val"};
function f(arg:u){return arg.prop} // TypeScript: Property 'prop' does not exist on type 'u'

어떤 해결책이 있습니까?

책에서 해결책을 찾았습니다.

interface A { x:  number;} 
interface B { y:  string;}
function doStuff ( q: A | B ) {
  if ( 'x'  in q) {
    //  if type A...
  }
  else {
    // if type B...
  }
}

발췌 : Basarat Ali Syed. "TypeScript 심층 분석." Apple Books.

객체의 속성이며 유형 가드로 사용할 수 있으며 TypeScript는 사용한 유형을 알 수 있습니다.

type ColorItemType = {
    colorId: number,
    colorName: string,
}

type NumItemType = {
    numId: number,
    numName: string
}

type ResType = {
    itemId: number,
    // 0 color 1 num
    type: number,
    itemInfo: {
        colorList: Array<ColorItemType>
        numList: Array<NumItemType>
    }
}

const request = () => {
    return [{
        itemId: 1,
        type: 0,
        itemInfo: {
            colorList: [{
                colorId: 1,
                colorName: 'blue'
            }],
            numList: []
        }
    }];
};

const dataSource: Array<ResType> = request();

const formatData = dataSource.map(dataItem => {
    const list: Array<ColorItemType | NumItemType> = dataItem.type === 1 ? dataItem.itemInfo.numList : dataItem.itemInfo.colorList;
    return list.map(listItem => {
        return {
            // An error will be reported here
            value: listItem.numId || listItem.colorId,
            label: listItem.numName || listItem.colorName
        };
    });
});

여기서 문제는 B 가 a 속성을 선언하지 않기 때문에 런타임에 가능한 모든 유형의 a 속성을 가질 수 있다는 것입니다 ( 문자열 유형의 b 속성이있는 한 B 에 속성 집합이있는 개체). B 에서 a: undefined 속성을 명시 적으로 선언하여 작동하도록 만들 수 있습니다 (따라서 B 임의의 a 속성이 없도록 보장).

type A = { a: string; } 
type B = { b: string; a: undefined }
type AorB = A | B;

declare const AorB: AorB;

if (AorB.a) {
    // Ok
}

나를 위해 작동하지 않습니다 07.10.2020

그리고이 TS의 동작은 개발자에게별로 도움이되지 않기 때문에 좋지 않다고 생각합니다.