array-methods.js

1. Remove duplicates from an array of numbers/strings
Well, this is the only one not about map/reduce/filter but it’s so concise that it was hard not to put it in the list. Plus we’ll use it in a couple of examples too.
let values = [3, 1, 3, 5, 2, 4, 4, 4];
let uniqueValues = [...new Set(values)];
// uniqueValues is [3, 1, 5, 2, 4]
2. A simple search (case-sensitive)
The .filter() method creates a new array with all elements that pass the test implemented by the provided function.
let users = [
  { id: 11, name: 'Adam', age: 23, group: 'editor' },
  { id: 47, name: 'John', age: 28, group: 'admin' },
  { id: 85, name: 'William', age: 34, group: 'editor' },
  { id: 97, name: 'Oliver', age: 28, group: 'admin' }
];what is 
// res is []
3. A simple search (case-insensitive)
let res = users.filter(it => new RegExp('oli', "i").test(it.name));
// res is
[
  { id: 97, name: 'Oliver', age: 28, group: 'admin' }
]
4. Check if any of the users have admin rights
The .some() method tests whether at least one element in the array passes the test implemented by the provided function.
let hasAdmin = users.some(user => user.group === 'admin');
// hasAdmin is true
5. Flattening an array of arrays
The result of the first iteration is equal to : […[], …[1, 2, 3]] means it transforms to [1, 2, 3] — this value we provide as an ‘acc’ on the second iteration and so on.
let nested = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
let flat = nested.reduce((acc, it) => [...acc, ...it], []);
// flat is [1, 2, 3, 4, 5, 6, 7, 8, 9]
Probably this is the shortest implementation for flattering an array (build in Array.flat is still an experimental feature). Note that using the spread operatorinside reduce is not great for performance. This is a case when measuring performance makes sense for your use-case ☝️.
6. Create an object that contains the frequency of the specified key
Let’s group and count ‘age’ property for each item in the array:
let users = [
  { id: 11, name: 'Adam', age: 23, group: 'editor' },
  { id: 47, name: 'John', age: 28, group: 'admin' },
  { id: 85, name: 'William', age: 34, group: 'editor' },
  { id: 97, name: 'Oliver', age: 28, group: 'admin' }
];
let groupByAge = users.reduce((acc, it) =>
  ({ ...acc, [it.age]: (acc[it.age] || 0) + 1 }),
{});
// groupByAge is {23: 1, 28: 2, 34: 1}
7. Indexing an array of objects (lookup table)
Instead of processing the whole array for finding a user by id we can construct an object where user’s id will be set as a key (with constant searching time).
let uTable = users.reduce((acc, it) => ({...acc, [it.id]: it }), {})
// uTable equals:
{
  11: { id: 11, name: 'Adam', age: 23, group: 'editor' },
  47: { id: 47, name: 'John', age: 28, group: 'admin' },
  85: { id: 85, name: 'William', age: 34, group: 'editor' },
  97: { id: 97, name: 'Oliver', age: 28, group: 'admin' }
}
It’s useful when you have to access our data by id like uTable[85].name a lot.
8. Extract the unique values for the given key of each item in the array
Let’s create a list of existing users’ groups.
let listOfUserGroups = [...new Set(users.map(it => it.group))];
// listOfUserGroups is now ['editor', 'admin'];
9. Object key-value map reversal
let cities = {
  Lyon: 'France',
  Berlin: 'Germany',
  Paris: 'France'
};
let countries = Object.keys(cities).reduce(
  (acc, k) => (acc[cities[k]] = [...(acc[cities[k]] || []), k], acc) , {});
// countries is
{
  France: ["Lyon", "Paris"],
  Germany: ["Berlin"]
}
This one-liner looks quite tricky. We use a comma operator here, it means we return the last value in parenthesis — acc. Let’s rewrite this example in a more production-ready way:
let countries = Object.keys(cities).reduce((acc, k) => {
  let city = cities[k];
  acc[city] = [...(acc[city] || []), k];
  return acc;
}, {});
10. Create an array of Fahrenheit values from an array of Celsius values
The .map() method creates a new array with the results of calling a provided function on every element in the calling array.
Think of it as processing each element with a given formula 🤓.
let celsius = [-15, -5, 0, 10, 16, 20, 24, 32]
let fahrenheit = celsius.map(t => t * 1.8 + 32);
// fahrenheit is [5, 23, 32, 50, 60.8, 68, 75.2, 89.6]
11. Encode an object into a query string
let params = {lat: 45, lng: 6, alt: 1000};
let queryString = Object.entries(params).map(p => encodeURIComponent(p[0]) + '=' + encodeURIComponent(p[1])).join('&')
// queryString is "lat=45&lng=6&alt=1000"
12. Print a table of users as a readable string only with specified keys
Sometimes you want to print your array of objects with selected keys as a string but you realize that JSON.stringify is not that great 😦.
let users = [
  { id: 11, name: 'Adam', age: 23, group: 'editor' },
  { id: 47, name: 'John', age: 28, group: 'admin' },
  { id: 85, name: 'William', age: 34, group: 'editor' },
  { id: 97, name: 'Oliver', age: 28, group: 'admin' }
];
users.map(({id, age, group}) => `\n${id} ${age} ${group}`).join('')
// it returns:
"
11 23 editor
47 28 admin
85 34 editor
97 28 admin"
13. Find and replace key-value pair in an array of objects
Let’s say we want to change John’s age. If you know the index you can write this line: users[1].age = 29. But let’s take a look at another way of doing it:
let updatedUsers = users.map(
  p => p.id !== 47 ? p : {...p, age: p.age + 1}
);
// John is turning 29 now
So here instead of changing the single item in our array, we create a new one with only one element different. But now we can compare our arrays just by reference like updatedUsers == users which is super quick! React.js uses this approach to speed up the reconciliation process. Here is some explanation.
14. Union (A ∪ B) of arrays
Less code than importing and calling lodash function.
let arrA = [1, 4, 3, 2];
let arrB = [5, 2, 6, 7, 1];
[...new Set([...arrA, ...arrB])]; // returns [1, 4, 3, 2, 5, 6, 7]
15. Intersection (A ∩ B) of arrays
The last one!
let arrA = [1, 4, 3, 2];
let arrB = [5, 2, 6, 7, 1];
arrA.filter(it => arrB.includes(it)); // returns [1, 2]