Disappearance of array data

Question

Disappearance of array data

I have been working on creating an array of objects with nested arrays, but I am facing an issue where data seems to go missing in the final step:

const args_arr = [];
const options_arr = [];
let options = '';

let text = "";
for (let i = 0; i < 5; i++) {
  for (let j = 0; j < 5; j++) {
    if (i === j) {
      args_arr.push(true);
    } else {
      args_arr.push(false);
    }
  }
  text += args_arr + "<br>";
  options = {
    op1: true,
    op2: false,
    args: ['visible']
  };
  text += JSON.stringify(options) + "<br>";
  options.args.push(args_arr);
  text += JSON.stringify(options) + "<br>";
  options_arr.push(options);

  args_arr.length = 0;
}
text += '<br>' + JSON.stringify(options_arr) + "<br>";

document.getElementById("demo").innerHTML = text;

<pre id="demo"></pre>

All my code appears to be running correctly, except at the last stage when adding options to options_arr, some arrays after 'visible' are disappearing.

This is the outcome I'm observing:

true,false,false,false,false
{"op1":true,"op2":false,"args":["visible"]}
{"op1":true,"op2":false,"args":["visible", [true,false,false,false,false]]}
...

Can you help me identify what might be causing this issue?

javascript

Answer 1

Answer №1

The issue arises when pushing the elements from args_arr into options_arr and then making modifications to the information.

To resolve this, replace options.args.push(args_arr); with

options.args.push([...args_arr]);

This change will create a new array with values copied from args_arr, preventing it from being reset during each iteration.

Answer 2

The issue arises when pushing the elements from args_arr into options_arr and then making modifications to the information.

To resolve this, replace options.args.push(args_arr); with

options.args.push([...args_arr]);

This change will create a new array with values copied from args_arr, preventing it from being reset during each iteration.

Answer 3

Answer №2

Make sure to create a new args_arr for each iteration

const options_arr = [];
let options = '';
let text = [];
let args_arr = [];
for (let i = 0; i < 5; i++) {
  for (let j = 0; j < 5; j++) {
    if (i === j) {
      args_arr.push(true);
    } else {
      args_arr.push(false);
    }
  }
  text.push(args_arr);
  let options = {
    op1: true,
    op2: false,
    args: ['visible']
  };
  options.args.push(args_arr);
  text.push(JSON.stringify(options))
  options_arr.push(options);
  args_arr = [];
}
text.push('<hr/>')
text.push(JSON.stringify(options_arr,null,2))

document.getElementById("demo").innerHTML = text.join('<br/>');

<pre id="demo"></pre>

Answer 4

Make sure to create a new args_arr for each iteration

const options_arr = [];
let options = '';
let text = [];
let args_arr = [];
for (let i = 0; i < 5; i++) {
  for (let j = 0; j < 5; j++) {
    if (i === j) {
      args_arr.push(true);
    } else {
      args_arr.push(false);
    }
  }
  text.push(args_arr);
  let options = {
    op1: true,
    op2: false,
    args: ['visible']
  };
  options.args.push(args_arr);
  text.push(JSON.stringify(options))
  options_arr.push(options);
  args_arr = [];
}
text.push('<hr/>')
text.push(JSON.stringify(options_arr,null,2))

document.getElementById("demo").innerHTML = text.join('<br/>');

<pre id="demo"></pre>

Answer 5

Answer №3

It seems a bit unclear what your intention is, but perhaps cleaning up your code could offer some insights into the issue at hand.

const options_array=[];

let message = "";
for (let index = 0; index < 5; index++) {
    let choice={
      opt1:true,
      opt2:false,
      arguments:['visible',[]]
  };
  for (let j=0;j<5;j++)
   choice.arguments[1].push(index===j);
  options_array.push(choice);
}
message += JSON.stringify(options_array) ;

document.getElementById("output").innerHTML = message;

Answer 6

It seems a bit unclear what your intention is, but perhaps cleaning up your code could offer some insights into the issue at hand.

const options_array=[];

let message = "";
for (let index = 0; index < 5; index++) {
    let choice={
      opt1:true,
      opt2:false,
      arguments:['visible',[]]
  };
  for (let j=0;j<5;j++)
   choice.arguments[1].push(index===j);
  options_array.push(choice);
}
message += JSON.stringify(options_array) ;

document.getElementById("output").innerHTML = message;

Answer 7

Answer №4

For incorporating the spread operator into pushing args_arr to the`options.args` array, you can use this method:

options.args.push(...args_arr);

Answer 8

For incorporating the spread operator into pushing args_arr to the`options.args` array, you can use this method:

options.args.push(...args_arr);

Disappearance of array data

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Incorporating map() with data passed down as props from App.js into child components

Is it possible for jQuery UI Tabs to load entire new HTML pages?

How can I efficiently add multiple items to an array and store them in async storage using React Native?

What is the best way to implement Axios for data fetching in Gatsby's useStaticQuery function?

Issue experienced with Vue2 where utilizing a computed property to filter a nested v-for structure

Navigating a local and server environment with relative paths in a web server's multiple sites

Enhance Canvas when React State Changes

Guide to using Ajax to send a form and receive text in response

"The changes made to the list are not being accurately displayed by Angular's ng

Using jQuery to delay hiding for 2 seconds

`The resurgence of CERT_FindUserCertByUsage function in JavaScript`

What could be the reason for the component bindings being undefined within the controller?

What is the best way to modify a constant array in Angular?

Why does this code snippet throw an error if let is not hoisted or in the temporal dead zone? It could have simply used the global reference instead

Do not open iframe links in a new window

Monitoring changes in an array of objects using AngularJS's $watch function

What is the proper syntax for Angular 2 form element attributes?

The "require" keyword cannot be used in a Node-RED Function node

Ways to manually trigger a reevaluation of Vuelidate validation

What is the process for uploading an image using fetch?