Javascriptで配列から空の要素を取り除く

JavaScriptで配列から空の要素を削除するには？

簡単な方法があるのでしょうか、それとも配列をループさせて手動で削除する必要があるのでしょうか？

Josh Lee
編集された質問 10日 2月 2018 в 11:18
プログラミング
arrays javascript node.js
11日 11月 2008 в 3:48
31 ビュー
ソリューション

EDIT: この質問は、約9年前、Array.prototypeにあまり便利な組み込みメソッドがなかった頃に答えられたものです。

今では、確かに、filterメソッドを使うことをお勧めします。

このメソッドは、あなたが提供するコールバック関数の基準を満たす要素を持つ_新しい配列_を返すことを覚えておいてください。

例えば、nullやundefinedの値を削除したい場合です。

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);

何をもって"empty"とするかにもよりますが、例えば文字列を扱うのであれば、上記の関数は空の文字列である要素を削除しません。

よく見かける典型的なパターンとしては、空文字列 "", 0, NaN, null, undefined, false などの falsy な要素を削除することです。

例えば、filterメソッドやBooleanコンストラクタ関数に渡したり、フィルタ基準関数で同じ要素を返したりすることができます。

var filtered = array.filter(Boolean);

または

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

どちらの場合も、最初のケースでは filter メソッドが Boolean コンストラクタを関数として呼び出して値を変換し、2番目のケースでは filter メソッドが内部的にコールバックの戻り値を暗黙のうちに Boolean にしているので、これは機能します。

疎な配列を扱っていて、"hole"を取り除こうとしている場合は、例えば、真を返すコールバックを渡すfilterメソッドを使うことができます。

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

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

古い答え： Don't do this!

私はこの方法で、ネイティブのArrayプロトタイプを拡張して使っています。

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);

あるいは、既存の要素を単純に別の配列に押し込むこともできます。

// 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,,,,]);
CMS
編集した答え 21日 8月 2019 в 12:02
解説 (18)

これまで提案されてきたようなループ＆スプライスを試すよりも、配列をループさせて、配列から残しておきたいアイテムを集めて新しい配列を作る方が簡単だと思うかもしれません。

次のような方法があります。

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

実際には、もっと一般的な解決策があります。

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]

アイデアがあれば、他のタイプのフィルタ関数を作ることができます。おそらく必要以上に多いと思いますが、私は寛大な気持ちでいました... ;)

Jason Bunting
編集した答え 11日 11月 2008 в 4:23
解説 (0)

これを試してみてください。 配列を渡すと、空の要素を削除して返してくれます。 *Jasonに指摘されたバグに対処するために更新されました。

function removeEmptyElem(ary) {
    for (var i = ary.length - 1; i >= 0; i--) {
        if (ary[i] == undefined)  {
            ary.splice(i, 1);
        }       
    }
    return ary;
}
blurfus
編集した答え 11日 8月 2016 в 12:09
解説 (5)