I have a object variable and i want to push into my object a new { key: "value" } but with a loop and using loop index.

Something like this:

    let headers = {
        product_title: "Product Name",
        action: "Status",
        quantity: "Quantity",
        priority: "Priority",
    };

    for (let i = 0; i < bigger; i  ) {
        headers = { ...headers, ...{ 'org_{i}': i } };
    }

is there a way to do something like this or add unique key with indexes?

Finally i need something like below:

let headers = {
   ...old data
   key_1: "",
   key_2: "",
   key_3: "",
};

CodePudding user response：

There's an ES6 thing called "computed properties" which allows regular JS enclosed in [] to form a string key...

let headers = {
  product_title: "Product Name",
  action: "Status",
  quantity: "Quantity",
  priority: "Priority",
};

for (let i = 0; i < 5; i  ) {
  headers = { ...headers, ['key_'   i]: i }
}

console.log(headers)

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Neat, but this creates a throw-away object for each iteration. Skipping the literal with the spread, you can use older JS, more efficiently...

let headers = {
  product_title: "Product Name",
  action: "Status",
  quantity: "Quantity",
  priority: "Priority",
};

for (let i = 0; i < 5; i  ) {
  headers['key_'   i] = i
}

console.log(headers)

<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

To add new key-value into object you can literally just use

headers[key] = value

But if you are intending to set keys dynamically I suggest you to check this out https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

CodePudding user response：

Try something like below

const output = [...Array(bigger)].reduce((acc, curr, index) => {
    return ({ ...headers, ...acc, [`org_${index}`]: index })
}, {});