Some useful Javascript functions about Array and Object
- Tram Ho
1. filter ()
Create a new array based on items from the old table through certain filter conditions:
For example:
Create an array of aged students drinking alcohol:
1 2 3 | const studentsAge = [17, 16, 18, 19, 21, 17]; const ableToDrink = studentsAge.filter( age => age > 18 ); // ableToDrink will be equal to [19, 21] |
2. map ()
Create a new array by customizing values from another array.
For example:
Create an array and prepend each element with the $ symbol.
1 2 3 | const numbers = [2, 3, 4, 5]; const dollars = numbers.map( number => '$' + number); // dollars will be equal to ['$2', '$3', '$4', '$5'] |
3. reduce ()
Diminishes all elements in the array to a single value.
The return value can be any type (object, array, string, integer).
For example:
Calculate the total value in the array
1 2 3 | const numbers = [5, 10, 15]; const total = numbers.reduce( (accumulator, currentValue) => accumulator + currentValue); // total will be equal to 30 |
In addition reduce() can also group objects by an attribute, delete duplicated item , flatten an array, …
4. forEach ()
Performs the same job for each element in the array.
For example:
Print out the elements of the array
1 2 3 4 5 6 | const emotions = ['happy', 'sad', 'angry']; emotions.forEach( emotion => console.log(emotion) ); // Will log the following: // 'happy' // 'sad' // 'angry' |
5. some ()
Browse the elements in the array, when there are elements that meet the conditions will end the loop and return true
1 2 3 | const userPrivileges = ['user', 'user', 'user', 'admin']; const containsAdmin = userPrivileges.some( element => element === 'admin'); // containsAdmin will be equal to true |
6. every ()
Same as with some() , but only returns true when all properties in the array meet the condition.
1 2 3 | const ratings = [3, 5, 4, 3, 5]; const goodOverallRating = ratings.every( rating => rating >= 3 ); // goodOverallRating will be equal to true |
7. includes ()
Checks whether the array contains the input element, return true if the array contains that element.
For example:
Checks if its function contains the word waldo
1 2 3 | const names = ['sophie', 'george', 'waldo', 'stephen', 'henry']; const includesWaldo = names.includes('waldo'); // includesWaldo will be equal to true |
8. Array.from ()
Create a new array based on another array or string.
For example:
Create an array from a string
1 2 | const newArray = Array.from('hello'); // newArray will be equal to ['h', 'e', 'l', 'l', 'o'] |
Create a new array that has double value for the corresponding value of the given array.
1 2 | const doubledValues = Array.from([2, 4, 6], number => number * 2); // doubleValues will be equal to [4, 8, 12] |
9. Object.values ()
Returns an array of Object values.
For example:
1 2 3 4 5 6 7 8 | const icecreamColors = { chocolate: 'brown', vanilla: 'white', strawberry: 'red', } const colors = Object.values(icecreamColors); // colors will be equal to ["brown", "white", "red"] |
10. Object.keys ()
Returns an array of object key
For example:
1 2 3 4 5 6 7 8 | const icecreamColors = { chocolate: 'brown', vanilla: 'white', strawberry: 'red', } const types = Object.keys(icecreamColors); // types will be equal to ["chocolate", "vanilla", "strawberry"] |
11. Object.entries ()
Returns an array that contains the object’s key – value pairs
For example:
1 2 3 4 5 6 7 8 9 | const weather = { rain: 0, temperature: 24, humidity: 33, } const entries = Object.entries(weather); // entries will be equal to // [['rain', 0], ['temperature', 24], ['humidity', 33]] |
12. Object.freeze ()
Prevent editing of existing properties or adding properties of the object
People often think that the keyword const can do that, however, const still allows you to edit the object
For example:
Prevent the editing of the name attribute
1 2 3 4 5 6 7 8 | const frozenObject = { name: 'Robert' } Object.freeze(frozenObject); frozenObject.name = 'Henry'; // frozenObject will be equal to { name: 'Robert' } |
13. Object.seal ()
Prevent adding new properties to the object, but can still modify existing properties.
For example:
1 2 3 4 5 6 7 8 9 | const sealedObject = { name: 'Robert' } Object.seal(sealedObject); sealedObject.name = 'Bob'; sealedObject.wearsWatch = true; // sealedObject will be equal to { name: 'Bob' } |
Conclude
This is the end of my article, hopefully as useful as the title for you programmers. Thank you for your interest !!
Reference: https://codeburst.io/useful-javascript-array-and-object-methods-6c7971d93230
Source : Viblo