Using plain JavaScript, adding an element to an array by pushing the value of a string variable in an index position rather than pushing the

Question

Using plain JavaScript, adding an element to an array by pushing the value of a string variable in an index position rather than pushing the

I have the following JavaScript code snippet:

let array = [];
const datas = [
 'name1',
 'name2',
 'name3',
];
 
async function getData() {
    datas.forEach((data) => {
      let myData = data.name;
      if(!array.includes(myData)){
        array.push(myData);
      }
    })

    let result = await array;
    
    console.log('Result', result);
};

getData();

This code returns an array containing strings like:

['name1','name2', 'name3']

I want to convert each index of the array into an empty array, so it looks like this:

['name1': [], 'name2': [], 'name3': []]

Is there a way to achieve this using plain JavaScript?

javascript arrays

Answer 1

Answer №1

It seems that a solution like the one below may suit your needs

let object = {};
const elements = [
 'item1',
 'item2',
 'item3',
];
 
function extractData() {
    elements.forEach((element) => {
      object[element] = []
    })

    console.log('Output', object);

};

extractData();

Output { item1: [], item2: [], item3: [] }

Hint: Array keys must be numeric indexes only

Answer 2

It seems that a solution like the one below may suit your needs

let object = {};
const elements = [
 'item1',
 'item2',
 'item3',
];
 
function extractData() {
    elements.forEach((element) => {
      object[element] = []
    })

    console.log('Output', object);

};

extractData();

Output { item1: [], item2: [], item3: [] }

Hint: Array keys must be numeric indexes only

Answer 3

Answer №2

Instead of using an array, you could opt for an object and assign each name as a key like shown below:

let obj = {};
const names = [
 'John',
 'Alice',
 'Bob',
];
 
function getData() {
  names.forEach((name) => {
    if(!obj[name]){
      obj[name] = [];
    }
  })
  console.log(obj);
}

getData();

This will result in an object structure like this:

{
  John: [],
  Alice: [],
  Bob: []
}

It is important to ensure that each name is unique.

If you prefer to have an array returned, you can construct an array of objects as demonstrated below:

let array = [];
const names = [
 'John',
 'Alice',
 'Bob',
];
 
function getData() {
  names.forEach((name) => {
    array.push({
      name: name,
      data: []
    });
  })
  console.log(array);
}

getData();

With this approach, the resulting array would look like this:

[{
  data: [],
  name: "John"
}, {
  data: [],
  name: "Alice"
}, {
  data: [],
  name: "Bob"
}]

Answer 4

Instead of using an array, you could opt for an object and assign each name as a key like shown below:

let obj = {};
const names = [
 'John',
 'Alice',
 'Bob',
];
 
function getData() {
  names.forEach((name) => {
    if(!obj[name]){
      obj[name] = [];
    }
  })
  console.log(obj);
}

getData();

This will result in an object structure like this:

{
  John: [],
  Alice: [],
  Bob: []
}

It is important to ensure that each name is unique.

If you prefer to have an array returned, you can construct an array of objects as demonstrated below:

let array = [];
const names = [
 'John',
 'Alice',
 'Bob',
];
 
function getData() {
  names.forEach((name) => {
    array.push({
      name: name,
      data: []
    });
  })
  console.log(array);
}

getData();

With this approach, the resulting array would look like this:

[{
  data: [],
  name: "John"
}, {
  data: [],
  name: "Alice"
}, {
  data: [],
  name: "Bob"
}]

Using plain JavaScript, adding an element to an array by pushing the value of a string variable in an index position rather than pushing the

Answer №1

Answer №2

Similar questions

A guide on transferring variables to sessions instead of passing them through the URL in PHP

What is the best way to execute the app functions, such as get and post, that have been defined

Leveraging LevelGraph with MemDOWN

JavaScript - the global and local variable dilemma

Import data into Bootstrap table from an external source

Using val() on a checkbox will give you an element, not a string literal

Guideline on extracting private keys from Windows Certificate Manager

How to Use JavaScript Function to Rotate an Entire Webpage

What is the best way to limit the number of items shown in a cart dropdown using JavaScript

What is the reason for the identical nature of these two arrays?

Is there a way to display a React component containing an array that is constantly changing due to an external function?

Vue does not consistently update HTML when the reference value changes

Display the results from the API in a div using Vue.js

Navigating through tables and selecting rows

Reasons for aligning inline elements with input boxes

Maintain the previous state in AngularJS using ui-router

Display an error message if the input field is empty, then conceal the message once the input field is filled

ngAnimateSwap - animations do not function as intended when boolean expressions are utilized

The Evolution of Bulma's Navigation Menu

What is the process for implementing an image as the background instead of a color for each column in a Google chart?