Another Javascript library.....Argh!!!!! Please!!!
I know guys, that you all have already come across scores of JavaScript libraries by now, but this one, my friends, is the one which you were missing while doing complex calculations and data processing.
UnderscoreJS might seem as yet another JavaScript framework, which you might not be interested in learning, when jQuery is almost catering to all your JS needs. However, you might be mistaken here, as frameworks like jQuery/mootools/ExtJs/Ember/Backbone/Angular......are meant to action on the front-end or simply, the DOM.
On the other hand, UnderscoreJS primarily focuses on easy handling of Objects and Arrays. Functions like filtering, array/object mapping, grouping, type checking etc, which you always longed for and which don't come along with the vanilla JavaScript, are available at your discretion with underscorejs.
If you come from PHP background(like me), you know that PHP provides out-of-the-box functions like array_map, array_keys, array_filter, foreach etc.
And while working with JavaScript, like me, you too always felt the need of such functions.
Don't worry then, UnderscoreJS is at your rescue. You just need to include the lightweight(the min.js file is only 5.7 KB) underscore.js in your page and you will love programming with Javascript more, and you will definitely love UnderscoreJS.
Please cut to the chase now, and show me some magic, would you?
Okay, here we go, check this out guys -
//create some random data
var obj = [{name: 'sandeep', month : 'sept', sales : 10},
{name: 'sandeep', month : 'sept', sales : 5},
{name: 'sandeep', month : 'oct', sales : 15},
{name: 'sandeep', month : 'oct', sales : 20},
{name: 'rajoria', month : 'sept', sales : 5},
{name: 'rajoria', month : 'sept', sales : 25},
{name: 'rajoria', month : 'oct', sales : 5},
{name: 'rajoria', month : 'oct', sales : 30},
{name: 'sandeep', month : 'sept', sales : 15}];
Lets say we want to group the data by month. Possibly an equivalent to the query
SELECT month, count(*) as size FROM tbl GROUP BY month ORDER BY size.
Then we only need to write these few lines -
var new_obj = _.chain(obj)
.groupBy("month")//this will create 2 objects with keys sept and oct and partition obj based on them
.map(function (value, key) {
return {month: key, size: _.size(value)};
})//process each value using the callback function like in PHP
.sortBy('size')//sort the result by size
.value();// return the value, required as we are using chain()
This will return the following -
[{ month="oct", size=4}, { month="sept", size=5}]
However if we want a equivalent to something like this
SELECT month, SUM(sales) as size FROM tbl GROUP BY month ORDER BY size
then we need to do the following -
var new_obj = _.chain(obj)
.groupBy("month")//this will create 2 objects with keys sept and oct and partition obj based on them
.map(function (value, key) {
return {month: key, size: _.reduce(value,
function (group_sum, val) {
return +group_sum + val['sales'];
},0)//reduces the list into a single value "group_sum"};
})//process each value using the callback function like in PHP
.sortBy('size')//sorts the result by the key size
.value();// return the value, required as we are using chain()
And see now what new_obj is -
[{ month="sept", size=60}, { month="oct", size=70}]
See how elegantly it is done, and doesn't it make your life so much easier. You need to start using it today.
Do check out the documentation to find more cool helper functions.
And while we are on it, you must also check Lo-Dash, a drop in replacement of UnderscoreJS, with all the underscore functions and many more on top of it, with improved speed and performance. Simply replace the underscore.min.js with the lodash.min.js and you are good to go, all the UnderscoreJS functions will still work.
I personally use Lo-Dash in all my projects, considering the performance benefits.
Happy coding folks!!
Sandeep
P.S. - Don't forget to check my Visualization App here, where I have extensively used UnderscoreJS(actually Lo-Dash).
Comments