JavaScriptで、インデックス番号を保持しつつ、配列からキーを削除するにはどうすればいいですか

Question

配列から指定したインデックス番号のキーを削除しつつ、インデックス番号の並びは詰めない(歯抜けさせる)、といったことがしたいです。

PHPで書けば、このような内容です

function adjustArray($array, $index)
{
  $newArray = array();
  foreach($array as $key => $value){
    if($key != $index){
      $newArray[$key] = $value;
    }
  }

  return $newArray;
}

$array = [0,0,0,0,0];

$array = adjustArray($array, 1);

var_dump($array);

array(4) {
  [0]=>
  int(0)
  [2]=>
  int(0)
  [3]=>
  int(0)
  [4]=>
  int(0)
}

$array = adjustArray($array, 2);

var_dump($array);

array(3) {
  [0]=>
  int(0)
  [3]=>
  int(0)
  [4]=>
  int(0)
}

$array = adjustArray($array, 3);

array(2) {
  [0]=>
  int(0)
  [4]=>
  int(0)
}

これと同等の動きを、JavaScriptで実現したいです。

JavaScriptの配列では実現が難しいでしょうか？

Comments

[maisumakun]

どういった目的でそのようなことがしたいのでしょうか。

[Zuishin]

配列ではできないけどオブジェクトまたは Map ならできます。目的によっては他の方法がふさわしいかもしれません。削除の代わりに undefined などを代入して削除マークとみなす方法もあります。

Answer 1

いちおう、deleteを使って無理やり歯抜け配列を作ることはできます…が、そのような配列はJavaScriptでは一般的ではありませんし、扱いづらいです。

const foo = [1, 2, 3];
delete foo[1];
console.log(foo[1]); // 存在しないけれど「undefined」となってしまう
console.log(foo.length); // 歯抜けとは関係なく「3」になる

Comments

[qwe001]

ご回答ありがとうございます。deleteは私も試しましたが、これですとご指摘の通り配列のlengthの値が変わりません。やりたいことは、配列から指定したキーを抜きつつ、残ったキーの数を数えてfor文のループを回すことです。Objectを使って実現可能でしょうか…？

[maisumakun]

.forEachは、deleteしたキーを飛ばして回っていきます。

> deleteは私も試しましたが

なら、その旨を質問時点で書いてほしかったです。

[退会済みユーザー]

undefind は未定義値
null は宣言されてるけど空

でdeleteは未定義にする

Answer 2

やりたいことは、配列から指定したキーを抜きつつ、残ったキーの数を数えてfor文のループを回すことです。Objectを使って実現可能でしょうか…？

ES6の範囲に限った方がよさそうですが、配列で概ね実現可能です。

a=[0,0,0,0,0]
console.log(Object.keys(a).length, a.length);
//5 5

delete a[1]; // 配列から指定したキーを抜きつつ、
console.log(Object.keys(a).length, a.length); // 残ったキーの数を数えて
//4 5

for ( var x in a ) console.log(x); // for文のループを回す
//0
//2
//3
//4

　
ただし、取扱注意です。
以下を読んで、きちんと理解してから使うことをお勧めします。たぶん、バグの温床になります。
ES6 以降は JavaScript のプロパティに順序は「ある」 - Qiita
[JavaScript] 疎な配列（Sparse Arrays） - Qiita

Comments

[qwe001]

ご回答ありがとうございます。こちらのやり方でやりたいことができました

Answer 3

インデックス番号を別途管理する必要がありますが、Mapが近いといえば近いです。

【Map - JavaScript | MDN】
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Map

Answer 4

スプレッド構文(…ってやつ)で配列からオブジェクトに変えれば良いのでは？
ただ、length取るにはひと手間かかります。

const foo = [1, 2, 3];
const fooObj = { ...foo };

console.log(fooObj); // { 0: 1, 1: 2, 2: 3 }

delete fooObj[1]

console.log(fooObj[1]); //undefind

console.log(fooObj); // { 0: 1, 2: 3 }
console.log(fooObj.length);//undefind
console.log(Object.keys(fooObj).length); //2

Answer 5

PHPはゆうなればすべての配列が連想配列なので歯抜けができます
javascriptの配列はキーが0から始まる連番なので配列としては
歯抜けにすることはできません

Comments

[yambejp]

どうしてもやりたければオブジェクトで処理することです
ただしオブジェクトはイテラブルではないので順序が保証されません

Answer 6

擬似的に・・・

function adjustArray(array, index)
{
  const newArray = [...array]
  delete newArray[index]
  return newArray
}

function var_dump(array)
{
  console.log(`array(${array.filter(v => v !== undefined).length}) {`)
  array.forEach((v, i) => v !== undefined && console.log(`  [${i}]=>\n  ${v}`))
  console.log('}')
}

let array = [0,0,0,0,0]

array = adjustArray(array, 1)

var_dump(array)

array = adjustArray(array, 2)

var_dump(array)

array = adjustArray(array, 3)

var_dump(array)