Jquery Unique Objects Based On Specific Object Properties

I want an array of unique objects, removing duplicate objects which have some specific property values. For example: in the code snippet below, event1 and event2 have same title an

Solution 1:

Try this:

var event1 = {id: 1, title: 'ABC', start: '10'};
var event2 = {id: 2, title: 'ABC', start: '10'};
var event3 = {id: 3, title: 'DEF', start: '12'};
var event4 = {id: 4, title: 'DEF', start: '20'};

var events = [event1, event2, event3, event4];

var result = events.reduce(function(memo, e1){
  var matches = memo.filter(function(e2){
    return e1.title == e2.title && e1.start == e2.start
  })
  if (matches.length == 0)
    memo.push(e1)
    return memo;
}, [])

console.log(result)

Solution 2:

For documentation, using jQuery:

$.each(a, function(index, event) {
    var events = $.grep(b, function (e) {
        return event.title === e.title &&
            event.start === e.start;
    });
    if (events.length === 0) {
      b.push(event);
    }
});

See demo

Solution 3:

As a function:

functiondistinctArrayBy(arr, propName) {
    var result = arr.reduce(function (arr1, e1) {
        var matches = arr1.filter(function (e2) {
            return e1[propName] == e2[propName];
        })
        if (matches.length == 0)
            arr1.push(e1)
        return arr1;
    }, []);

    return result;
}

Distinct by multiple properties:

functiondistinctArrayBy(arr, propNames) {
    var result = arr.reduce(function (arr1, e1) {
        var matches = arr1.filter(function (e2) {
            var matchResult = true;
            $.each(propNames, function (index, value) {
                matchResult = matchResult && e1[value] == e2[value];
            });
            return matchResult;
        });
        if (matches.length == 0)
            arr1.push(e1)
        return arr1;
    }, []);

    return result;
}