parent
b18b5ba761
commit
e76cf3a3c2
2 changed files with 61 additions and 1 deletions
|
@ -429,6 +429,53 @@ alert( "1" + 1 ); // "11"
|
|||
alert( "1,2" + 1 ); // "1,21"
|
||||
```
|
||||
|
||||
## Dont compare arrays with ==
|
||||
|
||||
Arrays in JavaScript, unlike some other programming languages, shouldn't be compared with operator `==`.
|
||||
|
||||
This operator has no special treatment for arrays, it works with them as with any objects.
|
||||
|
||||
Let's recall the rules:
|
||||
|
||||
- Two objects are equal `==` only if they're references to the same object.
|
||||
- If one of arguments of `==` is an object, and the other one is a primitive, then the object gets converted to primitive, as explained in the chapter <info:object-toprimitive>.
|
||||
- ...With an exception of `null` and `undefined` that equal `==` each other and nothing else.
|
||||
|
||||
The strict comparison `===` is even simpler, as it doesn't convert types.
|
||||
|
||||
So, if we compare arrays with `==`, they are never the same, unless we compare two variables that reference exactly the same array.
|
||||
|
||||
For example:
|
||||
```js run
|
||||
alert( [] == [] ); // false
|
||||
alert( [0] == [0] ); // false
|
||||
```
|
||||
|
||||
These arrays are technically different objects. So they aren't equal. The `==` operator doesn't do item-by-item comparison.
|
||||
|
||||
Comparison with primitives may give seemingly strange results as well:
|
||||
|
||||
```js run
|
||||
alert( 0 == [] ); // true
|
||||
|
||||
alert('0' == [] ); // false
|
||||
```
|
||||
|
||||
Here, in both cases, we compare a primitive with an array object. So the array `[]` gets converted to primitive and becomes an empty string `''`.
|
||||
|
||||
Then the comparison process goes on:
|
||||
|
||||
```js run
|
||||
// [] converted to ''
|
||||
alert( 0 == '' ); // true, as '' becomes converted to number 0
|
||||
|
||||
alert('0' == '' ); // false, no type conversion, different strings
|
||||
```
|
||||
|
||||
So, how to compare arrays?
|
||||
|
||||
That's simple: don't use the `==` operator. Instead, compare them item-by-item in a loop or using iteration methods explained in the next chapter.
|
||||
|
||||
## Summary
|
||||
|
||||
Array is a special kind of object, suited to storing and managing ordered data items.
|
||||
|
@ -460,4 +507,8 @@ To loop over the elements of the array:
|
|||
- `for (let item of arr)` -- the modern syntax for items only,
|
||||
- `for (let i in arr)` -- never use.
|
||||
|
||||
We will return to arrays and study more methods to add, remove, extract elements and sort arrays in the chapter <info:array-methods>.
|
||||
To compare arrays, don't use the `==` operator (as well as `>`, `<` and others), as they have no special treatment for arrays. They handle them as any objects, and it's not what we usually want.
|
||||
|
||||
Instead you can use `for..of` loop to compare arrays item-by-item.
|
||||
|
||||
We will continue with arrays and study more methods to add, remove, extract elements and sort arrays in the next chapter <info:array-methods>.
|
||||
|
|
|
@ -742,6 +742,15 @@ These methods are the most used ones, they cover 99% of use cases. But there are
|
|||
|
||||
The function `fn` is called on each element of the array similar to `map`. If any/all results are `true`, returns `true`, otherwise `false`.
|
||||
|
||||
We can use `every` to compare arrays:
|
||||
```js run
|
||||
function arraysEqual(arr1, arr2) {
|
||||
return arr1.length === arr2.length && arr1.every((value, index) => value === arr2[index]);
|
||||
}
|
||||
|
||||
alert( arraysEqual([1, 2], [1, 2])); // true
|
||||
```
|
||||
|
||||
- [arr.fill(value, start, end)](mdn:js/Array/fill) -- fills the array with repeating `value` from index `start` to `end`.
|
||||
|
||||
- [arr.copyWithin(target, start, end)](mdn:js/Array/copyWithin) -- copies its elements from position `start` till position `end` into *itself*, at position `target` (overwrites existing).
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue