Jobs Hub

JavaScript String (with Examples)

String in JavaScript is a sequence of characters, used to hold/store textual data.

Create a String in JavaScript

To create a string in JavaScript, follow any of the two ways:

For example:

let x = "fresherearth";
let y = "JavaScript is Fun.";

Or

let x = new String("fresherearth");
let y = new String("JavaScript is Fun.");

String in JavaScript can contain zero, one, or more sequence of characters. Also a string literals in JavaScript, will be in single or double quotes. For example:

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>

   <p id="para1"></p>
   <p id="para2"></p>
   <p id="para3"></p>
   <p id="para4"></p>
   <p id="para5"></p>
   <p id="para6"></p>
   <p id="para7"></p>

   <script>
      let myString1 = "";
      let myString2 = '';
      let myString3 = "c";
      let myString4 = "5";
      let myString5 = 'g';
      let myString6 = "I'm from Boston";
      let myString7 = "Where are you from?";
      
      document.getElementById("para1").innerHTML = typeof(myString1);
      document.getElementById("para2").innerHTML = typeof(myString2);
      document.getElementById("para3").innerHTML = typeof(myString3);
      document.getElementById("para4").innerHTML = typeof(myString4);
      document.getElementById("para5").innerHTML = typeof(myString5);
      document.getElementById("para6").innerHTML = typeof(myString6);
      document.getElementById("para7").innerHTML = typeof(myString7);
   </script>
   
</body>
</html>
Output

Please note: The typeof() method returns the type of value/variable defined as its argument.

How to Quote Substring in JavaScript String?

If the quote you're going to use to quote any substring inside a string, does not match the quote used to quote the string literal, then it will be Okay. For example:

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>

   <p id="para1"></p>
   <p id="para2"></p>

   <script>
      let myString1 = "Hey, I am from 'Boston'. Where are you from?";
      let myString2 = 'Hey, I am from "Boston". Where are you from?';
      
      document.getElementById("para1").innerHTML = myString1;
      document.getElementById("para2").innerHTML = myString2;
   </script>
   
</body>
</html>
Output

But sometime we find that the quote of the string literal is same as the quote that we're needing to use. For example:

'Hey, I'm from Boston.'

Notice the single quote in between I and m. The solution is, to use escape sequence. For example:

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>

   <p id="xyz"></p>

   <script>
      let mystr = 'Hey, I\'m from Boston.';
      document.getElementById("xyz").innerHTML = mystr;
   </script>
   
</body>
</html>
Output

That is, the backslash character (\) is used in all these type of similar scenarios. Also, if you need to include a backslash itself in the string. Then in that case, use double backslashes (\\). For example:

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>

   <p id="xyz"></p>

   <script>
      let mystr = 'Hello\\Hi';
      document.getElementById("xyz").innerHTML = mystr;
   </script>
   
</body>
</html>
Output

JavaScript Escape Characters

Here are the list of escape characters used in JavaScript:

Since these escape characters are developed to work with printers, fax machines etc. which does not make sense specially while working with HTML. Therefore I am unable to show you the examples regarding these characters. But remember its description.

JavaScript String Methods

Here are the list of methods that can be used with JavaScript string, along with its description:

Please note: A few methods, which are very rarely used in rare cases, are skipped.

JavaScript String Example

HTML with JavaScript Code
<!DOCTYPE html>
<html>
<body>

   <script>
      let x, res, temp;
      function myFun()
      {
         x = document.getElementById("str").value;
         temp = document.getElementById("mypara");
         temp.style.display = "block";
         res = x.toUpperCase();
         document.getElementById("result").innerHTML = res;
      }
   </script>

   <p>Enter a String: <input id="str"><br><br>
   <button onclick="myFun()">Convert to Uppercase</button></p>
   <p id="mypara" style="display: none;">
   Output: <span id="result"></span></p>
   
</body>
</html>
Output

Enter a String:

Please note: To find the length of a string in JavaScript, use string.length property.

JavaScript Online Test

« Previous Tutorial Next Tutorial »