JavaScript Array concat() Method

Beginner
5 min read
Updated: Nov 2026
3 examples
Array
Decorative image with the word CONCAT

Definition

Array.prototype.concat(...items) builds a new array by joining the calling array with other arrays or values. Sources stay unchanged — unlike push.

Remember
array.concat(item1, item2, …)

arrays  → elements copied in (one level)
values  → appended as single elements

returns a new array
originals are never mutated
nested arrays are NOT deep-cloned

Syntax

Call array.concat. Start with this line.

JavaScript
array.concat(a, b, …)
CallWhat it does
array.concat(a, b, …)Primary signature.
array.concat(...)Call with the arguments your case needs.

Built into JavaScript. Call concat(...) on an array instance — no import required.

Library declarations
JavaScript
array.concat(a, b, …)

Parameters

ParameterDescription
Calling arrayRequired. Left side of the merge
...itemsOptional. Arrays to expand or values to append

Return Value

Return ValueDescription
*Brand-new array — assign it

JavaScript Examples

Example 1 — Merge Two Arrays

Combine fruits1 and fruits2 into a new list.

JavaScript
const fruits1 = ["apple", "orange"];
const fruits2 = ["banana", "grape"];

const merged = fruits1.concat(fruits2);

console.log(merged);
// ["apple", "orange", "banana", "grape"]
console.log(fruits1);
// ["apple", "orange"]  — unchanged
Try It Yourself

How It Works

  1. Start with two lists. fruits1 is the caller; fruits2 is the argument.
  2. Build a new array. concat copies fruits1, then appends every item from fruits2.
  3. Use the return value. Store it in merged — that is the combined list.
  4. Sources stay safe. fruits1 and fruits2 are not modified.

Example 2 — Merge Three Arrays at Once

Pass several array arguments in one concat call.

JavaScript
const fruits1 = ["apple", "orange"];
const fruits2 = ["banana", "grape"];
const more = ["kiwi", "mango"];

const merged = fruits1.concat(fruits2, more);

console.log(merged);
// ["apple", "orange", "banana", "grape", "kiwi", "mango"]
Try It Yourself

How It Works

  1. One call, many sources. Arguments are handled left to right.
  2. Expand each array. First fruits2, then more.
  3. Same as chaining. Equivalent to fruits1.concat(fruits2).concat(more), but shorter.
  4. Still non-mutating. All three input arrays stay as they were.

Example 3 — Append Values and Arrays

Non-array arguments become single elements; arrays still expand one level.

JavaScript
const nums = [1, 2];
console.log(nums.concat(3, 4, 5));
// [1, 2, 3, 4, 5]

const mixed = ["a", "b"].concat("sep", ["c", "d"]);
console.log(mixed);
// ["a", "b", "sep", "c", "d"]
Try It Yourself

How It Works

  1. Numbers append as values. 3, 4, and 5 each become one slot.
  2. Strings work the same. "sep" is one element, not split into characters.
  3. Arrays expand once. ["c", "d"] contributes "c" and "d".
  4. Nesting stays nested. A deeper array inside an argument would remain an array item — use flat for more levels.
Compatibility

Browser & Runtime Support

Array.prototype.concat() is one of the oldest array methods, available since JavaScript 1.2 / ES3.

✓ Baseline · ES3

Array.prototype.concat()

Supported in every browser that ships JavaScript arrays, including Internet Explorer, and all Node.js versions.

100% Universal support
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Bun Supported · JavaScript runtime
Supported
Deno Supported · JavaScript runtime
Supported
Node.js Supported · Server runtime
Supported
Android WebView Supported · Modern WebView
Full support
Array.concat() Universal

Bottom line: Safe to use in any environment. No polyfill needed.

Frequently Asked Questions

concat() merges the calling array with zero or more arrays or values and returns a new array. The original arrays are not modified.
No. concat() always returns a fresh array. Source arrays keep their original elements and order.
Shallow. Nested arrays and objects are copied by reference into the new array—inner structures are shared, not cloned.
[...a, ...b] builds a new array similarly and is idiomatic in modern JavaScript. concat() accepts multiple arguments in one call and works the same way on the Array prototype.
Yes. Each non-array argument is appended as a single element. Array arguments are expanded one level into the result.
Only one level. [1].concat([2, [3]]) yields [1, 2, [3]]. Use flat() when you need deeper flattening.

Next: copyWithin()

Learn how to copy a sequence of elements to another index in the same array.

copyWithin() tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

JavaScript Array at() Method JavaScript Array copyWithin() Method