JavaScript Lesson 11: The String Object

<Lesson 10> [Contents] <Lesson 12>

The String object in JavaScript is for manipulating texts and characters.  It can be used to process names, addresses, phone numbers, ID, company names, serial numbers and so on. As a matter of facts,  JavaScript statements comprise strings and characters. A string is made up of letters, numbers and alphanumeric characters such as #,@,$,!,&,*,\,+,- and so on. The string object operates using various methods, as follows:


11.1 String Methods

toFixed(n)It converts a number into a string by retaining n decimal places.
Example:
var number = 2.2689;
var Num = number.toFixed(2);
Num=2.27

Methods Description
big( ) Add the HTML tags <big></big> to the string displays bigger text.
bold( ) Add the HTML tags <bold></bold> to the string displays bold text.
fixed( ) Add the HTML tags <tt></tt> to the string makes the text appears in typewriter style.
ilatics( ) Add the HTML tags <i></i> to the string displays text in italics.
small( ) Add the HTML tags <small></small> to the string displays smaller text.
sub( ) Add the HTML tags <sub></sub> to the string and displays the text as subscript text.
sup( ) Add the HTML tags <sup></sup> to the string and displays the text as superscript text.
strike( ) Add the HTML tags <strike></strike> to the string and displays the text as strike-through text.
fontcolor(color) Add the HTML tags <fontcolor(color)></font> to the string and displays the text in predefined color.
fontcolor(size) Add the HTML tags <fontcolor(size)></font> to the string and displays the text in predefined size.
toLowerCase( ) Convert string to all lowercase
toUpperCase Convert string to all uppercase
substring(A, B) Extracts the substring starting from position A to position B.
chartAt(index) Returns the character located at position index within the string (index with 0)
concat(text) Add text to the end of the string
toString( ) Returns the greatest integer less than or equal to x
fromCharCode() Convert a Unicode number into a character

The syntax of using the String method is  String.Method, where string can be of any acceptable variable name in JavaScript.

For example,  You can define the following string:

var StudentName=”John Peterson”

and manipulate the string with various methods below:

  • StudentName.toLowerCase( )   converts the string to  john peterson
  • StudentName.toUpperrCase( )  converts the string to  JOHN PETERSON
  • StudentName.bold( )  displays the string as  John Peterson
  • StudentName.italics( )  displays the string as  John Peterson
  • StudentName.sub( )  displays the string as  John Peterson
  • StudentName.sup( )  displays the string as  John Peterson
  • StudentName.strike( )  displays the string as  John Peterson
  • StudentName.substring( 1,6)  display part of the string as  ohn p

The following example demonstrates the usage of String methods .

Example 11.1

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>String Methods</title>
</head>
<body>
<script>
myString="JavaScript Tutorial";

IString=myString.italics();
SString=myString.small();
BString=myString.bold();
BigString=myString.big();
FixString=myString.fixed();
subString=myString.sub();
supString=myString.sup();
strikeString=myString.strike();
colorString=myString.fontcolor("red");
StringSize=myString.fontsize("+3");
LCstring=myString.toLowerCase();
UCstring=myString.toUpperCase();
PString=myString.substring(1,5);
CharString=myString.charAt(8);
concatString=myString.concat(" for you")
SameString=myString.toString();
document.write("<br>Text in Italics : "+IString);
document.write("<br>Smaller Text : "+SString);
document.write("<br>Text in Bold : "+BString);
document.write("<br>Text with bigger characters : "+BigString);
document.write("<br>Text with typewriter style : "+FixString);
document.write("<br>Subscript text: "+subString);
document.write("<br>Superscript text: "+supString);
document.write("<br>Strike-thru text: "+strikeString);
document.write("<br>Red color text: "+colorString);
document.write("<br>Fontsize +3: "+StringSize);
document.write("<br>Convert to lowercase: "+LCstring);
document.write("<br>Convert to Uppercase: "+UCstring);
document.write("<br>Extracts SubString: "+PString);
document.write("<br>Character at 9th position is : "+CharString);
document.write("<br>Concatenates String: "+concatString);
document.write("<br>Same String: "+SameString);
</script>

</body></html>

Click Example 11.1 to see the output

Example 11.2: The fromCharCode() Method

This example demonstrates the usage of the fromCharCode() Method. This method converts a Unicode into a corresponding character.

<!DOCTYPE html>
<html>
<body onload="myFunction()">

<h3>The character of unicode <b id="chr"></b> is <b id="chr1"></b></h3>

<script>
function myFunction() {
var ucode = prompt("Please enter a Unicode and click OK to view the corresponding character");
var myChr = String.fromCharCode(ucode);
document.getElementById("chr1").innerHTML = myChr;
document.getElementById("chr").innerHTML = ucode;
}
</script>

</body>
</html>

The character of unicode is

Example 11.2: The charCodeAt(0) Method

This method returns the Unicode of the first character in a string. The index 0 indicates the first position of the string. This example returns the Unicode for the character input by the user. As the user only input one character, the index 0 indicates the character being entered.

<!DOCTYPE html>
<html>
<body onload="myFunction()">

<h3>The unicode of the character <b id="chr"></b> is <b id="chr1"></b></h3>

<script>
function myFunction2() {
 var mychr = prompt("Please enter a character and click OK to view the corresponding unicode");
 document.getElementById("chr").innerHTML = mychr;
 document.getElementById("chr1").innerHTML = mychr.charCodeAt(0);
}
</script>

</body>
</html>

The Unicode of the character is



<Lesson 10> [Contents] <Lesson 12>