TypeScript - Create an interface for complicated objects

Question

The following variable contains a list of objects:

scenes = {
    sky: {
      image: 'assets/1.jpg',
      points: {
        blue_area: {
          x: 1,
          y: 2
        },
      }
    },
    blue_area: {
      image: 'assets/2.jpg',
      points: {
        sky: {
          x: 1,
          y: 2
        }
      }
    }
};

How I can declare an interface for this kind of variable?

Hoang Hiep · Accepted Answer · 2017-06-03 16:44:05Z

1

You can declare the type of Scenes as:

type Points = {
  [key: string]: {
    x: number;
    y: number;
  }
}

type Scenes = {
  [key: string]: {
    image: string;
    points: Points;
  }
}

let scenes: Scenes = {
    sky: {
      image: 'assets/1.jpg',
      points: {
        blue_area: {
          x: 1,
          y: 2
        },
      }
    },
    blue_area: {
      image: 'assets/2.jpg',
      points: {
        sky: {
          x: 1,
          y: 2
        }
      }
    }
};

edited Jun 3, 2017 at 16:44

answered Jun 3, 2017 at 16:22

Hoang Hiep

2,4225 gold badges15 silver badges17 bronze badges

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

2 Comments

TheUnreal Over a year ago

sky and blue_area are names that can be replaced by any other, my intention was to make something general which compactible to any other names.

Hoang Hiep Over a year ago

Well, in that case, you can just replace [key in ScenceNames]? with [key: string].

Collectives™ on Stack Overflow

TypeScript - Create an interface for complicated objects

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related