You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/05-data-types/04-array/article.md
+52-1Lines changed: 52 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -429,6 +429,53 @@ alert( "1" + 1 ); // "11"
429
429
alert( "1,2"+1 ); // "1,21"
430
430
```
431
431
432
+
## Dont compare arrays with ==
433
+
434
+
Arrays in JavaScript, unlike some other programming languages, shouldn't be compared with operator `==`.
435
+
436
+
This operator has no special treatment for arrays, it works with them as with any objects.
437
+
438
+
Let's recall the rules:
439
+
440
+
- Two objects are equal `==` only if they're references to the same object.
441
+
- 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>.
442
+
- ...With an exception of `null` and `undefined` that equal `==` each other and nothing else.
443
+
444
+
The strict comparison `===` is even simpler, as it doesn't convert types.
445
+
446
+
So, if we compare arrays with `==`, they are never the same, unless we compare two variables that reference exactly the same array.
447
+
448
+
For example:
449
+
```js run
450
+
alert( [] == [] ); // false
451
+
alert( [0] == [0] ); // false
452
+
```
453
+
454
+
These arrays are technically different objects. So they aren't equal. The `==` operator doesn't do item-by-item comparison.
455
+
456
+
Comparison with primitives may give seemingly strange results as well:
457
+
458
+
```js run
459
+
alert( 0== [] ); // true
460
+
461
+
alert('0'== [] ); // false
462
+
```
463
+
464
+
Here, in both cases, we compare a primitive with an array object. So the array `[]` gets converted to primitive and becomes an empty string `''`.
465
+
466
+
Then the comparison process goes on:
467
+
468
+
```js run
469
+
// [] converted to ''
470
+
alert( 0=='' ); // true, as '' becomes converted to number 0
471
+
472
+
alert('0'=='' ); // false, no type conversion, different strings
473
+
```
474
+
475
+
So, how to compare arrays?
476
+
477
+
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.
478
+
432
479
## Summary
433
480
434
481
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:
460
507
-`for (let item of arr)`-- the modern syntax for items only,
461
508
-`for (let i in arr)`-- never use.
462
509
463
-
We will return to arrays and study more methods to add, remove, extract elements and sort arrays in the chapter <info:array-methods>.
510
+
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.
511
+
512
+
Instead you can use `for..of` loop to compare arrays item-by-item.
513
+
514
+
We will continuewith arrays and study more methods to add, remove, extract elements and sort arrays in the next chapter <info:array-methods>.
Copy file name to clipboardExpand all lines: 1-js/05-data-types/05-array-methods/article.md
+9Lines changed: 9 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -742,6 +742,15 @@ These methods are the most used ones, they cover 99% of use cases. But there are
742
742
743
743
The function `fn` is called on each element of the array similar to `map`. If any/all results are `true`, returns `true`, otherwise `false`.
744
744
745
+
We can use `every` to compare arrays:
746
+
```js run
747
+
functionarraysEqual(arr1, arr2) {
748
+
returnarr1.length===arr2.length&&arr1.every((value, index) => value === arr2[index]);
749
+
}
750
+
751
+
alert( arraysEqual([1, 2], [1, 2])); // true
752
+
```
753
+
745
754
-[arr.fill(value, start, end)](mdn:js/Array/fill) -- fills the array with repeating `value` from index `start` to `end`.
746
755
747
756
-[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).
0 commit comments