Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How to work with JavaScript String and Use the Available Properties and Methods

In this article I will cover the JavaScript string method. Along with basic functionality I will explaine some important methods and properties of String.

Introduction:

In this section of JavaScript tutorial I will explain what string are and then this tutorial will cover the creation of string and different kinds of methods and properties.

Description:

First I will explain the string basics and then will cover some important methods and properties. String is the group of characters like “Hello”, “565$”, “www.facebook.com”. The string is most usable type, Just to prove that if you have to display message you will use a string message.

During declaration or initialization of string in JavaScript, we should always write them with single quotes(' ') or double quotes (" ") around them. This tells the browser that it's a string. One more interesting thing is that JavaScript doesn’t differ in single quote (' ') and double quote (" ")

Creation of String:

String objects are usually created using string literal. String literal may contain special characters (\n, \b, \r, \s) denoted by escape-sequences, a newline symbol and others. There are three ways of declaration

  1. Quoted Text String Assignment: JavaScript uses single quote (' ') as well as double quote (" ") for string declaration .This is important to know that all string are an object. It doesn’t have character data type to be opposed to the string data type.
  2. Listing 1: Quoted String Declaration

    Var txt1 =’This is string tutorial’;
    Var txt2=”this is string tutorial”;
    
  3. JavaScript String Constructor: Again three ways of declaration under this category: A) by using the "newString ()" string Constructor. B) By assigning the return value of methods that return strings C) By equating a declared variable to quoted text .we can declare an empty string.
  4. Listing 2: Constructor String Declaration

    Var txt1=new String(“this is string tutorial”);
    Var txt2=new String(); //This is empty string 
    
  5. Implicit String Declaration By assigning the "result" of a method which returns a value of String data type, This will create strings indirectly.
  6. Listing 3: Implicit String Declaration

    var txt1 = new Array( "this", "is", "String" , “tutorial”);
    var txt2 = txt1.join(" ");
    

In the above example JavaScript methods return a string value. The string returned by the Array.join() method is identical to the one declared below.

String Function and Properties:

In this section I will explain that how to Manipulate, Count, Reorder, Replace, Search and perform other operations on JavaScript strings. These advance knowledge will help you to build dynamic pages. These are the listed methods and properties.

String Length:

Sometimes it’s become too important to know the length of string. Advance web developer and script writer will often need to know string length.

Suppose you are creating a registration form and you have a text filed of address and you want text limit no longer than 30 characters ,Then you would have to check what is the current string length.

Following example will elaborate the method of the length

Listing 4: String length Property Example

<html>
<body>
<script type="text/javascript">
var txt = "This is string tutorial";
var length = txt.length;
      document.write("Length of string is: " + length);
// using the property inside the write function we can print the same output 
document.write("<br />Length of string is : " + txt.length);
</script>
<body>
<html>
Output of String Length in JavaScript

Figure 1: Output of String Length in JavaScript

“In the above example, “txt.length“ property calculate the total character including white spaces. Here the string length is 23.

String Split:

Like many other programming languages, JavaScript has ability to split up a string in to separate chunks.

If you have a long string like "This is tutorial on string" and you want to store each word separately, you can specify the space character " " and have the split function create a new chunk every time it sees a space.

Listing 5: Script of String Split Property

<html>
<body>
<script type="text/javascript">
var txt = "Apple Banana Mango Papaya Grapes Blackberry Apricot";
var Result = txt.split(" ");
     for(a = 0; a <Result.length; a++){
	document.write("<br /> Fruits " + a + " = " + Result[a]); 
}
</script>
<body>
<html> 
Above figure is output of script of split property

Figure 2: Above figure is output of script of split property.

In above example we have created a string with numbered words zero through six. The delimiter in this example will be the space character " ".

String Search:

Sometimes it can be important to knowing that any particular substring or character exist in a string or not. This function takes a regular expression and then examines the string and if there is a match it will return the position in substring.

Listing 6: Script of String Search Property

<html>
<body>
<script type="text/javascript">
var regularexp = /is/;
var string1 = "This is tutorial";
var matchPosition1 = string1.search(regulerexp);
if(matchPosition1 != -1)
	document.write(" match at position " + matchPosition1); 
else
	document.write("no match in the first string");	
</script>
<body>
<html>
Above figure is output of program of string matching

Figure 3: Above figure is output of program of string matching

String Replace:

This property of JavaScript lets you replace words that occur within the string using regular expression. It includes two argument; 1.SearchFor 2.ReplaceText.

Following program will help you to understand the string replace property.

Listing 7: Script of String Replace Property

<html>
<body>
<script type="text/javascript">
var username = "mark";
var String1 = "Hello user! I hope you enjoy your stay username.";
var String2 = String1.replace(/user/, username);
document.write("first string =  " + String1); 
document.write("<br />second string = " + String2);
</script>
<body>
<html>
Above figure is output of String replace program

Figure 4: Above figure is output of String replace program.

You can see these are the few methods and property of string which is supported by JavaScript . There are various other methods and properties, which can be used on string; JavaScript indexof function, JavaScript String compare property, JavaScript GetElementById method and JavaScript InnerHtml Method are most important method and property provided by javaScript.

Conclusion:

This article captures the basic idea of implementing different kind of methods and property on string .There are many methods and property are available you can use like this. As usual if you have any queries please comment.



I am having total 7+ years of experience in developing applications using C#, VB.NET, ASP.NET, Silverlight, WCF, SQL Server and Oracle. I am holding a M.Tech degree in Intelligent systems. For more information, visit my Linkedin p...

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login