In the past, to accomplish a simple task in JavaScript, we would have to use underscorejs or lodash library (just a pain). However, now it's all baked into the language, so you can accomplish a lot with just a one-liner.
The list below helps to start learning new things, but you will need to refer to the documentation since the information below doesn't cover all the functionality for some methods.
.map()
Loops through an array, and performs your logic
const flags = [1, 2, 1, 1, 2].map(
digit => digit === 2
);
console.log(flags)
// output: [false, true, false, false, true]
.includes()
Checks if a specific value exists in the array
const isFruit = ['apple', 'orange', 'kiwi'].includes("orange")
console.log(isFruit)
// output: true
.filter()
Will update the variable with values that passed the filtering logic
const fruits = ['apple', 'orange', 'kiwi'].filter(
fruit => fruit.includes('a')
);
console.log(fruits)
// output: ['apple', 'orange']
.some()
Returns a boolean if any of the elements were true
const isEven = [1, 2, 3, 4, 5, 6].some(
(element) => element % 2 === 0
);
console.log(isEven)
// output: true
.sort()
Will arrange values within the array
Note: Recommending to go over docs on how this method is working
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].sort()
console.log(fruits)
// output: ['apple', 'banana', 'cantaloupe', 'dragonfruit']
.forEach()
Loops through the array and performs your logic on each element
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].forEach(
fruit => console.log(fruit)
);
// output:
// > dragonfruit
// > apple
// > banana
// > cantaloupe
.concat()
Combines array elements together into one
const busket1 = ['dragonfruit', 'apple']
const busket2 = ['banana', 'cantaloupe']
const allFruits = busket1.concat(busket2)
console.log(allFruits)
// output: ["dragonfruit", "apple", "banana", "cantaloupe"]
.every()
Checks each of the elements within array, and it returns a boolean based on the implemented logic.
const isLegalAge = [23, 33, 18, 100, 19].every(age => age >= 18)
console.log(isLegalAge)
// output: true
.join()
Connects elements with a specified value and returns a string
****Note: Recommending to go over docs on how this method is working
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].join('-')
console.log(fruits)
// output: "dragonfruit-apple-banana-cantaloupe"
.find()
Returns a matching logic value
Note: Recommending to go over docs on how this method is working
const fruit = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].find(
element => element === 'apple'
);
console.log(fruit)
// output: 'apple'
.findIndex()
Returns an index number of the first matching element value
Note: Recommending to go over docs on how this method is working
// array element 0 1 2 3
const fruitIntex = ['dragonfruit', 'apple', 'banana', 'kiwi'].findIndex(
(element) => element === 'banana'
);
console.log(fruitIntex)
// output: 2
.indexOf()
Returns an index of the first matching element value
Note: Recommending to go over docs on how this method is working
// array element 0 1 2 3
const fruitIntex = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].indexOf('banana')
console.log(fruitIntex)
// output: 2
.fill()
Replaces specified index value with a new value.
Note: Recommending to go over docs on how this method is working
// fill with 'orange' position 3
// array element 0 1 2 3
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].fill('orange', 3)
console.log(fruits)
// output: ["dragonfruit", "apple", "banana", "orange"]
.slice()
Will cut and store the specified index values into a new variable.
Note: Recommending to go over docs on how this method is working
// array element 0 1 2 3
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].slice(2)
console.log(fruits)
// output: ["banana", "cantaloupe"]
.reverse()
Will revert array values
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe'].reverse()
console.log(fruits)
// output: ["cantaloupe", "banana", "apple", "dragonfruit"]
.push()
Will add one more element to the end of the array
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe']
console.log(fruits.push('orange'))
console.log(fruits)
// output:
// first console: 5
// second console: ["dragonfruit", "apple", "banana", "cantaloupe", "orange"]
.pop()
Will remove the last element from the array
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe']
console.log(fruits.pop())
console.log(fruits)
// output:
// first console: "cantaloupe"
// second console: ["dragonfruit", "apple", "banana"]
.shift()
Will remove the first element from array and could be stored into a new variable
const fruits = ['dragonfruit', 'apple', 'banana', 'cantaloupe']
const shiftedFruit = fruits.shift()
console.log(fruits)
console.log(shiftedFruit)
// output:
// first console: ["apple", "banana", "cantaloupe"]
// second console: "dragonfruit"
.unshift()
Will prefix new element to the array
Note: Recommending to go over docs on how this method is working
const fruits = ["apple", "banana", "cantaloupe"]
console.log(fruits.unshift('dragonfruit'))
console.log(fruits)
// output:
// first console: 4
// second console: ["dragonfruit", "apple", "banana", "cantaloupe"]
If you want to know more about some of the methods, I recommend going to MDN Web documentation.
For more helpful tips and advice, subscribe to my channel and don't miss future topics.
Top comments (0)