javascript оставить максимум 3 вхождения одного и того же объекта в массиве

Question

Если я заполняю массив пар (внутри get json) примерно так:

var arrItems = [];
for (let y=0; y<50 ;y++){
    var titl = data.item[y].name;
    var img = data.item[y].image[0].url;
    arrItems.push({t:titl,i:img});
}

Как я могу отфильтровать его, чтобы оставить только 3 пары, где value одинаково?

Пример:

arrItems = [
    {t:one,i:square.jpg},
    {t:two,i:square.jpg},
    {t:three,i:square.jpg},
    {t:four,i:square.jpg},
    {t:five,i:triangle.jpg}
];

Становится

arrItems = [
    {t:one,i:square.jpg},
    {t:two,i:square.jpg},
    {t:three,i:square.jpg},
    {t:five,i:triangle.jpg}
];

И JavaScript, или jQuery в порядке.

Answer 1

Могут быть и более эффективные способы ее написания, но я думаю, что проще всего понять простую итерацию со счетом:

var counts = {};
for (var i = 0; i < arrItems.length; i++) {
    var item = arrItems[i];
    var count = counts[item.i] || 0;
    if (count >= 3) {
        arrItems.splice(i, 1);
        i--;
    } else {
        counts[item.i] = ++count;
    }
}

Answer 2

Вы можете использовать уменьшить функцию

    var arrItems = [
        {t:'one',i:'square.jpg'},
        {t:'two',i:'square.jpg'},
        {t:'three',i:'square.jpg'},
        {t:'four',i:'square.jpg'},
        {t:'five',i:'triangle.jpg'}
    ];

    var output = arrItems.reduce((acc, {t,i})=>{
        acc['mem'][i] = (acc['mem'][i] || 0) + 1;
        acc['mem'][i] <= 3 ? acc['output'].push({t, i}) : ''; 
        return acc;
    }, {'mem':{}, 'output':[]});

console.log(output);

Answer 3

Вы можете взять хеш-таблицу и сосчитать вхождения искомого свойства и отфильтровать с максимальным значением.

var items = [{ t: 'one', i: 'square.jpg' }, { t: 'two', i: 'square.jpg' }, { t: 'three', i: 'square.jpg' }, { t: 'four', i: 'square.jpg' }, { t: 'five', i: 'triangle.jpg' }],
    count = {},
    result = items.filter(({ i }) => {
        count[i] = (count[i] || 0) + 1;
        return count[i] <= 3;
    });

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }