从数组中删除元素，直到只有10个元素

Question

I have an array of objects in Javascript that look like this:

[{width:100,height:50,name:"John"},{width:27,height:12,name:"John"},..]

If that Array size is bigger than 10, I would like to remove those objects which area (width*height) are smaller. So, if there are 20 objects, remove the 10 which area are smaller among the rest.

How could I do this?

Right now what I do is have a threshold in order to filter the objects. So I do this:

var i = elements.length;
var threshold = 100;
while (i--) {
  if (elements[i].width * elements[i].height < threshold) {
    elements.splice(i,1);
  }
}

But this is not what I want. I don't want a static threshold, I just want to remove those which area is smaller than the rest top 10.

Answer 1

You can sort your array first by area and then use slice to leave only 10 bigger. Something like this:

var arr = arr.sort(function(a, b) {
    var as = a.width * a.height,
        bs = b.width * b.height;
    if (as > bs) return -1;
    if (as < bs) return 1;
    return 0; 
})
.slice(0, 10);

Demo: http://jsfiddle.net/y765Z/

Answer 2

You could sort the array and then set its length to 10.

var areas = [{width:100,height:50,name:"John"},{width:27,height:12,name:"John"},...];

areas.sort(function(a, b){ 
    return  b.height * b.width - a.height * a.width;
});

areas.length = 10;

Note that this only works if you don't care if the array elements get reordered.

http://jsfiddle.net/g9Hk7/

Answer 3

One other possibility, if you need to keep them in order is this somewhat strange little bit here:

arr.map(function(item, index) {
    return {index: index, area: item.height * item.width};
}).sort(function(a, b) {
    return b.area - a.area;
}).slice(10).sort(function(a, b) {
    return b.index - a.index;
}).reduce(function(arr, item) {
    arr.splice(item.index, 1);
    return arr;
}, arr);

This modifies the original array, but you can change that by replacing the last line with

}, clone(arr));

using some appropriate clone function, perhaps this:

var clone = function(obj) {return JSON.parse(JSON.stringify(obj));};

Obviously if you wanted to turn this into a function, you could generalize the 10 , and it would pretty easy to abstract from area into an arbitrary function on your objects as well.