it-swarm.com.de

Entfernen Sie leere Elemente aus einem Array in Javascript

Wie entferne ich leere Elemente aus einem Array in JavaScript? 

Gibt es einen einfachen Weg, oder muss ich ihn durchlaufen und manuell entfernen?

821
Tamas Czinege

EDIT: Diese Frage wurde vor fast 9 Jahren beantwortet, als der Array.prototype nicht viele nützliche integrierte Methoden enthielt.

Nun würde ich Ihnen sicherlich empfehlen, die filter-Methode zu verwenden.

Beachten Sie, dass diese Methode Ihnen ein neues Array mit den Elementen zurückgibt, die die Kriterien der von Ihnen bereitgestellten Rückruffunktion erfüllen, z. B. wenn Sie null- oder undefined-Werte entfernen möchten: 

var array = [0, 1, null, 2, "", 3, undefined, 3,,,,,, 4,, 4,, 5,, 6,,,,];

var filtered = array.filter(function (el) {
  return el != null;
});

console.log(filtered);

Es hängt davon ab, was Sie als "leer" betrachten. Wenn Sie beispielsweise mit Strings arbeiten, würde die obige Funktion keine leeren Elemente entfernen.

Ein häufig verwendetes Muster ist das Entfernen von Elementen, die falsy sind. Dazu gehört eine leere Zeichenfolge "", 0, NaN, null, undefined und false.

Sie können einfach an die filter-Methode, die Boolean-Konstruktorfunktion übergeben, oder dasselbe Element in der Filterkriterienfunktion zurückgeben, z. B.

var filtered = array.filter(Boolean);

Oder

var filtered = array.filter(function(el) { return el; });

Dies funktioniert auf beide Arten, da die filter-Methode im ersten Fall den Boolean-Konstruktor als Funktion aufruft und den Wert konvertiert. Im zweiten Fall konvertiert die filter-Methode den Rückgabewert des Callbacks implizit in Boolean.

Wenn Sie mit spärlichen Arrays arbeiten und versuchen, die "Löcher" zu beseitigen, können Sie einfach die filter-Methode übergeben und einen Rückruf übergeben, der true zurückgibt. Beispiel:

var sparseArray = [0, , , 1, , , , , 2, , , , 3],
    cleanArray = sparseArray.filter(function () { return true });

console.log(cleanArray); // [ 0, 1, 2, 3 ]

Alte Antwort: Tu das nicht!

Ich verwende diese Methode, um den Prototyp des nativen Arrays zu erweitern:

Array.prototype.clean = function(deleteValue) {
  for (var i = 0; i < this.length; i++) {
    if (this[i] == deleteValue) {         
      this.splice(i, 1);
      i--;
    }
  }
  return this;
};

test = new Array("", "One", "Two", "", "Three", "", "Four").clean("");
test2 = [1, 2,, 3,, 3,,,,,, 4,, 4,, 5,, 6,,,,];
test2.clean(undefined);

Oder Sie können die vorhandenen Elemente einfach in ein anderes Array verschieben:

// Will remove all falsy values: undefined, null, 0, false, NaN and "" (empty string)
function cleanArray(actual) {
  var newArray = new Array();
  for (var i = 0; i < actual.length; i++) {
    if (actual[i]) {
      newArray.Push(actual[i]);
    }
  }
  return newArray;
}

cleanArray([1, 2,, 3,, 3,,,,,, 4,, 4,, 5,, 6,,,,]);
633
CMS

Einfache Wege:

var arr = [1,2,,3,,-3,null,,0,,undefined,4,,4,,5,,6,,,,];


arr.filter(n => n)
// [1, 2, 3, -3, 4, 4, 5, 6]

arr.filter(Number) 
// [1, 2, 3, -3, 4, 4, 5, 6]

arr.filter(Boolean) 
// [1, 2, 3, -3, 4, 4, 5, 6]

oder - (nur für single -Array-Elemente vom Typ "Text")

['','1','2',3,,'4',,undefined,,,'5'].join('').split(''); 
// output:  ["1","2","3","4","5"]

oder - Klassischer Weg: einfache Iteration

var arr = [1,2,null, undefined,3,,3,,,0,,,[],,{},,5,,6,,,,],
    len = arr.length, i;

for(i = 0; i < len; i++ )
    arr[i] && arr.Push(arr[i]);  // copy non-empty values to the end of the array

arr.splice(0 , len);  // cut the array and leave only the non-empty values

arr // [1,2,3,3,[],Object{},5,6]


via jQuery:

var arr = [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,];

arr = $.grep(arr,function(n){ return n == 0 || n });

arr // [1, 2, 3, 3, 0, 4, 4, 5, 6]


UPDATE - ein weiterer schneller, cooler Weg (mit ES6):

var arr = [1,2,null, undefined,3,,3,,,0,,,4,,4,,5,,6,,,,], 
    temp = [];

for(let i of arr)
    i && temp.Push(i); // copy each non-empty value to the 'temp' array

arr = temp;
delete temp; // discard the variable

arr // [1, 2, 3, 3, 4, 4, 5, 6]

Leere Werte entfernen

['foo', '',,,'',,null, ' ', 3, true, [], [1], {}, undefined, ()=>{}].filter(String)

// ["foo", null, " ", 3, true, [1], Object {}, undefined, ()=>{}]
1230
vsync

Wenn Sie ALLE leeren Werte ("", null, undefined und 0) entfernen müssen: 

arr = arr.filter(function(e){return e}); 

So entfernen Sie leere Werte und Zeilenumbrüche:

arr = arr.filter(function(e){ return e.replace(/(\r\n|\n|\r)/gm,"")});

Beispiel:

arr = ["hello",0,"",null,undefined,1,100," "]  
arr.filter(function(e){return e});

Rückkehr:

["hello", 1, 100, " "]

UPDATE (basierend auf Alnitaks Kommentar)

In einigen Situationen möchten Sie möglicherweise "0" im Array behalten und alles andere entfernen (null, undefined und ""). Dies ist eine Möglichkeit:

arr.filter(function(e){ return e === 0 || e });

Rückkehr:

["hello", 0, 1, 100, " "]
216
lepe

Einfach ein Liner:

[1, false, "", undefined, 2].filter(Boolean); // [1, 2]

oder mit underscorejs.org :

_.filter([1, false, "", undefined, 2], Boolean); // [1, 2]
// or even:
_.compact([1, false, "", undefined, 2]); // [1, 2]
127
andlrc

Wenn Sie Javascript 1.6 oder höher haben, können Sie Array.filter verwenden, indem Sie eine triviale return true-Callback-Funktion verwenden, z.

arr = arr.filter(function() { return true; });

da .filter automatisch fehlende Elemente im ursprünglichen Array überspringt.

Die oben verlinkte MDN-Seite enthält auch eine Nice-Fehlerprüfungsversion von filter, die in JavaScript-Interpreters verwendet werden kann, die die offizielle Version nicht unterstützen.

Beachten Sie, dass dadurch weder null-Einträge noch Einträge mit einem expliziten undefined-Wert entfernt werden, sondern das OP speziell "fehlende" Einträge angefordert hat.

116
Alnitak

Die saubere Art, es zu tun.

var arr = [0,1,2,"Thomas","false",false,true,null,3,4,undefined,5,"end"];
arr = arr.filter(Boolean);
// [1, 2, "Thomas", "false", true, 3, 4, 5, "end"]
51
Tomás Senart

Zum Entfernen von Löchern sollten Sie verwenden

arr.filter(() => true)
arr.flat(0) // Currently stage 3, check compatibility before using this

Zum Entfernen von Löchern und Falschwerten (null, undefined, 0, -0, NaN, "", false, document.all):

arr.filter(x => x)

Zum Entfernen von Loch, Null und undefined:

arr.filter(x => x != null)

arr = [, null, (void 0), 0, -0, NaN, false, '', 42];
console.log(arr.filter(() => true)); // [null, (void 0), 0, -0, NaN, false, '', 42]
console.log(arr.filter(x => x)); // [42]
console.log(arr.filter(x => x != null)); // [0, -0, NaN, false, "", 42]

47
tsh

Einfaches ES6

['a','b','',,,'w','b'].filter(v => v);
28
ML13

Mit Unterstrich/Lodash:

Allgemeiner Anwendungsfall:

_.without(array, emptyVal, otherEmptyVal);
_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);

Mit Leergut:

_.without(['foo', 'bar', '', 'baz', '', '', 'foobar'], '');
--> ["foo", "bar", "baz", "foobar"]

Siehe lodash Dokumentation für ohne .

20
c4urself

Wenn die Verwendung einer Bibliothek eine Option ist, die ich kenne, hat Underscore.js eine Funktion namens compact () http://documentcloud.github.com/underscore/ , die auch andere nützliche Funktionen in Bezug auf Arrays und Sammlungen enthält.

Hier ist ein Auszug aus ihrer Dokumentation:

_.kompakt (Array) 

Gibt eine Kopie des Arrays zurück, wobei alle falschen Werte entfernt wurden. In JavaScript sind falsch, null, 0, "", undefined und NaN alle falsch.

_compact ([0, 1, false, 2, '', 3]);

=> [1, 2, 3]

15
Luis Perez

@Alnitak

Eigentlich funktioniert Array.filter auf allen Browsern, wenn Sie zusätzlichen Code hinzufügen. Siehe unten.

var array = ["","one",0,"",null,0,1,2,4,"two"];

function isempty(x){
if(x!=="")
    return true;
}
var res = array.filter(isempty);
document.writeln(res.toJSONString());
// gives: ["one",0,null,0,1,2,4,"two"]  

Dies ist der Code, den Sie für IE hinzufügen müssen, aber die Filter- und Funktionsprogrammierung ist imo wert.

//This prototype is provided by the Mozilla foundation and
//is distributed under the MIT license.
//http://www.ibiblio.org/pub/Linux/LICENSES/mit.license

if (!Array.prototype.filter)
{
  Array.prototype.filter = function(fun /*, thisp*/)
  {
    var len = this.length;
    if (typeof fun != "function")
      throw new TypeError();

    var res = new Array();
    var thisp = arguments[1];
    for (var i = 0; i < len; i++)
    {
      if (i in this)
      {
        var val = this[i]; // in case fun mutates this
        if (fun.call(thisp, val, i, this))
          res.Push(val);
      }
    }

    return res;
  };
}
14
Erik Johansson

Da niemand sonst etwas erwähnt hat und die meisten Leute in ihrem Projekt einen Unterstrich enthalten, können Sie auch _.without(array, *values); verwenden. 

_.without(["text", "string", null, null, null, "text"], null)
// => ["text", "string", "text"]
13
Josh Bedo

Nur ES6 und neuere Versionsmethode, davon aus, dass das Array unten ist:

 const arr = [1,2,3,undefined,4,5,6,undefined,7,8,undefined,undefined,0,9];

Einfacher Weg:

 const clearArray = arr.filter( i => i );
11
AmerllicA

Möglicherweise ist es einfacher, über das Array zu schleifen und aus den Elementen, die Sie im Array behalten möchten, ein neues Array aufzubauen, als durch Schleifen und Spleißen wie vorgeschlagen, da die Länge des Arrays während der Schleife geändert wurde vorbei kann probleme einführen.

Sie könnten so etwas tun:

function removeFalsyElementsFromArray(someArray) {
    var newArray = [];
    for(var index = 0; index < someArray.length; index++) {
        if(someArray[index]) {
            newArray.Push(someArray[index]);
        }
    }
    return newArray;
}

Hier ist eigentlich eine generische Lösung:

function removeElementsFromArray(someArray, filter) {
    var newArray = [];
    for(var index = 0; index < someArray.length; index++) {
        if(filter(someArray[index]) == false) {
            newArray.Push(someArray[index]);
        }
    }
    return newArray;
}

// then provide one or more filter functions that will 
// filter out the elements based on some condition:
function isNullOrUndefined(item) {
    return (item == null || typeof(item) == "undefined");
}

// then call the function like this:
var myArray = [1,2,,3,,3,,,,,,4,,4,,5,,6,,,,];
var results = removeElementsFromArray(myArray, isNullOrUndefined);

// results == [1,2,3,3,4,4,5,6]

Sie bekommen die Idee - Sie könnten dann andere Arten von Filterfunktionen haben. Wahrscheinlich mehr als du brauchst, aber ich fühlte mich großzügig ...;)

8
Jason Bunting

Was ist damit (ES6): So entfernen Sie den Falsy-Wert aus einem Array.

var arr = [0,1,2,"test","false",false,true,null,3,4,undefined,5,"end"];

arr.filter((v) => (!!(v)==true));

//output:

//[1, 2, "test", "false", true, 3, 4, 5, "end"]
6
VIJAY P

Sie sollten einen Filter verwenden, um ein Array ohne leere Elemente zu erhalten. Beispiel auf ES6 

const array = [1, 32, 2, undefined, 3];
const newArray = array.filter(arr => arr);
5
Gapur Kassym
var data = [null, 1,2,3];
var r = data.filter(function(i){ return i != null; })

console.log(r) 

[1,2,3]

3
KARTHIKEYAN.A

Bei der Verwendung der am besten bewerteten Antwort oben, dem ersten Beispiel, erhielt ich einzelne Zeichen für Stringlängen größer als 1. Nachfolgend finden Sie meine Lösung für dieses Problem.

var stringObject = ["", "some string yay", "", "", "Other string yay"];
stringObject = stringObject.filter(function(n){ return n.length > 0});

Anstatt nicht zurückzukehren, wenn undefined, kehren wir zurück, wenn die Länge größer als 0 ist. Hoffe, dass jemand da draußen hilft.

Kehrt zurück

["some string yay", "Other string yay"]
3
John Miller

Ich füge einfach meine Stimme zu dem obigen "Call ES5 Array..filter() with a global constructor" -Golf-Hack hinzu, aber ich schlage vor, Object anstelle von String, Boolean zu verwenden. oder Number wie oben vorgeschlagen.

Insbesondere wird die Funktion filter() von ES5 bereits nicht für undefined Elemente innerhalb des Arrays ausgelöst. Daher gibt eine Funktion, die allgemein true zurückgibt und all elements filter() hits zurück, notwendigerweise nur nonundefined elements zurück:

> [1,,5,6,772,5,24,5,'abc',function(){},1,5,,3].filter(function(){return true})
[1, 5, 6, 772, 5, 24, 5, 'abc', function (){}, 1, 5, 3]

Das Ausschreiben von ...(function(){return true;}) ist jedoch länger als das Schreiben von ...(Object); und der Rückgabewert des Konstruktors Object ist unter nter allen Umständen eine Art Objekt. Im Gegensatz zu den oben vorgeschlagenen primitiven Boxing-Konstruktoren ist kein möglicher Objektwert falsch, und daher ist Object in einer Booleschen Einstellung eine Abkürzung für function(){return true}.

> [1,,5,6,772,5,24,5,'abc',function(){},1,5,,3].filter(Object)
[1, 5, 6, 772, 5, 24, 5, 'abc', function (){}, 1, 5, 3]
3
ELLIOTTCABLE

Was ist das

js> [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,].filter(String).join(',')
1,2,3,3,0,4,4,5,6
2
JessyNinja

ES6: Lassen Sie newArr = arr.filter (e => e);

2
Kanan Farzali
var data= { 
    myAction: function(array){
        return array.filter(function(el){
           return (el !== (undefined || null || ''));
        }).join(" ");
    }
}; 
var string = data.myAction(["I", "am","", "working", "", "on","", "nodejs", "" ]);
console.log(string);

Ausgabe:

Ich arbeite an NodeJS

Es wird ein leeres Element aus dem Array entfernen und ein anderes Element anzeigen.

1
Jitendra virani

Das funktioniert, ich habe es in AppJet getestet (Sie können den Code auf seine IDE kopieren und einfügen und "reload" drücken, um zu sehen, dass es funktioniert, Sie müssen kein Konto erstellen.)

/* appjet:version 0.1 */
function Joes_remove(someArray) {
    var newArray = [];
    var element;
    for( element in someArray){
        if(someArray[element]!=undefined ) {
            newArray.Push(someArray[element]);
        }
    }
    return newArray;
}

var myArray2 = [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,];

print("Original array:", myArray2);
print("Clenased array:", Joes_remove(myArray2) );
/*
Returns: [1,2,3,3,0,4,4,5,6]
*/
1
Joe Pineda

Eine andere Möglichkeit besteht darin, die length-Eigenschaft des Arrays zu nutzen: Packen Sie die Nicht-Null-Elemente auf der linken Seite des Arrays und reduzieren Sie die Länge. Es ist ein In-Place-Algorithmus - weist keinen Speicher zu, ist für den Garbage-Collector zu schade-, und er hat ein sehr gutes Verhalten bei Best/Average/Worst-Case.

Im Vergleich zu anderen Lösungen ist diese Lösung in Chrome zwei- bis fünfzigmal und in Firefox fünf- bis fünfzigmal schneller, wie Sie hier sehen: http://jsperf.com/remove-null-items-from -array

Der folgende Code fügt dem Array die nicht aufzählbare 'removeNull'-Methode hinzu, die' this 'für die Verkettung zurückgibt: 

var removeNull = function() {
    var nullCount = 0           ;
    var length    = this.length ;
    for (var i=0, len=this.length; i<len; i++) { if (!this[i]) {nullCount++} }
    // no item is null
    if (!nullCount) { return this}
    // all items are null
    if (nullCount == length) { this.length = 0; return this }
    // mix of null // non-null
    var idest=0, isrc=length-1;
    length -= nullCount ;                
    while (true) {
         // find a non null (source) slot on the right
         while (!this[isrc])  { isrc--; nullCount--; } 
         if    (!nullCount) { break }       // break if found all null
         // find one null slot on the left (destination)
         while ( this[idest]) { idest++  }  
         // perform copy
         this[idest]=this[isrc];
         if (!(--nullCount)) {break}
         idest++;  isrc --; 
    }
    this.length=length; 
    return this;
};  

Object.defineProperty(Array.prototype, 'removeNull', 
                { value : removeNull, writable : true, configurable : true } ) ;
1
GameAlchemist
foo = [0, 1, 2, "", , false, 3, "four", null]

foo.filter(function(e) {
    return e === 0 ? '0' : e
})

kehrt zurück

[0, 1, 2, 3, "four"]
1
sqram

'Missbrauch' der for ... in (object-member) -Schleife . => Nur wahrheitsgemäße Werte erscheinen im Hauptteil der Schleife.

// --- Example ----------
var field = [];

field[0] = 'One';
field[1] = 1;
field[3] = true;
field[5] = 43.68;
field[7] = 'theLastElement';
// --- Example ----------

var originalLength;

// Store the length of the array.
originalLength = field.length;

for (var i in field) {
  // Attach the truthy values upon the end of the array. 
  field.Push(field[i]);
}

// Delete the original range within the array so that
// only the new elements are preserved.
field.splice(0, originalLength);
1
michael.zech

Dies könnte Ihnen helfen: https://lodash.com/docs/4.17.4#remove

var details = [
            {
                reference: 'ref-1',
                description: 'desc-1',
                price: 1
            }, {
                reference: '',
                description: '',
                price: ''
            }, {
                reference: 'ref-2',
                description: 'desc-2',
                price: 200
            }, {
                reference: 'ref-3',
                description: 'desc-3',
                price: 3
            }, {
                reference: '',
                description: '',
                price: ''
            }
        ];

        scope.removeEmptyDetails(details);
        expect(details.length).toEqual(3);

scope.removeEmptyDetails = function(details){
            _.remove(details, function(detail){
                return (_.isEmpty(detail.reference) && _.isEmpty(detail.description) && _.isEmpty(detail.price));
            });
        };
1
Sandeep M

Ungültige Einträge mit einem regulären Ausdruck herausfiltern

array = array.filter(/\w/);
filter + regexp
0
lcabral

Um leere Elemente am besten zu entfernen, verwenden Sie Array.prototype.filter() , wie bereits in anderen Antworten erwähnt.

Leider wird Array.prototype.filter() nicht vom IE <9 unterstützt. Wenn Sie weiterhin IE8 oder eine noch ältere Version des IE unterstützen müssen, können Sie die folgende polyfill verwenden, um in diesen Browsern Unterstützung für Array.prototype.filter() hinzuzufügen:

if (!Array.prototype.filter) {
  Array.prototype.filter = function(fun/*, thisArg*/) {
    'use strict';
    if (this === void 0 || this === null) {
      throw new TypeError();
    }
    var t = Object(this);
    var len = t.length >>> 0;
    if (typeof fun !== 'function') {
      throw new TypeError();
    }
    var res = [];
    var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
    for (var i = 0; i < len; i++) {
      if (i in t) {
        var val = t[i];
        if (fun.call(thisArg, val, i, t)) {
          res.Push(val);
        }
      }
    }
    return res;
  };
}
0
John Slegers

das ist meine lösung für saubere leere felder.

Ausgehend vom Gebührenobjekt: Nur verfügbares Attribut abrufen (mit Karte) Leere Felder filtern (mit Filter) Ergebnisse auf Ganzzahl analysieren (mit Karte)

fees.map( ( e ) => e.avail ).filter( v => v!== '').map( i => parseInt( i ) );
0

Wenn jemand das gesamte Array oder Objekt bereinigen möchte, kann dies helfen.

var qwerty = {
    test1: null,
    test2: 'somestring',
    test3: 3,
    test4: {},
    test5: {
        foo: "bar"
    },
    test6: "",
    test7: undefined,
    test8: " ",
    test9: true,
    test10: [],
    test11: ["77","88"],
    test12: {
        foo: "foo",
        bar: {
            foo: "q",
            bar: {
                foo:4,
                bar:{}
            }
        },
        bob: {}
    }
}

var asdfg = [,,"", " ", "yyyy", 78, null, undefined,true, {}, {x:6}, [], [2,3,5]];

function clean_data(obj) {
    for (var key in obj) {
        // Delete null, undefined, "", " "
        if (obj[key] === null || obj[key] === undefined || obj[key] === "" || obj[key] === " ") {
            delete obj[key];
        }
        // Delete empty object
        // Note : typeof Array is also object
        if (typeof obj[key] === 'object' && Object.keys(obj[key]).length <= 0) {
            delete obj[key];
        }
        // If non empty object call function again
        if(typeof obj[key] === 'object'){
            clean_data(obj[key]);
        }
    }
    return obj;
}

var objData = clean_data(qwerty);
console.log(objData);
var arrayData = clean_data(asdfg);
console.log(arrayData);

Ausgabe:

Entfernt alles, was null, undefined, "", " ", empty object oder empty array ist.

jsfiddle hier

0
Puni

Ein anderer Weg:

function filter_array(test_array) {
    var index = -1,
        arr_length = test_array ? test_array.length : 0,
        resIndex = -1,
        result = [];

    while (++index < arr_length) {
        var value = test_array[index];

        if (value) {
            result[++resIndex] = value;
        }
    }

    return result;
}
console.log(filter_array([NaN, 0, 15, false, -22, '',undefined, 47, null]));
0
stalinrajindian

verwenden Sie einen Filter, um eine leere Zeichenfolge im Array zu entfernen.

var s = [ '1,201,karthikeyan,K201,HELPER,[email protected],8248606269,7/14/2017,45680,TN-KAR24,8,800,1000,200,300,Karthikeyan,11/24/2017,Karthikeyan,11/24/2017,AVAILABLE\r',
  '' ]
var newArr = s.filter(function(entry) { return entry.trim() != ''; })

console.log(newArr); 

0
KARTHIKEYAN.A

Dieser entfernt nur leere Werte und nicht falsche Werte, was meiner Meinung nach wünschenswerter ist.

Es gibt eine Option zum Entfernen von Nullwerten.

Diese Methode sollte viel schneller sein als die Verwendung von Spleißen.

    function cleanArray(a, removeNull) {
        var i, l, temp = [];
        l = a.length;
        if (removeNull) {
            for (i = 0; i < l; i++) {
                if (a[i] !== undefined && a[i] !== null) {
                    temp.Push(a[i]);
                }
            }
        } else {
            for (i = 0; i < l; i++) {
                if (a[i] !== undefined) {
                    temp.Push(a[i]);
                }
            }
        }
        a.length = 0;
        l = temp.length;
        for (i = 0; i < l; i++) {
            a[i] = temp[i];
        }
        temp.length = 0;
        return a;
    }
    var myArray = [1, 2, , 3, , 3, , , 0, , null, false, , NaN, '', 4, , 4, , 5, , 6, , , , ];
    cleanArray(myArray);
    myArray;
0
Trevor