JavaScript String concat(): Join Strings

concat() joins two or more strings and returns a new string. It does not change any of the original strings.

const first = "Hello ";
const second = "World";
const result = first.concat(second);
console.log(result); // Hello World

concat() Syntax Top ↑

string.concat(value1, value2, value3)

Join Multiple Strings with concat() Top ↑

This modernizes the original three-part example.

const part1 = "Hello Welcome";
const part2 = " to plus2net.com";
const part3 = " JavaScript Section";
const message = part1.concat(part2, part3);
console.log(message);

You can also begin from an empty string, as shown on the original page:

let text = "";
text = text.concat("First one", " Second One", " Third one");
console.log(text);

Join Strings with the + Operator Top ↑

const message = part1 + part2 + part3;
console.log(message);

For simple concatenation, + is common and easy to read.

Append Text with += Top ↑

The original page also demonstrated progressively adding text.

let message = "";
message += "Hello Welcome";
message += " to plus2net.com";
message += " JavaScript Section";
console.log(message);

Template Literals for Interpolated Text Top ↑

When values need to be embedded in readable text, template literals are often clearer.

const site = "plus2net.com";
const section = "JavaScript";
const message = `Welcome to ${site} - ${section} Section`;
console.log(message);

concat() Converts Non-String Values to Text Top ↑

const result = "Total: ".concat(25);
console.log(result); // Total: 25

Be careful with the + operator because it can perform numeric addition or string concatenation depending on operand types.

concat() Does Not Change the Original String Top ↑

const original = "Hello";
const combined = original.concat(" World");
console.log(original); // Hello
console.log(combined); // Hello World

Choosing concat(), +, += or Template Literals Top ↑

Choose the form that makes the code easiest to understand. Use template literals for interpolation, + for simple combinations, and concat() when its method form suits the operation. For building very large collections of fragments, collecting them in an array and using join() can also be convenient.

Common String Concatenation Mistakes Top ↑

• Forgetting spaces between fragments.
• Expecting concat() to modify the original string.
• Mixing numbers and strings with + without considering coercion.
• Using repeated concatenation where a template literal would communicate the intent more clearly.

← String Reference Lowercase Strings →

Subhendu Mohapatra

Author & Instructor at plus2net

I write and maintain practical tutorials on Python, PHP, SQL, JavaScript, HTML, jQuery, and web development at plus2net. The tutorials focus on clear explanations, working examples, and code that readers can test and adapt while learning.

About the author   Watch on YouTube

Connect: