I have the following array:
var imagesList = [undefined x 1, cars.jpg, undefined x 1, boats.jpg];
How do I filter out the undefined? so I can get it as follows:
var imagesShow = [cars.jpg, boats.jpg];
I have not found much documentation on getting rid of undefined in an array using javascript.
You could use Array#filter with Boolean as callback for truthy values.
var imagesList = [undefined, 'cars.jpg', undefined, 'boats.jpg'],
imagesShow = imagesList.filter(Boolean);
console.log(imagesShow);Use Array#filter:
var imagesList = [undefined, 'cars.jpg', undefined, 'boats.jpg'];
var result = imagesList.filter(function(v) {
return v !== undefined;
})
console.log(result);Try using the Array.filter function
var imagesShow = imagesList.filter(function (value) {
return value != undefined;
};
Any array element that does not pass the check in the callback function above will be filtered out - in this case, if the element is undefined.
Use Array.Filter
var imagesList = [undefined, 'cars.jpg', undefined, 'boats.jpg'];
var result = imagesList.filter(function( element ) {
return element !== undefined;
});
console.log(result);Try Array.filter() method with ES6 Arrow function expression.
var imagesList = [undefined, "cars.jpg", undefined, "boats.jpg"];
var filteredList = imagesList.filter(item => { return item !== undefined });
console.log(filteredList);By displaying undefined x 2, your array clearly indicates that it's a sparse one which means you don't have any undefined items. You just don't have the keys to hold items to start with.
OK you may have and wish to keep proper void 0 or undefined items (in which case all of the above solutions will fail) or a numeric value 0 or null object item (in which case the accepted answer will fail).
In order to convert a sparse array to dense form the most efficient method would be a for in loop (or Object.keys()).
So for sparse array looping it's best to use
var res = [],
a = [];
a[1] = "cars.jpg";
a[5] = null;
a[999999] = "beauty.jpg";
// [undefined × 1, "cars.jpg", undefined × 3, null, undefined × 999993, "beauty.jpg"]
function dense(a){
var r = [];
for (i in a) r.push(a[i]);
return r;
}
console.time("test");
res = dense(a);
console.timeEnd("test");
console.log(res);Now lets compare the above code with an elegant filtering solution;
var res = [],
a = [];
a[1] = "cars.jpg";
a[5] = null;
a[999999] = "beauty.jpg";
// [undefined × 1, "cars.jpg", undefined × 3, null, undefined × 999993, "beauty.jpg"]
console.time("test");
res = a.filter(Boolean);
console.timeEnd("test");
console.log(res);So as you see null is disappeared and it is slower since it checks all non existing keys. However with for in loop keeping the falsey values or not is totally under your control.
undefined x 1?