Free JavaScript course. Sign Up for tracking progress →

JavaScript: Concatenation

In web development, programs use strings constantly. Everything we see on websites is represented as text in one way or another. This text is most often dynamic, it's made up of different connected pieces. In programming, the operation of joining one string to another is called concatenation.

// The operator is the same as for adding
// but it has different semantics (meaning)

console.log('Dragon' + 'stone');
// => 'Dragonstone'

Strings always concatenate in the same order in which the operands are written. The left operand becomes the left part of the string, and the right one becomes the right part.

Here are a few more examples:

console.log('Kings' + 'wood');     // => Kingswood

// Reverse word order
console.log('road' + 'Kings');     // => roadKings

// Any string can be concatenated
console.log("King's" + 'Landing'); // => King'sLanding

As you can see, strings can concatenate even if they are written in different quotes.

In the last example, the name of the city has a misprint: King's Landing should be written with a space. But there were no spaces at the beginning of our strings, and the spaces left and right of the + don't matter because they are not part of the strings.

There are two ways to fix this:

// Both ways are functionally the same

// Put space in the end of the left part
console.log("King's " + 'Landing'); //  => King's Landing
// Put space in the beginning of the right part
console.log("King's" + ' Landing'); //  => King's Landing

A space is also a symbol. The more spaces you put, the wider the indentation will be:

console.log("King's " + ' Landing');   // => King's  Landing

console.log("King's  " + '  Landing'); // => King's    Landing


Print the following code

Winter came for the House of Frey.

using concatenation.

The exercise doesn't pass checking. What to do? 😶

If you've reached a deadlock it's time to ask your question in the «Discussions». How ask a question correctly:

  • Be sure to attach the test output, without it it's almost impossible to figure out what went wrong, even if you show your code. It's complicated for developers to execute code in their heads, but having a mistake before their eyes most probably will be helpful.
In my environment the code works, but not here 🤨

Tests are designed so that they test the solution in different ways and against different data. Often the solution works with one kind of input data but doesn't work with others. Check the «Tests» tab to figure this out, you can find hints at the error output.

My code is different from the teacher's one 🤔

It's fine. 🙆 One task in programming can be solved in many different ways. If your code passed all tests, it complies with the task conditions.

In some rare cases, the solution may be adjusted to the tests, but this can be seen immediately.

I've read the lessons but nothing is clear 🙄

It's hard to make educational materials that will suit everyone. We do our best but there is always something to improve. If you see a material that is not clear to you, describe the problem in “Discussions”. It will be great if you'll write unclear points in the question form. Usually, we need a few days for corrections.

By the way, you can participate in courses improvement. There is a link below to the lessons course code which you can edit right in your browser.


  • Type your code between the // BEGIN and // END lines in the editor.


  • Concatenation is the operation of joining two strings. For example, console.log("King's " + ' Landing');.

If you got stuck and don't know what to do, you can ask a question in our community