Javascript Strings

Javascript strings are the plain text used to control text operation within the web. In Javascript, by using the string feature, you can perform various text operation. At first, we will talk about the basic of strings. One good example can be, Strings are used for showing the text to the users in a customized way.

But strings can be used for more complex operation for creating even more complex and flexible application. Let’s see a basic example:

Strings Example:
<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  <script>
    function myFunc () {
       var popup = prompt("What is your name?");
       alert("My name is " + popup + "! Thank you.");
       }
  </script>
  </head>
  <body>
    <a href="javascript:void()" onclick="myFunc()" >Clcik me</a>
  </body>
</html> 

 

In the above example, we have defined a function. Notice that in that function we have used text operation using double quotes. “What is your name?” is considered as strings in Javascript. In the same way, “My name is” and “! Thank you” are also string. Means, everything you will find in single or double quotes is considered as strings in Javascript.

In the above example, have used strings to create a popup message to the users. And probably the popup message uses a string for containing the text message.

We will learn more about function, alert, prompt etc. in details in the subsequent chapters.

Javascript Strings – Creating a Javascript String

To create a string in Javascript, first, we have to declare a variable using the var keyword. Then we have to define a variable name. Finally, we can assign a string to the variable using the assignment operator. We have learned about string in a previous chapter.

We can create a Javascript string using the following syntax:

var MyString = "This is a string!"; // double qouts string

// or

var MyString = 'This is a string!'; // single quots string

 

Yes, you can use single or double quotes around the text to create a string. But don’t forget to put the quotes totally. otherwise, it will give an error called reference error.

Single Quotes vs. Double Quotes vs. No Quotes

In Javascript, you can use single quotes or double quotes to put your string. Both will work almost the same. It depends on you. But in some cases, you may use specific quotes (single or double) for warping your strings. For example, if your original text contains a single quote like the word “doesn’t“. Then use double quotes instead of single quotes. In the same way, if your text contains double quotes, then use single quotes to surround your text.

Using no quotes to define strings will give you a syntax error that is also called reference error in Javascript. Means, you must have to use quotes for defining a string.

Example:
var myString1 = "Don't cheat!"; // works fine
var myString2 = 'This book "Gitanjali" is amazing!'; // works fine
var myString3 = "This book "Gitanjali" is amazing!"; // Syntax error
var myString4 = Hello, PrograCoding; // Reference error

 

Don’t Mess Up

Don’t mess up with single or double quotes by using them together. It will give you syntax errors. You can also forget to put a quote at one side.

var a = "Hello, World!'; // syntax error
var b = 'Hello, World!"; // syntax error
var c = Hello, World"; // syntax error
var d = "Hello, World; // syntax error
var e = Hello, World!; // reference error

 

A single syntax error prevents to execute the source code. So be careful about the syntax error.

Javascript Strings and String methods

Using Strings in the Context

We can put a string directly into a statement called using in context. Let’s see an example:

document.getElementById("h1").InnerHTML = "Welcome!";

Notice that we have used strings directly without assigning it to a variable.

Connecting Strings Together

You can also use strings together by using much like arithmetical way. You can connect multiple strings using addition or plus sign. Let’s see an example:

var myText1 = "Hello, ";
var myText2 = "PrograCoding!";
// connecting the two strings
console.log( myText1 + myText2);

// using context
console.log( "Hello, " + "PrograCoding!");

What is Next?

We just have learned the basic of the Javascript strings. We will learn more about it in the Javascript advanced section. We will learn in details about Javascript String object, method, and properties. In the next tutorial, we will learn about different kinds of Javascript operators.

« Previous Next »