Lodash - A Functional JavaScript Library |
Written by Nikos Vaggalis |
Tuesday, 09 February 2016 |
Lodash began as a fork of the popular Underscore.js library but since then has managed to become its superset, adding new features and performing much better. Version 3.4.0 has recently been released.
It has sprung into existence because of the need for better and more agile modularization,closing the gap left behind by big libraries like jQuery. JQuery, being a massive library, made tapping into individual features difficult, requiring loading the whole of the library to get just to the little functionality needed. Certainly, you could get a custom-built library or go for a plug-in but in practice that proved ineffective. Lodash, on the other hand, offered much better modularity by breaking its functions into separate modules, available from within npm, despite the (minified) full library's size being just 19K. Like Jquery, Lodash also offers custom builds and, in case more fine-grained control is required, it also gives you the option to just import the functions you need by utilizing the import pragma: import { add } from 'lodash/fp'; Modularity is one thing,and another is the cleaner and more functional syntax that enables writing more succinct code. For example, to iterate over an array in Lodash's functional style compare: _.each([1, 2, 3], function(value, index) { console.log(value); }); // output: 1 2 3 against the native JavaScript object-oriented style: [1, 2, 3].forEach(function(value, index) { console.log(value); }); // output: 1 2 3 Despite the cleaner syntax, concern has been voiced that it's best to go for native functions to lessen dependability on external libraries and maximize portability across browsers. As a matter of fact, a GitHub repository You don't (may not) need Lodash/Underscore offers side by side comparisons of Lodash's functions against their native counterparts, just like the _.each vs forEach example above The response to that, however, is that in some cases Lodash's functions offer additional functionality and optimizations, leading to significant performance gains. A good overview and side by side benchmarks can be found at You don't (may not) know about Lodash/Underscore. In there we find that Lodash's _.each function outperforms its native forEach counterpart by 89% percent, because the former
// Underscore/Lodash _.each([1, 2, 3], function(value, index) { console.log(value); return false; }); // output: 1 // Native [1, 2, 3].forEach(function(value, index) { return false; // does not exit the iteration! }); // output: 1 2 3
In another example _.map vs .map we are pointed to the additional functionality : Native doesn't support the _.property iteratee shorthand. // Underscore/Lodash var users = [ { 'user': 'barney' }, { 'user': 'fred' } ]; var arr = _.map(users, 'user'); console.log(arr); // output: ['barney', 'fred'] // Native var users = [ { 'user': 'barney' }, { 'user': 'fred' } ]; var arr = users.map('user'); // error! If that wasn't enough in persuading you to get to grips with the library, there's also Lodash's author John-David Dalton testifying that "If you're only using a handful of methods on arrays and don't care about nullish guards, object iteration, smoothing over enviro/ES5/ES6 issues, FP goodies, iteratee shorthands, lazy evaluation, or other enhancements then built-ins are the way to go". In the case of the partial application of a function for example, Lodash offers the _.partial and That aside, there is a lot of praise for Loadash's simple templating engine because it allows using the full JavaScript's capabilities and syntax in writing your template;no DSL's here. The compiled template is transformed into a JavaScript function that ends up executed in the client to produce the final HTML Finally, yet another feature that is not much talked about in public, is the use of its _.escape function for sanitizing user-supplied input, therefore avoiding XSS injections. It's so useful that is mostly consumed as a standalone module.
More InformationRelated ArticlesJQuery 3.0 Beta Marks 10th Anniversary Cleaner, Leaner Ember.js 2.0 Released Functional JavaScript With Ramda
To be informed about new articles on I Programmer, sign up for our weekly newsletter,subscribe to the RSS feed and follow us on, Twitter, Facebook, Google+ or Linkedin.
Comments
or email your comment to: comments@i-programmer.info |
Last Updated ( Tuesday, 09 February 2016 ) |