Suggest an edit

Improve this article

Refine the answer for “push() vs concat()”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

The `push()` and `concat()` methods are indeed similar - both **add elements to an array**,
but they do it **in completely different ways**.

## 1. `push()` - changes (mutates) the original array

```javascript
const arr = [1, 2];
arr.push(3);

console.log(arr); // [1, 2, 3]
```

- Adds element(s) **to the end of the original array**.
- **Changes** (mutates) the original array.
- **Returns the new length** of the array, not the array itself.

```javascript
const len = arr.push(4, 5);
console.log(len); // 5
console.log(arr); // [1, 2, 3, 4, 5]
```

## 2. `concat()` - creates a new array (does not mutate)

```javascript
const arr = [1, 2];
const newArr = arr.concat(3);

console.log(arr);     // [1, 2] - the original did not change
console.log(newArr);  // [1, 2, 3]
```

- **Does not change** the original array.
- Returns a **new array**.
- You can merge **several arrays or individual values**:

```javascript
  const a = [1, 2];
  const b = [3, 4];
  const c = a.concat(b, 5, [6, 7]);

console.log(c); // [1, 2, 3, 4, 5, 6, 7]
  ```

## Behavior comparison

| Property | `push()` | `concat()` |
| --- | --- | --- |
| Changes the original array | Yes | No |
| Returns | New length | New array |
| Accepts | One or several **elements** | Arrays and/or elements |
| Creates a copy | No | Yes |
| Mutation | Yes | No |
| Typical task | Add an element to an existing array | Merge arrays |

## Example of the difference:

```javascript
const arr = [1, 2];
const arr2 = [3, 4];

// push()
arr.push(...arr2);
console.log(arr); // [1, 2, 3, 4] (the array changed)

// concat()
const combined = arr.concat(arr2);
console.log(combined); // [1, 2, 3, 4]
console.log(arr);      // [1, 2] (the original was left untouched)
```

## In short:

| Characteristic | `push()` | `concat()` |
| --- | --- | --- |
| Mutates the array | Yes | No |
| Returns | a number (`length`) | a new array |
| Adds at the end | Yes | Yes |
| Can add another array | Yes (via `...spread`) | Yes, directly |
| Use when | changing the current array | creating a new one |

> **Conclusion:**
>
> - If you need to **change** the current array, use `push()`.
> - If you need to **create a new one** without touching the old one, use `concat()`.

Markdown · drag & drop images · ⌘B / ⌘I shortcuts411 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.