JavaScriptのfilterでfalseが抽出できない。

Question

プログラミングの問題を解くサイトで問題を解いています。
与えられた配列の中の0を配列の末尾に移動するプログラムを作成しています。

例

moveZeros([false,1,0,1,2,0,1,3,"a"]) // returns[false,1,1,2,1,3,"a",0,0]

現在、以下のようなコードを書いているのですが、

var moveZeros = function (arr) {
  var org = arr.length;
  var res = arr.filter(x =>  ( x != 0 ||  x == false ) );
  var count = org - res.length
  for (var i = 0; i < count ; i++){
  res.push(0)
  }
  return res;
}

arrの配列が以下のとき、

[ 0, 1, null, 2, false, 1, 0 ]

現行のコードだと、返り値が

[1,null,2,1,0,0,0]

となり、falseが抜けてしまいます。

arr.filter(x =>  ( x != 0 ||  x == false ) );

ではfalseは抽出できないということでしょうか？
「filter 複数条件」などで検索しても情報が出てこないため質問させていただきました。

Answer 1

そもそもご提示のコードを動かすと、コメントどおりの値が返ってきません。そのままの姿で返ってきます。なぜなら、x != 0 || x == false はすべてを通しているからです。

---

ゆるやかな比較 (== または != での比較) をするとき、その左辺と右辺の値は自動的に変換されてから比較されます (MDM)
ご提示の配列の中の値は、NullかNumberかBooleanですね。比較結果は下記の表のとおりになります。x != 0の結果か**x == falseの結果**のどちらかが常にtrueになっています。
これが原因で、そもそも var res = arr.filter(x => ( x != 0 || x == false ) ); は arr と全く変化せず、つまりその後のfor文の中も1度も実行されません (lengthが同じなのでcount が0になります)

左オペランド (arrの中身)	x != 0の結果	x == falseの結果
null (Null)	true	false
0 (Number)	0 !== 0 → false	0 == ToNumber(false) → true
1 (Number)	1 !== 0 → true	1 == ToNumber(false) → false
2 (Number)	2 !== 0 → true	2 == ToNumber(false) → false
true (Boolean)	ToNumber(true) !== 0 → 1 !== 0 → true	true === false → false
false (Boolean)	ToNumber(false) !== 0 → 0 !== 0 → false	false === false → true

---

あえて意図的に緩やかな比較にしたいときだけ緩やかな比較を使って、普段は厳密な比較 (=== または !== での比較) を使うことをおすすめします。
false をfilterの除去対象にしたいのか、残したいのかによって適切な比較文は異なりますが、

• falseも除去する場合 filter(x => !!x)
• falseを残す場合: filter(x => !!x || x === false)

がよいかと思います。!!xはあえて意図的に緩やかな比較を使っています。

Answer 2

arr.filter(x =>  ( x != 0 ||  x == false ) );

を

arr.filter(x =>  x !==0 );

にすることで解決しました。