JavaScript chooses to start pushing elements into index 1 rather than the traditional index 0

Question

JavaScript chooses to start pushing elements into index 1 rather than the traditional index 0

I'm currently facing an issue with a JavaScript variable that I am trying to initialize within another function using a for loop:

var test = {
    det: [{x: -1, y: -1}]
};

for (var i = 0; i < 4; i++) {
        test.det.push({x:10+i, y:10});
}

console.log(test.det);

Despite my efforts, when I attempt to access test.det[0], I still see -1 & -1 as the values of x & y. The first set of values pushed remain at index 1. It appears there is a shift in all indices but the reason behind this behavior eludes me.

javascript angularjs

Answer 1

Answer №1

Array#push is used to add an additional item after the current last item in an array. To reinitialize, simply use assignment =:

var test = {
  det: [{x: -1, y: -1}]
};
  
for (var i = 0; i < 4; i++) {
  test.det[i] = ({x:10+i, y:10});
}

console.log(test);

Alternatively, you can clear the array and then utilize Array#push:

var test = {
  det: []
};

for (var i = 0; i < 4; i++) {
  test.det.push({x:10+i, y:10});
}

console.log(test);

Answer 2

Array#push is used to add an additional item after the current last item in an array. To reinitialize, simply use assignment =:

var test = {
  det: [{x: -1, y: -1}]
};
  
for (var i = 0; i < 4; i++) {
  test.det[i] = ({x:10+i, y:10});
}

console.log(test);

Alternatively, you can clear the array and then utilize Array#push:

var test = {
  det: []
};

for (var i = 0; i < 4; i++) {
  test.det.push({x:10+i, y:10});
}

console.log(test);

JavaScript chooses to start pushing elements into index 1 rather than the traditional index 0

Answer №1

Similar questions

Tips for retrieving the final value of a designated id within an array using JavaScript

User management functionality integrated into an AngularJS MVC skeleton project

Exploring the capabilities of NEXTJS for retrieving data from the server

What is the best method for placing an element above all other elements on a page, regardless of the layout or styles being used?

Retrieving error messages and status codes using Laravel and JWT authentication

Putting Text Inside a Video Player in HTML

exchange information among distinct domains

Trapped in the JavaScript Checkbox Filter Maze

Should loaders be utilized in an Angular application?

Is there a way for me to move a user from one room to another room?

Unable to Access Browser Page

How can I pull the account creation date stored in MongoDB and display it using Handlebars?

Confirmed the validation of an input that falls outside the parameters of the ReactiveForms model

Modifying paragraph content with JavaScript based on selected radio button values and troubleshooting the onclick event not triggering

Is the background image slowly disappearing?

Search for URLs using both www and non-www, as well as both http and https, with the jQuery.g

Having trouble with the menu toggle button on Bootstrap 4?

What steps do I need to take to link my form with Ajax and successfully submit it?

Is it possible to "preload" an image using JavaScript in order to utilize it as a CSS background-image?

Prevent webpage from jumping to the top when clicking on an editable Angular xeditable field within a ng-repeat