How to work with both underscore and underscore.string at the same time?

Question

I am using underscore on my projects, but now I want to extend it a using the underscore.string

I read their documentation, and it seems I could have problems using both if I don't take the extra measures they say to take:

var _  = require('underscore');

// Import Underscore.string to separate object, because there are conflict functions (include, reverse, contains)
_.str = require('underscore.string');

// Mix in non-conflict functions to Underscore namespace if you want
_.mixin(_.str.exports());

// All functions, include conflict, will be available through _.str object
_.str.include('Underscore.string', 'string'); // => true

However, I don't have any idea of how to follow those steps, I need help understanding the steps to work with both and have no trouble using them.

So far, I have done this:

<script src="underscore-min.js" type="text/javascript"></script>
<script src="underscore.string.min.js" type="text/javascript"></script>

Also another related question, when I manage to work with both, must I always use _.str, or only on the conflicted functions?

Answer 1

The How-To use underscore.string is apparently written for usage in node.js, but as you want to use it within html/js you already started right by including those both libraries.

underscore will create the _ var and if that is present, underscore.string will extend that by a str and string property so you may use _.str already by including the two files.

<script src="underscore-min.js" type="text/javascript"></script>
<script src="underscore.string.min.js" type="text/javascript"></script>
<script type="text/javascript"> _.mixin(_.str.exports()) </script>

If you add that last line to your includes, you may use any non conflicting method from underscore.string which is all but include, contains and reverse according to the source file.

Hope that helps.

Answer 2

In version 3.x simply use the global s instead of _.mixin() to the underscore namespace.

Here are the changelog notes at Underscore.string

This is all you need for version 3.x

<script src="underscore-min.js" type="text/javascript"></script>
<script src="underscore.string.min.js" type="text/javascript"></script>

Usage as Underscore.js or Lo-Dash mixin is now discouraged as there is too many colliding methods

Answer 3

If you want to use _ rather than _.str on every function (even conflicted ones), you can dynamically pick between the conflicting methods based on the argument type:

(function(_contains, _include) {
    _.mixin(_.str.exports());
    _.mixin({
        reverse: function(obj) {
            if (typeof obj === "string") {
                return _.str.reverse(obj);
            }
            return obj.reverse();
        },
        contains: function(obj, value) {
            if (typeof obj === "string") {
                return _.str.contains(obj, value);
            }
            return _contains.apply(this, arguments);
        },
        include: function(obj, value) {
            if (typeof obj === "string") {
                return _.str.include(obj, value);
            }
            return _include.apply(this, arguments);
        }
    });
})(_.contains, _.include);