# ES6 Array Functions

Below are a bunch of examples of ES6 Array functions applied to JSON data. This is just to illustrate the differences one would run into when tackling objects vs. single values in arrays.

# The Dataset

All code samples below are run with this dataset, meant to represent a timesheet database:

const data = [
  { start: "09:00", end: "10:00", hours: 1    },
  { start: "10:00", end: "11:30", hours: 1.5  },
  { start: "11:30", end: "12:00", hours: 0.5  },
  { start: "13:30", end: "15:45", hours: 2.25 },
  { start: "15:45", end: "16:45", hours: 1    }
];

# Array.from

Copies an array to another array. Gets around the by-reference default of assigning an array to another variable.

const newData = Array.from(data);

console.log( newData[0] );

newData[0] = { start: "18:00", end: "19:30", hours: 1.5 };

console.log( data[0] );
console.log( newData[0] );

{start: "09:00", end: "10:00", hours: 1}
{start: "09:00", end: "10:00", hours: 1}
{start: "18:00", end: "19:30", hours: 1.5}

# Doing the same thing with the spread (...) operator

Note that this can also be done with the spread operator, with less code but maybe not as clear:

	const newData = [...data];

# Array.includes

.includes only works on arrays, not objects. So to get around that limitation, .map the desired json to an array first the check that array with .includes.

const containsData = ( 
  data.map( entry => {
    return entry.start;
  }) 
).includes("13:30");

console.log( containsData );

Outputs true.

# Array.every

Checks each member of the array against a function returning true only if all members return truthy from that function.

const allOverOne = data.every( entry => {
  entry.hours >= 1;
});

console.log( allOverOne );

Outputs false since there's an entry that has 0.5 for hours.

# Array.some

Checks each member of the array against a function returning true at least one member return truthy from that function.

const overTwoHours = data.some( entry => {
  return entry.hours > 2;
});

console.log( overTwoHours );

Outputs true since one entry has hours of 2.25.

# Array.reduce

Applies a function to an accumulator using the value of each member of the array and returing the accumulator.

When using objects, an initializer is required to properly add up values.

const initialHours = 0;
const totalHours = data.reduce( (total, entry) => {
	return total + entry.hours;
}, initialHours );

console.log( totalHours );

Outputs 6.25, the total of all the hours in the dataset.

# Array.filter

Applies a function to each member of the array, returning all members that pass as truthy from that function.

const myResult = data.filter( entry => {
  return entry.hours >= 1.5
});

console.log( myResult );

{start: "10:00", end: "11:30", hours: 1.5}
{start: "13:30", end: "15:45", hours: 2.25}

# Array.map

Applies a function to each member of an array, returning the results as a new array.

The turnary function at the top of the .map function is just used to add an "s" to any number of hours over 1.

const myResult = data.map( entry => {
  s = (entry.hours > 1 ? "s" : "");
  return `${entry.hours} hour${s}`;
});

console.log( myResult );

{"1 hour", "1.5 hours", "0.5 hour", "2.25 hours", "1 hour"}

# Array.forEach

Runs a function using the array member as input, returning the result on each iteration (i.e.: standard loop style).

const showHours = data.forEach( entry => {
	console.log(`Times: ${entry.start} - ${entry.end}`);
});

Times: 09:00 - 10:00
Times: 10:00 - 11:00
Times: 11:30 - 12:00
Times: 13:30 - 15:45
Times: 15:45 - 16:45