Collections libraries in JavaScript
Thick Clients
Map
function sqr(x) {
return x * x;
}
[1, 2, 3].map(sqr) // => [1, 4, 9]
Reduce
filter
some, every
groupBy
sort
...
Underscore/Lo-dash
Lo-dash
Lazy.js
Ramda
Ramda
var addFourNumbers = function(a, b, c, d) {
return a + b + c + d;
};
var curriedAddFourNumbers = R.curry(addFourNumbers);
var f = curriedAddFourNumbers(1, 2);
var g = f(3);
g(4); //=> 10
currying
Ramda
composition
var double = function(x) { return x * 2; };
var square = function(x) { return x * x; };
var squareThenDouble = R.compose(double, square);
var doubleThenSquare = R.compose(square, double);
squareThenDouble(5); //=> 50 == double(square(5))
doubleThenSquare(5); //=> 100 == square(double(5))
/* [
{
username: 'Mike',
complete: false,
dueDate: '1/22/2015',
title: 'Bla-bla.',
effort: 'mid',
priority: 'mid'
},
...
] */
underscore/lo-dash/lazy.js
results = _(tasks).where({complete: false});
Filter
ramda
Filter
var incomplete = R.filter(R.where({complete: false}));
// R.where: ({}, {}) => Boolean
// R.filter (f: (a) => Boolean, [a]) => [a]
results = incomplete(tasks);
otherResults = incomplete(otherTasks);
moreResults = incomplete(moreTasks);
underscore/lo-dash/lazy.js
results =_.chain(tasks)
.where({complete: false})
.groupBy('username')
.value();
Filter, Group
ramda
Filter, Group
var incomplete = R.filter(R.where({complete: false}));
var groupByUser = R.groupBy(R.prop('username'));
//R.groupBy: (f: (a) => String, [a]) => {String: [a]}
var activeByUser = R.compose(groupByUser, incomplete);
results = activeByUser (tasks);
Filter, Group
/*{
Martha: [{
username: 'Martha',
complete: false,
dueDate: '7/10/2015',
title: 'Important title',
effort: 'low',
priority: 'mid'
},
...
],
...
}*/
underscore/lo-dash/lazy.js
results = _.chain(tasks)
.where({complete: false})
.groupBy('username')
.mapObject(function(tasks) {
return _.sortBy(tasks, "dueDate")
})
.value();
//.mapObject(_.partial(_.sortBy, _, "dueDate"))
Filter, Group, Sort
ramda
Filter, Group, Sort
var activeByUser = R.compose(groupByUser, incomplete);
var sortByDate = R.sortBy(R.prop("dueDate"));
var sortUserTasks = R.compose(R.mapObj(sortByDate),
activeByUser);
results = sortUserTasks(tasks);
underscore/lo-dash/lazy.js
results = _.chain(tasks)
.where({complete: false})
.groupBy('username')
.mapObject(function(tasks) {
return _.chain(tasks)
.sortBy(tasks, "dueDate")
.reverse()
.value();
})
.value();
Filter, Group, Sort
ramda
Filter, Group, Sort
var sortByDateDescend = R.compose(
R.reverse, sortByDate
);
var sortUserTasksDescend = R.compose(
R.mapObj(sortByDateDescend), activeByUser
);
results = sortUserTasksDescend(tasks);
underscore/lo-dash/lazy.js
results = _.chain(tasks)
.where({complete: false})
.groupBy('username')
.mapObject(function(tasks) {
return _.chain(tasks)
.sortBy("dueDate")
.map(_.partial(
_.pick, _, ['title', 'dueDate'])
)
.take(5)
.value()
})
.value();
Filter, Group, Sort
ramda
Filter, Group, Sort
var sortUserTasks = R.compose(R.mapObj(sortByDate),
activeByUser);
var topFiveUserTasks = R.compose(
R.mapObj(R.take(5)), sortUserTasks
);
var importantFields = R.project(
['title', 'dueDate']
);
var topDataAllUsers = R.compose(
R.mapObj(importantFields), topFiveUserTasks
);
results = topDataAllUsers(tasks);
results
Filter, Group, Sort
{
Martha: [{
title: 'Oli ar fonid zu rupum vuwuidu mu racbam sa naliuf ralik zulde tac cijde tezgu ogu.',
dueDate: '7/10/2015'
}, {
title: 'Bet fuvnotpo wofizrak gonen ko hoj vijnurcu vafdose bip doffuphil tado fooj bapvaz nizsibak.',
dueDate: '7/18/2015'
}, {
title: 'Fat ge se arhohza tiomtah etacaw ikeutoji kacaz tibe odovahat vac sop inheri.',
dueDate: '8/18/2015'
}],
// ....
}
var formList = R.compose(
importantFields, R.take(5), sortByDateDescend
);
var byUser = R.useWith(R.filter, R.propEq("username"));
var topData = R.compose(formList, incomplete);
var topDataAllUsers = R.compose(
R.mapObj(formList), activeByUser
);
var myTasks = topData(byUser('me', tasks));
var allTasks = topData(tasks);
Perfomance
deck
By sashqa
deck
- 2,407