DEV Community

loading...

Manipulating Arrays!

Randy Rivera
Once I truly put my mind on something, I won't ever stop.
・2 min read

Manipulate Arrays With push()

For this part we will learn An easy way to add data to the end of an array via the push() function.

.push() takes one or more parameters and "pushes" them onto the end of the array.

  • For Example:
var myArray = [["Alan", 25], ["Randy", 23]];

myArray.push(["Diego", 30]);
Enter fullscreen mode Exit fullscreen mode
myArray now has the value [["Alan", 25], ["Randy", 23], ["Diego", 30]]
Enter fullscreen mode Exit fullscreen mode

Manipulate Arrays With pop()

Another way to change the data in an array is with the .pop() function.

the .pop() is used to take a value off of the end of an array. We can also store this popped off value by assigning it to a variable. In other words, .pop() removes the last element from an array and returns that element.

  • Example:
var myArray = [["Alan", 25], ["Randy", 23], ["Diego", 30]];

var removedFromMyArray = myArray.pop()
Enter fullscreen mode Exit fullscreen mode
console.log(removedFromMyArray); // will display ["Diego", 30]   
console.log(myArray); // will display [["Alan", 25], ["Randy", 23]]
Enter fullscreen mode Exit fullscreen mode

Manipulate Arrays With shift()

pop() always removes the last element of an array...but What if you want to remove the first?

the .shift() removes the first element instead of the last.

  • Example:
var myArray = [["Alan", 25], ["Randy", 23], ["Diego", 30]];

var removedFromMyArray = myArray.shift();
Enter fullscreen mode Exit fullscreen mode
console.log(removedFromMyArray); // will display ["Alan", 25]
console.log(myArray); // will display [["Randy", 23], ["Diego", 30]]
Enter fullscreen mode Exit fullscreen mode

Manipulate Arrays With unshift()

you can also unshift elements to the beginning of an array i.e. add elements in front of the array.

the .unshift() works exactly like .push(), but instead of adding the element at the end of the array, unshift() adds the element at the beginning of the array.

  • For Example:
var myArray = [["Alan", 25], ["Randy", 23], ["Diego", 30]];
myArray.shift();
myArray.unshift(["Johnny", 34]);
Enter fullscreen mode Exit fullscreen mode

After the shift, myArray would have the value

[["Randy", 23], ["Diego", 30]]
Enter fullscreen mode Exit fullscreen mode

After the unshift, myArray would have the value

[["Johnny", 34],  ["Randy", 23], ["Diego", 30]]
Enter fullscreen mode Exit fullscreen mode

Discussion (2)

Collapse
alonxx profile image
Alonso Diaz

what would be the best way to manipulate data from an array that is in a sub-array like in your examples?

Collapse
rthefounding profile image
Randy Rivera Author

Hi there! the best way to manipulate data from an array that is in a sub-array is quite simple but for now I'll keep it simple. Let's say I have a variable named myArray.

var myArray = [[1 ,2, 3], [4, 5, 6]];

As you can tell this is in a sub array.

Let's say we wanna change [[1,2,3] this guy but just the number 3, the number three is in index 2 because JavaScript count starts at 0,1,2 etc and the whole array [[1,2,3] is in the index 0 while the [4,5,6]] is index .
simply,

myArray[0][2] = 20
console.log(myArray); // will display [[1, 2, 20], [4, 5, 6]]