getting to know array iterators. OR why you don't need lodash.
QUICK! GO TO: arrays.ansble.com
iterators
Stable
Array.prototype.forEach()
Array.prototype.filter()
Array.prototype.map()
Array.prototype.reduce()
Array.prototype.reduceRight()
Unstable
Array.prototype.entries()
Array.prototype.find()
Array.prototype.findIndex()
Array.prototype.keys()
Array.prototype.values()
Array.prototype[@@iterator]()
[1, 2, 3, 4, 1, 2, 1, 2].filter(function (number) { return number > 1})
// returns [2, 3, 4, 2, 2]
[1, 2, 3, 4, 1, 2, 1, 2].find(function (number) { return number > 2})
// returns 3
[1, 2, 3, 4, 1, 2, 1, 2].findIndex(function (number) { return number > 2})
// returns 2
filter
find / findIndex
[1, 2, 3, 4, 1, 2, 1, 2].map(function (number) { return number * 2})
// returns [2, 4, 6, 8, 2, 4, 2, 4]
['a', 'b', 'c', 'd'].reduce(function (prev, cur) { return prev + cur})
// returns 'abcd'
['a', 'b', 'c', 'd'].reduceRight(function (prev, cur) { return prev / cur})
// returns 'dcba'
[1, 2, 3, 4, 1, 2, 1, 2].reduce(function (prev, cur) { return prev / cur})
// returns 0.010416666666666666
[1, 2, 3, 4, 1, 2, 1, 2].reduceRight(function (prev, cur) { return prev / cur})
// returns 0.041666666666666664
map
reduce / reduceRight
[1, 2, 3].forEach(function (number) { console.log(number)})
// returns undefined
// 1
// 2
// 3
//WARNING: Is not exactly the same as a for loop to [].length
forEach
iter = ['a', 'b', 'c'].keys()
// returns Iterator
iter.next() // returns {value: 0, done: false}
iter.next() // returns {value: 1, done: false}
iter.next() // returns {value: 2, done: false}
iter.next() // returns {value: undefined, done: true}
iter = ['a', 'b', 'c'].values()
// returns Iterator
iter.next() // returns {value: 'a', done: false}
iter.next() // returns {value: 'b', done: false}
iter.next() // returns {value: 'c', done: false}
iter.next() // returns {value: undefined, done: true}
iter = ['a', 'b', 'c'].entries()
// returns Iterator
iter.next() // returns {value: [0,'a'], done: false}
iter.next() // returns {value: [1,'b'], done: false}
iter.next() // returns {value: [2,'c'], done: false}
iter.next() // returns {done: true}
entries / keys / values
iter = ['a', 'b', 'c'].entries()
// returns Iterator
iter.next() // returns {value: [0,'a'], done: false}
iter.next() // returns {value: [1,'b'], done: false}
iter.next() // returns {value: [2,'c'], done: false}
iter.next() // returns {done: true}
arr = ['a', 'b', 'c'];
iter = arr[@@iterator];
// returns Iterator
iter.next() // returns {value: [0,'a'], done: false}
iter.next() // returns {value: [1,'b'], done: false}
iter.next() // returns {value: [2,'c'], done: false}
iter.next() // returns {done: true}
array[@@iterator]
Play Time!
arrays.ansble.com
Extra Credit!
Stable
Array.prototype.every()
Array.prototype.some()
Unstable
Array.prototype.includes()
[1, 2, 3, 4, 1, 2, 1, 2].every(function (number) { return number > 0}) //true
[1, 2, 3, 4, 1, 2, 1, 2].every(function (number) { return number > 2}) //false
[1, 2, 3, 4, 1, 2, 1, 2].some(function (number) { return number > 0}) //true
[1, 2, 3, 4, 1, 2, 1, 2].some(function (number) { return number > 2}) //true
[1, 2, 3, 4, 1, 2, 1, 2].some(function (number) { return number < 0}) //false
every
some
[1, 2, 3, 4, 1, 2, 1, 2].includes(1) //true
[1, 2, 3, 4, 1, 2, 1, 2].includes(42) //false
[1, 2, NaN].includes(NaN); // True
['Tom', 'Joe', 'Greg'].includes('Tom'] // True
includes
fin.
@daniel_sellers
designfrontier.net
Getting to Know Array Iterators. OR Why You Don't Need lodash.
By Daniel Sellers
Getting to Know Array Iterators. OR Why You Don't Need lodash.
- 1,584