# how array methods deal with "holes" ?

[JS](../../../..) ⟩ [object](../../../obj) ⟩ [built-in](../..) ⟩ [Array](..) ⟩ [sparse array]() ⟩ how array methods deal with "holes" ?&#x20;

{% tabs %}
{% tab title="👥 相關" %}
* [arr.removevalue](../ext/arr.removevalue "mention")
* [arr.removeundefined](../ext/arr.removeundefined "mention")
* [fill](../static-methods/fill "mention")
{% endtab %}

{% tab title="📗 參考" %}
* [ ] Better Programming ⟩ [What Are Holes in Arrays?](https://betterprogramming.pub/what-are-holes-in-arrays-3ac5fcbcd1c)
* [ ] [javascript-the-definitive-guide](../../../../../master/ref/javascript-the-definitive-guide "mention") ⟩&#x20;
  * [ ] 7.1.1 Array Literals
  * [ ] 7.3 Sparse Arrays
{% endtab %}

{% tab title="📘 手冊" %}
* [Array.prototype method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
{% endtab %}
{% endtabs %}

{% hint style="warning" %}
[**loops**](../../../../grammar/statement/loop) and [array methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) <mark style="color:yellow;">**treat**</mark> "<mark style="color:yellow;">**holes**</mark>" in <mark style="color:purple;">**sparse arrays**</mark> <mark style="color:red;">**differently**</mark>.

* [**for-of**](../../../../grammar/statement/loop/for/of)：<mark style="color:yellow;">**treats**</mark> "<mark style="color:yellow;">**holes**</mark>" as [**undefined**](../../../prim/undefined).
* `concat` — keeps holes
* `copyWithin` — holes are copied
* `entries`, `keys`, `values` — treats holes as `undefined`
* `every` — ignores holes
* `fill` — fills holes
* [**filter**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)： <mark style="color:red;">**removes**</mark> holes (its result is <mark style="color:yellow;">**always a "dense" array**</mark>).  :point\_right: [arr.filter](../method/arr.filter "mention")
* `find` — treats holes as elements
* `findIndex` — treats holes as elements
* [**flat**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat) - <mark style="color:red;">**removes**</mark> <mark style="color:yellow;">**holes**</mark> <mark style="color:red;">**but**</mark> <mark style="color:orange;">**keeps**</mark> [**undefined**](../../../prim/undefined).&#x20;
* [**forEach**](../../../../grammar/statement/loop/for/foreach)： <mark style="color:red;">**ignores**</mark> holes (closure not invoked).  :point\_right: [vs-foreach](../../../../grammar/statement/loop/for/of/vs-foreach "mention")
* `indexOf` — ignores holes
* `join` — converts holes to empty strings
* `lastIndexOf` — ignores holes
* [**map**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)： <mark style="color:yellow;">**preserves**</mark> holes (but <mark style="color:red;">**ignored**</mark> by mapping function)
* `pop` — treat holes as elements
* `push` — preserves holes
* `reduce` , `reduceRight`— ignores holes
* `reverse` — preserves holes
* `shift` — treat holes as `undefined`
* `slice` — preserves holes
* `sort` — preserves holes
* `toString` — preserves holes
* `unshift` — preserves holes
* `values` — converts holes to `undefined`
{% endhint %}
