How to include a loop within object creation?

Question

I am trying to create an object to use in various places of HTML. It goes a little something like this:

MovieInfo = {
            title: Movie.value[0].title,
            meta: [
              {
                name: "description",
                content: Movie.value[0].description,
              },
              {
                name: "date",
                content: Movie.value[0].releasedate
              },
              // Try to add objects from another array
             Movie.value[1].forEach(function (Cast, index) {
             return {
                key: Cast.actorname, property: "article:tag", content: Cast.actorname
              }
          })
            ]
}

The above does not work. However if I push to the meta array after creating the MovieInfo object then it does work, like so:

MovieInfo = {
                title: Movie.value[0].title,
                meta: [
                  {
                    name: "description",
                    content: Movie.value[0].description,
                  },
                  {
                    name: "date",
                    content: Movie.value[0].releasedate
                  },
                 
                ]
    }

              // Try to add objects from another array
                 Movie.value[1].forEach(function (Cast, index) {
                 MovieInfo.meta.push({
                    key: Cast.actorname, property: "article:tag", content: Cast.actorname
                  })
              })

I have to do quite a few of these loops in different areas so I would prefer them to be done while creating MovieInfo than outside of it. Is that possible? That is, is it possible to make my first attempt work by having a loop inside the object creation itself?

"Is that possible?" No. And I'm not sure why you think having the same code but in a different place is more convenient. Presumably you just create this once and then consume it later. Why does it really matter how it is created and populated with data? — VLAZ
– VLAZ, Commented Jun 9, 2021 at 16:49
@VLAZ Readability and knowing everything to do with the object creation is in the object creation itself. Can you explain why it is not possible? — volume one
– volume one, Commented Jun 9, 2021 at 16:51
It's really unclear what you're trying to achieve. You already have an array of movie objects. Why are you trying to assign that to a new object? — Andy
– Andy, Commented Jun 9, 2021 at 16:57
@Andy remapping it to a new shape, it seems. I swear, some days that's most of what I do at work - just transform objects into other objects. Surely it's not abnormal. — VLAZ
– VLAZ, Commented Jun 9, 2021 at 16:58

Bergi · Accepted Answer · 2021-06-09 19:54:53Z

2

You can use an IIFE to do arbitrary things in an object literal (or really, any expression):

const MovieInfo = {
  title: Movie.value[0].title,
  meta: (() => {
    const meta = [
      {
        name: "description",
        content: Movie.value[0].description,
      },
      {
        name: "date",
        content: Movie.value[0].releasedate
      },
    ];
    for (const cast of Movie.value[1]) {
      meta.push({
        key: cast.actorname,
        property: "article:tag",
        content: cast.actorname
      });
    }
    return meta;
  })(),
};

In this case, I would however recommend to simply build the array using concat and map:

const MovieInfo = {
  title: Movie.value[0].title,
  meta: [
    {
      name: "description",
      content: Movie.value[0].description,
    },
    {
      name: "date",
      content: Movie.value[0].releasedate
    },
  ].concat(Movie.value[1].map(cast => ({
    key: cast.actorname,
    property: "article:tag",
    content: cast.actorname
  }))),
};

edited Jun 9, 2021 at 19:54

answered Jun 9, 2021 at 16:53

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

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

2 Comments

volume one Over a year ago

This is great. Being new to JS, I have not come across this syntax for arrow function before cast => ({ key: cast.actorname, property: "article:tag", content: cast.actorname}). I thought arrow functions were just cast => { //do stuff here }. How come yours has parenthesis and is this documented anywhere so I can learn it?

Bergi Over a year ago

@volumeone See ECMAScript 6 arrow function that returns an object. Alternatively you could write cast => { return {…}; }

Collectives™ on Stack Overflow

How to include a loop within object creation?

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related