Pin Me

How to Concat Variables in JavaScript

written by: vishalseafarer•edited by: Amber Neely•updated: 9/19/2010

Ever want to learn the basics of how to concatenate strings using variables in JavaScript? This article will show you how variables are concatenated using the Javascript variable concat method or using the simple concatenate operator (+).

  • slide 1 of 3

    What is Concatenation?

    Concatenation is the technique with which two or more variables are joined together. While using strings, one should be careful to use the escape character (\) whenever a ' or " (whichever is used to store the value of the string variable) is encountered. This tells the browser that the ' or " is to be printed on the webpage. If the escape character is not used, the browser will think that ' or " is a command to end the string.

  • slide 2 of 3

    Concatenating Variables in JavaScript: A Step by Step Example

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>

    <head>

    <title> Concatenating Variables </title>

    <script type="text/javascript">

    // Create two strings

    var string1 = "Hello";

    var string2 = "World!";

    // Create two numbers

    var num1 = 1;

    var num2 = 2;

    // Create a string that has a " symbol in it. Use the escape character to print the output

    var word = "Poly said, \"My name is Polly.\"";

    // Concatenate the strings using the + operator and store them in a variable

    var strings = string1 + string2;

    // Concatenate the strings using the concat() method and store them in a variable

    var concatstring = string1.concat(string2);

    // Use the + operatore between the two variables that have numbers for their values.

    var num = num1 + num2;

    document.writeln("Concatenating the Variables using the + operator");

    document.writeln("<br />");

    // Output the variable strings

    document.writeln(strings);

    document.writeln("<br />");

    document.writeln("<br />");

    document.writeln("Concatenating the Variables using the concat() method.");

    document.writeln("<br />");

    // Output the variable concatstring

    document.writeln(concatstring);

    document.writeln("<br />");

    document.writeln("<br />");

    // Now concate two or more variables using the concate() method.

    document.writeln("Concatenating more than two Variables using the concat() method.");

    document.writeln(string1.concat(string2, word));

    document.writeln("<br />");

    document.writeln("<br />");

    document.writeln("If the variables are numbers the + operator will sum the values. Thus the result of num1+num2 is ");

    // Output the variable num

    document.writeln(num);

    document.writeln("<br />");

    // Output the variable word

    document.writeln(word);

    //When the concat() method is used, the numbers are converted into strings and they are printed as strings.

    document.writeln("<br />");

    document.writeln("<br />");

    document.writeln("Concatenating the variables (irrespective whether they are strings or numbers) using the concat() method.");

    document.writeln("<br />");

    document.writeln(string1.concat(num1, num2));

    </script>

    </head>

    <body>

    </body>

    </html>

    concat 

  • slide 3 of 3

    Concatenating Variables in JavaScript: Explanation

    In the above self explanatory code, various variables have been created. Three variables are strings, one of them with the escape character (\) included so that the " in the string is printed in the webpage. Two more variables are numbers. The + operator illustrates how it acts as per the type of the variable. If the variables are strings, the + operator concatenates them. If the variables are numbers, the + operator adds the numbers. The + operator can be used to concatenate two or more strings.

    In the later part of the code, the concat() method is used to concatenate variables in Javascript. It takes any number of arguments. The advantage of using this method is, it converts all the variables to string (in the second example of the concat() method we have used the variables that have numbers for their values.)

    Thus it is recommended to use the concat() method to concatenate variables in Javascript.






© Copyright 2016 brighthub.com.