One of the first things you'll likely learn to do in Javascript is how to make use of and manipulate arrays at the most basic level. This article will quickly go over four of the methods that you will use.
1. PUSH
We use .push when we want to add something to the end of an array. This method allows us to add one or many items to the end of an array. The push method returns the new length of the array.
Adding one item to the end of an array
let numbers = [1,2,3,4]
numbers.push(5)
console.log(numbers) // [1,2,3,4,5]
Adding more than one item to the end of an array
let numbers = [1,2,3,4]
numbers.push(5,6,7,8)
console.log(numbers) // [1,2,3,4,5,6,7,8]
Using .push return value
let letters = ["a","b","c","d"]
console.log(letters.length) // 4
let newLength = letters.push("e")
console.log(newLength) // 5
console.log(letters) // ["a","b","c","d", "e"]
console.log(letters.length) // 5
2. POP
We use .pop when we want to remove something from the end of an array. The .pop method returns the item that was removed. If the array is empty, it will return undefined.
let fruits = ["🍏", "🍊", "🍌"]
fruits.pop() // "🍌"
console.log(fruits) // ["🍏", "🍊"]
fruits.pop() // "🍊"
console.log(fruits) // ["🍏"]
fruits.pop() // "🍏"
console.log(fruits) // []
fruits.pop() // undefined
console.log(fruits) // []
3. UNSHIFT
We use .unshift when we want to add something to the beginning of an array. This method allows us to add one or many items to the beginning of an array. The .unshift method returns the new length of the array.
Adding one item to the beginning of an array
let numbers = [2,3,4]
numbers.unshift(1)
console.log(numbers) // [1,2,3,4]
Adding more than one item to the beginning of an array
let numbers = [4,5,6,7,8]
numbers.unshift(1,2,3)
console.log(numbers) // [1,2,3,4,5,6,7,8]
Using .unshift return value
let letters = ["b","c","d","e"]
console.log(letters.length) // 4
let newLength = letters.unshift("a")
console.log(newLength) // 5
console.log(letters) // ["a","b","c","d", "e"]
console.log(letters.length) // 5
4. SHIFT
We use .shift when we want to remove something from the beginning of an array. The .shift method returns the item that was removed. If the array is empty, it will return undefined.
let fruits = ["🍏", "🍊", "🍌"]
fruits.shift() // "🍏"
console.log(fruits) // ["🍊", "🍌"]
fruits.shift() // "🍊"
console.log(fruits) // ["🍌"]
fruits.shift() // "🍌"
console.log(fruits) // []
fruits.shift() // undefined
console.log(fruits) // []
These are just 4 of the basic array methods that you can use when manipulating arrays in Javascript — refer to MDN for more array methods.
As always, refer to MDN for more info:
.push: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push
.pop: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop
.unshift: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift
.shift: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift
Feel free to reach out on any of my socials for questions, feedback (good and bad), or just to connect / say hello 👋.
Top comments (0)