Typescript Access objects nested within other types

Question

I am relatively new to typescript and it's ins and outs and I am having trouble with a certain structure. it looks like this:

I have a function I am using to feed data to a timeline component. the data recieved by the function can be of type 1 or type 2. Now this is where it gets complicated type 1 is a an object. However, type 2 can be any 1 of 4 different types

type1 : {}

type2 : type3 | type4 | type5 | type6

types 3-6 differ slightly in structure from one another and cannot be combined. In the function below the isConversion flag is a check for an (object: type6). This object has another object inside it of type 7.

type 6: {
   ...,  
   type7: {
       ...,
       conversions
   }
}

inside type7 is a field called conversions that has the data I need to pass to the timeline.

timelineItems = (items: type1 | type2): PropsData => {
    const { dataType, isConversion } = this.state

    if(isConversion){
      const {comments, type7.conversions } = items as type6
      return {
        comments
        type7.conversions
      }
    }

I have a work around where I fetch type7 when I get the data and set it to the state. and use that value but I would like to to know if there is a way to get the conversions object as above.

Thank You.

I don't think I understand this question enough to venture an answer. It would help if you go through the exercise of producing a minimal reproducible example which can demonstrate your issue in a standalone environment like the TypeScript Playground. Good luck! — jcalz
– jcalz, Commented Mar 17, 2019 at 19:57

Wilhelm Olejnik · Accepted Answer · 2019-03-17 23:05:46Z

1

So you want to know if you can determine if items type is Type6?

Typescript types are lost after compilation so you have to write your own typeguard which will return true if object is Type6. It's pure javascript check, for example if you know that only Type6 has certain field you can check if it is present in this object.

interface Type6 {
  comments: any[];
  type6: Type7;
}

interface Type7 {
  conversions: any[];
}

function isType6(obj): obj is Type6 {
  return obj.type6 !== undefined;
}

Then you can use this typeguard like this:

if(isType6(items)) {
  const {comments, type6: {conversions}} = items; // no cast needed, ts know it is Type6
  return {comments, conversions };
}

answered Mar 17, 2019 at 23:05

Wilhelm Olejnik

2,5073 gold badges16 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Typescript Access objects nested within other types

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related