Cant use deep-diff javascript functions

Question

Im trying to use a javascript package in my angularJS application. I have added the reference to my index.html

<script src="deep-diff-0.3.1.min.js"></script>

and i'm using there example in my controller :

var lhs = {
    name: 'my object',
    description: 'it\'s an object!',
    details: {
        it: 'has',
        an: 'array',
        with: ['a', 'few', 'elements']
    }
};

var rhs = {
    name: 'updated object',
    description: 'it\'s an object!',
    details: {
        it: 'has',
        an: 'array',
        with: ['a', 'few', 'more', 'elements', { than: 'before' }]
    }
};

var differences = diff(lhs, rhs);

But when i try to run my application i get the following error :

ReferenceError: diff is not defined

Ive tried pointing to all of the different versions and i have also tried installing through both bower and npm

Answer 1

I think you have to use this on your code:

var diff = require('deep-diff').diff;

You also can use the function bellow to do deep diff. I use it and works great:

var deepDiffMapper = function () {
    return {
        VALUE_CREATED: 'created',
        VALUE_UPDATED: 'updated',
        VALUE_DELETED: 'deleted',
        VALUE_UNCHANGED: 'unchanged',
        map: function (obj1, obj2) {
            if (this.isFunction(obj1) || this.isFunction(obj2)) {
                throw 'Invalid argument. Function given, object expected.';
            }

            if (this.isValue(obj1) || this.isValue(obj2)) {
                return {
                    type: this.compareValues(obj1, obj2),
                    data1: obj1,
                    data2: obj2
                };
            }

            var diff = {};
            for (var key in obj1) {
                if (this.isFunction(obj1[key])) {
                    continue;
                }

                var value2 = undefined;
                if ('undefined' != typeof (obj2[key])) {
                    value2 = obj2[key];
                }

                var m = this.map(obj1[key], value2);
                diff[key] = m;
            }

            for (var key in obj2) {
                if (this.isFunction(obj2[key]) || ('undefined' != typeof (diff[key]))) {
                    continue;
                }

                var m = this.map(undefined, obj2[key]);
                diff[key] = m;
            }

            return diff;

        },
        compareValues: function (value1, value2) {
            if (value1 === value2) {
                return this.VALUE_UNCHANGED;
            }
            if ('undefined' == typeof (value1)) {
                return this.VALUE_CREATED;
            }
            if ('undefined' == typeof (value2)) {
                return this.VALUE_DELETED;
            }

            return this.VALUE_UPDATED;
        },
        isFunction: function (obj) {
            return {}.toString.apply(obj) === '[object Function]';
        },
        isArray: function (obj) {
            return {}.toString.apply(obj) === '[object Array]';
        },
        isObject: function (obj) {
            return {}.toString.apply(obj) === '[object Object]';
        },
        isValue: function (obj) {
            return !this.isObject(obj) && !this.isArray(obj);
        },
        changed: function (m) {

            if (!this.isObject(m))
                return false;

            var c = false;
            var found = false;

            angular.forEach(m, function (value, key) {

                if (!found) {

                    if (deepDiffMapper.isObject(value))
                        c = (c || deepDiffMapper.changed(value));
                    else if (key == "type") {
                        c = (c || (value == "updated") || (value == "created") || (value == "deleted"));
                    }

                    if (c) {
                        found = true;
                    }
                }
            });

            return c;
        }
    }
}();