The document discusses the JavaScript utility library Lodash and whether it is needed. It notes that Lodash provides many useful functions but that modern JavaScript, including ES5 and ES6, include array and object methods that provide similar functionality to Lodash functions like map, filter, reduce, forEach, find, includes, merge, keys and values. The document recommends using built-in JavaScript methods over Lodash where possible but importing individual Lodash functions if a needed function is not supported by a target browser.

1. YOU DON’T NEED
LODASH**PROBABLY

2. WHAT IS LODASH?
“A modern JavaScript utility library…”
https://lodash.com

3. IT’S GOT SOMETHING FOR EVERYONE!
map, reduce, filter, forEach

4. IT’S GOT SOMETHING FOR EVERYONE!
map, reduce, filter, forEach, find, includes, contains

5. IT’S GOT SOMETHING FOR EVERYONE!
map, reduce, filter, forEach, find, includes, contains,
key, toUpper, toLower, join, compact, concat, flatten

6. IT’S GOT SOMETHING FOR EVERYONE!
map, reduce, filter, forEach, find, includes, contains,
key, toUpper, toLower, join, compact, concat, flatten,
clone, head, tail, groupBy, size, isArray, isDate, isEqual,
and on and on…

7. USING LODASH
const _ = require(‘lodash’);
const x = [ 1, 2, 3 ];
const doubled = _.map(x, (num) => 2 * num);
console.log(doubled); // [ 2, 4, 6 ]

8. BUT WAIT… map IS ALREADY AN ARRAY METHOD!
const x = [ 1, 2, 3 ];
const doubled = x.map((num) => 2 * num);
console.log(doubled); // [ 2, 4, 6 ]

9. BUT WAIT… map IS ALREADY AN ARRAY METHOD!
const x = [ 1, 2, 3 ];
const doubled = x.map((num) => 2 * num);
console.log(doubled); // [ 2, 4, 6 ]
No need to require lodash!
!

10. ES5 HAS SOME (FUN)CTIONAL ARRAY METHODS
▸ Supported in Chrome, Edge, FF, IE9, Opera, Safari
▸ map
▸ filter
▸ reduce
▸ forEach

11. map
const x = [ 1, 2, 3 ];
const map1 = _.map(x, (num) => num * 2);
const map2 = x.map((num) => num * 2);
// [ 2, 4, 6 ]

12. filter
const x = [ 1, 2, 3 ];
const filter1 = _.filter(x, (num) => num > 1);
const filter2 = x.filter((num) => num > 1);
// [ 2, 3 ]

13. reduce
const x = [ 1, 2, 3 ];
const sum1 = _.reduce(x, (acc, num) => acc + num, 0);
const sum2 = x.reduce((acc, num) => acc + num, 0);
// 6

14. forEach
const x = [ 1, 2, 3 ];
_.forEach(x, (num) => console.log(num));
x.forEach((num) => console.log(num));
// 1
// 2
// 3

15. THAT WAS FUN, RIGHT?
It gets even more fun with ES6!
▸ Array find, includes
▸ Object merge, keys, values

16. find
const users = [
{ 'user': 'barney', 'age': 36, 'active': true },
{ 'user': 'fred', 'age': 40, 'active': false },
{ 'user': 'pebbles', 'age': 1, 'active': true }
];
const found1 = _.find(users, (user) => user.age > 30);
const found2 = users.find((user) => user.age > 30);
// { user: 'barney', age: 36, active: true }

17. includes
const x = [ 1, 2, 3 ];
const included1 = _.includes(x, 1);
const included2 = x.includes(1);
// true

18. merge
const obj1 = { a: 1 };
const obj2 = { b: 2 };
// avoid mutation using empty object as target
const merged1 = _.merge({}, obj1, obj2);
const merged2 = Object.assign({}, obj1, obj2);
// { a: 1, b: 2 }

19. keys
z = { a: 1, b: 2};
const keys1 = _.keys(z);
const keys2 = Object.keys(z);
// [ 'a', 'b' ]

20. values
z = { a: 1, b: 2};
const values1 = _.values(z);
const values2 = Object.values(z);
// [ 1, 2 ]

21. THE GOOD NEWS!
▸ Node.js 6 supports 97% of ES6!
▸ Don’t need lodash for µservices!

22. THE BAD NEWS…
Not all browsers are ES6 compliant.
I’M LOOKING AT YOU INTERNET EXPLORER!

23. POLYFILLS SAVE THE DAY!
▸ Babel can polyfill ES6 functionality
▸ meo-frontend is already doing this! !

24. WHAT IS SUPPORTED BY EACH BROWSER?
▸ Check the ES6 compatibility table here

25. HOW CAN I LEARN MORE?
▸ MDN has great documentation!

26. WHAT IF I REALLY NEED A LODASH FUNCTION?
Lodash lets you import just a single function!
const groupBy = require('lodash/groupby');
const data = [
{ artist: '2 Chainz', genre: 'rap'},
{ artist: 'Popcaan', genre: 'dancehall' },
{ artist: 'Kendrick Lamar', genre: 'rap' },
{ artist: 'Vybz Kartel', genre: 'dancehall' }
];
const grouped = groupBy(data, 'genre');

27. const groupBy = require('lodash/groupby');
const data = [
{ artist: '2 Chainz', genre: 'rap'},
{ artist: 'Popcaan', genre: 'dancehall' },
{ artist: 'Kendrick Lamar', genre: 'rap' },
{ artist: 'Vybz Kartel', genre: 'dancehall' }
];
const grouped = groupBy(data, 'genre');
console.log(grouped);
// {
// rap: [
// { artist: '2 Chainz', genre: 'rap' },
// { artist: 'Kendrick Lamar', genre: 'rap' }],
// dancehall: [
// { artist: 'Popcaan', genre: 'dancehall' },
// { artist: 'Vybz Kartel', genre: 'dancehall' }]
// }

28. IN SUMMARY
ES5 and ES6 are powerful and should reduce/remove your need for
Lodash!

29. IN SUMMARY
ES5 and ES6 are powerful and should reduce/remove your need for
Lodash!
But if you need to use a Lodash function, import just the one you need!

30. QUESTIONS?
COMMENTS?