Jump to navigation

Array

Methods

sort - sorts the items of array. By default, the sort method sorts the values as strings in alphabetical and ascending order.

var letters = ['D', "B", "A", "C"];

// Array [ "A", "B", "C", "D" ]
console.log(letters.sort());

// Numbers
var nums = [2, 3, 1, 6, 5, 4];

// Array [ 1, 2, 3, 4, 5, 6 ]
console.log(nums.sort(function(a, b){return a-b}))

Array.push() - adds an item to the end of the array so the return value is not the added item but instead is the new length of the array.

Array.unshift() - which adds an item to the beginning of the array, does the same thing: It returns the new array length.

Array.pop() - removes an item from the end of the array, but instead of returning the new array length, it returns the removed item.

Array.shift() - removes an item from the beginning of the array and, you guessed it, returns the removed item.

Iteration methods

Perform a load or wizardry while processing an array. All examples can be found as live code on this codepen.

All of the examples use the following demo array....

var arrPeople = [
  {
    'name': 'Shane',
    'age': 29
  },
  {
    'name': 'James',
    'age': 35
  },
  {
    'name': 'Ro',
    'age': 28
  },
  {
    'name': 'Jordan',
    'age': 21
  },
  {
    'name': 'Luc',
    'age': 18
  }
]

ES6 Syntax

arr.forEach((item) => {
  console.log(item);
});

map - returns an array based on the arguments that you provide inside the map

// Map
var ages = arrPeople.map(function(obj) {
  return obj.age;
});

foreach - loop through all of the array elements

// forEach
arrPeople.forEach(function(obj) {
  //console.log(obj.name)
});

every - returns a boolean - true if every element in this array satisfies the provided testing function

// every
arrPeople.every(function(obj) {
  return obj.age < 25;
});

some - returns a boolean - returns true if the callback function returns true for any array element; otherwise, false.

// some
arrPeople.some(function(obj) {
  console.log(obj);
  return obj.name === 'Shaney';
});

filter - returns an array based on the arguments that were true when looping

// Filter
var filtered = arrPeople.filter(function(obj) {
  return obj.age < 30;
});

reduce - returns a value, takes the prev/next item int he array and can do what want with them in function, useful for summing the contents of array

// Reduce 
arrPeople.reduce(function(a, b) {
  if(a.age < b.age) return a
  else return b
});

reduceRight - as above but starts at end goes backwards

// Reduce right
arrPeople.reduceRight(function(a, b) {
  return b * a;
});

setTimeout inside an array method

``` js fades.forEach((item, index) => { setTimeout(function(){ whatever(item); }, 1000 * index); }); ```

flat() - creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.

const arr = [1, 2, [3, 4]];
arr.flat(); 
// [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat(2);
// [1, 2, 3, 4, 5, 6]

flatMap() - like map, but flattens the result into a new array. Works the same as map followed by flat().

// [[29],[35],[28],[21],[18]];
arrPeople.map(x => [x.age * 2]);
// [29, 35, 28, 21, 18]
arrPeople.flatMap(x => [x]);

Chaining

// ES6
const combinedLegalAges = arrPeople
  .filter(person => person.age > 17)
  .map(legalPerson => legalPerson.age)
  .reduce((a, b) => a + b);
const combinedLegalAges = arrPeople
  .filter(function (person) {
    return person.age > 17;
  })
  .map(function (legalPerson) {
    return legalPerson.age;
  })
  .reduce(function (a, b) {
    return a + b;
  });

console.log(combinedLegalAges);

Array.prototype.fill()

const a = Array(10).fill(null);

var arr = [1, 2, 3, 4];
// fill with 0 from position 2 until position 4
console.log(arr.fill(0, 2, 4));
// expected output: [1, 2, 0, 0]

// fill with 5 from position 1
console.log(arr.fill(5, 1));
// expected output: [1, 5, 5, 5]

console.log(arr.fill(6));
// expected output: [6, 6, 6, 6]

Remove duplicate values from JS array

In ES6 you have Sets and Spread which makes it very easy and performant to remove all duplicates:

const b = [1,2,3,4,5,6,7,1,2,3,4,5,5]
console.log([ ...new Set(b) ]);
// [1, 2, 3, 4, 5, 6, 7]

Object within array

var uniq = a.reduce(function(a,b){
  if (a.indexOf(b.country) < 0 ) a.push(b.country);
  return a;
},[]);

Find duplicates in Array

var names = ['Mike', 'Matt', 'Nancy', 'Adam', 'Jenny', 'Nancy', 'Carl']

var uniq = names
  .map((name) => {
      return {
          count: 1,
          name: name
      }
  })
  .reduce((a, b) => {
      a[b.name] = (a[b.name] || 0) + b.count
      return a
  }, {})

var duplicates = Object.keys(uniq).filter((a) => uniq[a] > 1)
console.log(duplicates) // [ 'Nancy' ]

Array destructuring

const a = [1,2,3];
const [one, two, three] = a;

// 1
console.log(one)

StackOverflow by Christian Landgren