Can you add to a string in javascript?

last modified June 16, 2022

JavaScript add strings tutorial shows how to concatenate strings in JavaScript.

In JavaScript, string is an object used to represent and manipulate a sequence of characters.

There are several ways of adding strings in JavaScript:

• + operator
• concat method
• join method
• formatting strings

JavaScript add strings with + operator

The easiest way of concatenating strings is to use the + or the += operator. The + operator is used both for adding numbers and strings; in programming we say that the operator is overloaded.

add_string.js

let a = 'old';
let b = ' tree';

let c = a + b;
console.log(c);

In the example, we add two strings with the + opeartor.

$ node add_string.js
old tree

In the second example, we use the compound addition operator.

add_string2.js

let msg = 'There are';

msg += ' three falcons';
msg += ' in the sky';

console.log(msg);

The example builds a message with the += operator.

$ node add_string2.js
There are three falcons in the sky

JavaScript add strings with join

The join method creates and returns a new string by concatenating all of the elements of an array.

joining.js

let words = ['There', 'are', 'three', 'falcons', 'in', 'the', 'sky'];

let msg = words.join(' ');
console.log(msg);

The example forms a message by concatenating words of an array.

$ node joining.js 
There are three falcons in the sky

JavaScript add strings with concat

The concat method concatenates the string arguments to the calling string and returns a new string.

Because the concat method is less efficient than the + operator, it is recommended to use the latter instead.

concat.js

let a = 'old';

let c = a.concat(' tree');
console.log(c);

The example concatenates two strings with the built-in concat method.

JavaScript add strings with string formatting

We can build JavaScript strings with string formatting, which is essentially another form of string addition.

formatting.js

let w1 = 'two';
let w2 = 'eagles';

let msg = `There are ${w1} ${w2} in the sky`;
console.log(msg);

The example builds a message using template literals.

$ node formatting.js 
There are two eagles in the sky

In this article, we have presented several ways of concatenating strings in JavaScript.

List all JavaScript tutorials.

Jul 29, 2019

There are 3 ways to concatenate strings in JavaScript. In this tutorial, you'll the different ways and the tradeoffs between them.

The + Operator

The same + operator you use for adding two numbers can be used to concatenate two strings.

const str = 'Hello' + ' ' + 'World';
str; // 'Hello World'

You can also use +=, where a += b is a shorthand for a = a + b.

let str = 'Hello';
str += ' ';
str += 'World';
str; // 'Hello World'

If the left hand side of the + operator is a string, JavaScript will coerce the right hand side to a string. That means it is safe to concatenate objects, numbers, null, and undefined.

let str = 'Values: ';
str += 42;
str += ' ';

str += {};
str += ' ';

str += null;

str; // 'Values: 42 [object Object] null'

The + and += operators are fast on modern JavaScript engines, so no need to worry about something like Java's StringBuilder class.

Array#join()

The Array#join() function creates a new string from concatenating all elements in an array. For example:

['Hello', ' ', 'World'].join(''); // 'Hello World'

The first parameter to join() is called the separator. By default, the separator is a single comma ','.

['a', 'b', 'c'].join(); // 'a,b,c'

You can pass in any separator you want. Separators make Array#join() the preferred choice for concatenating strings if you find yourself repeating the same character over and over again. For example, you can use ' ' as the separator to join an array of words:

// 'Twas the night before Christmas'
['Twas', 'the', 'night', 'before', 'Christmas'].join(' ');

Or you can use '/' to join together URL fragments:

// 'masteringjs.io/tutorials/fundamentals/string-concat'
['masteringjs.io', 'tutorials', 'fundamentals', 'string-concat'].join('/');

Separators make Array#join() a very flexible way to concatenate strings. If you want to join together a variable number of strings, you should generally use join() rather than a for loop with +.

String#concat()

JavaScript strings have a built-in concat() method. The concat() function takes one or more parameters, and returns the modified string. Strings in JavaScript are immutable, so concat() doesn't modify the string in place.

const str1 = 'Hello';
const str2 = str1.concat(' ', 'World');

// 'Hello'. Strings are immutable, so `concat()` does not modify `str1`
str1;
// 'Hello World'
str2;

The downside of using concat() is that you must be certain str1 is a string. You can pass non-string parameters to concat(), but you will get a TypeError if str == null.

// If `str` is null or not a string, can't use `concat()`
const str = 'Values: ';

// 'Values: 42 null'
str.concat(42, ' ', null);

The concat() function is rarely used because it has more error cases than the + operator. For example, you would get unexpected behavior if you call concat() on a value that happens to be an array. You should use + instead of concat() unless you have a very good reason.

If you must use concat(), it is usually best to call it on an empty string:

''.concat('Hello', ' ', 'World');

More Fundamentals Tutorials

• Calculate the Median of an Array in JavaScript
• The encodeURIComponent() Function in JavaScript
• How to Check if a Date is Between Two Dates in JavaScript
• Check a String for Numbers in JavaScript
• Rename Variables When Using Object Destructuring in JavaScript
• Split on Multiple Characters in JavaScript
• Empty Objects are Truthy in JavaScript?

How do you add to a string?

Can we add in string in Java?

Can number be added to string?

What is string addition operator in JavaScript?