map()
map() creates a new array by applying the provided function to each element in the array. The result is a new array with all elements transformed based on the provided function.
const cats = [
{age: 10, name: 'Mimi'},
{age: 14, name: 'Sooty'},
{age: 16, name: 'Rosie'}
];
// expected result: [{"name":"Mimi"},{"name":"Sooty"},{"name":"Rosie"}]
cats.map(cat => {return {"name": cat.name}});
filter()
filter() creates a new array using filter function that keeps only those elements that return true.. The result is a new array containing a subset of the elements from the supplied array.
const cats = [
{age: 10, name: 'Mimi'},
{age: 14, name: 'Sooty'},
{age: 16, name: 'Rosie'}
];
// Expected result: [{"age":14,"name":"Sooty"},{"age":16,"name":"Rosie"}]
cats.filter(cat => cat.age >= 12);
find()
find() returns the first element for which the supplied function returns true.
const cats = [
{age: 10, name: 'Mimi'},
{age: 14, name: 'Sooty'},
{age: 16, name: 'Rosie'}
];
// Expected result: {"age":16,"name":"Rosie"}
cats.find(cat => cat.name == 'Rosie');
reduce()
reduce() returns a single (accumulated) value based on a reducer function and an initial value. The result can be of any type depending on the reducer function.
const cats = [
{age: 10, name: 'Mimi'},
{age: 14, name: 'Sooty'},
{age: 16, name: 'Rosie'}
];
const initialValue = 0;
// Expected result: Sum of the cats ages: 40
cats.reduce((accumulator,cat) => accumulator + cat.age, initialValue);
includes()
includes() checks whether an array contains a specific element.
const animals = ["Dog", "Cat", "Fish", "Bird"];
animals.includes("Fish");
includes() is more useful for primitive values like strings and integers. It's less useful for arrays of objects because the objects must be strictly equal. In other words, the following will work:
var myDog = {"age":10, "name":'Beau'}
var dogs = [
{age: 10, name: 'Fido'},
{age: 14, name: 'Bowser'},
{age: 16, name: 'Rusty'},
myDog];
dogs.includes(myDog);
But this will return false:
var dogs = [
{age: 10, name: 'Fido'},
{age: 14, name: 'Bowser'},
{age: 16, name: 'Rusty'}];
dogs.includes({age: 10, name: 'Fido'});
For checking objects in an array it's better to use some().
some()
some() tests whether at least one element within the array tests positive for some condition. It will return a boolean if it finds an element, false otherwise.
For example, if we want to find if there are any dogs with an age greater than 15 we could do this:
const dogs = [
{age: 10, name: 'Fido'},
{age: 14, name: 'Bowser'},
{age: 16, name: 'Rusty'}
];
dogs.some((dog) => dog.age > 15)
sort()
sort() sorts the elements of an array in place and returns the reference to the same array, now sorted.
For example:
const dogs = ['Rusty', 'Bowser', 'Fido', 'Doggo'];
dogs.sort();
Without parameters the sort function will convert the values to strings and sort those. You can also supply a compare function for more complex sorts. The compare function has two parameters: a- the first element for comparison and b - the second element for comparison. The compare function must return a number based on the order of the elements. It should return a value < 0 if a comes before b, 0 if both are equal, and a value> 0 if a comes after b.
var dogs = [
{age: 10, name: 'Fido'},
{age: 14, name: 'Bowser'},
{age: 16, name: 'Rusty'},
{age: 18, name: 'Doggo'}];
dogs.sort((a, b) => a.age - b.age);
Or, comparing strings
var dogs = [
{age: 10, name: 'Fido'},
{age: 14, name: 'Bowser'},
{age: 16, name: 'Rusty'},
{age: 18, name: 'Doggo'}];
dogs.sort((a, b) => {
const nameA = a.name.toUpperCase(); // ignore upper and lowercase
const nameB = b.name.toUpperCase(); // ignore upper and lowercase
if (nameA < nameB) {
return -1;
}
if (nameA > nameB) {
return 1;
}
return 0;
});