You are on page 1of 24

String Objects

Introduction
A string M -> Moral -> is Characters or is a string. is a a group of of a Characters Characters Character or contains . 5

is group

A string is an Object A string is an object in Javascript , an object have properties and methods or functions, so a string is having property and methods in javascript. String property Length property returns the no of characters present in string. String Methods

bold() - returns the string formatting to bold. italics() returns the string formatting italics. charAt() returns the character present in string at given position. substring() returns the characters present from given start position to given end position. toLowerCase() returns the string converted to lowercase letters. toUpperCase() returns the string converted to uppercase letters.

Length
Length is a property of sring object, using which we can know the number of characters in a string. Example 1:

<html> <head> <script> var a="Hindustan" document.write("Length of Variable a is "+a.length); </script> </html> Output will be: Length of Variable a is 9

Example 2:

<html> <head> <script>

var name="Manmohan Singh" document.write("Length of Variable a is "+name.length); </script> </html>

Output will be:

Length of Variable a is 14

String Methods - bold()


Example 1:

<html> <head> <script> var a="Uttar Pradesh" document.write("The Value of Variable a is "+a.bold()); </script> </html>
Output will be :

The Value of Variable a is Uttar Pradesh

Example 2:

<html> <head> <script> var state="Bihar" document.write("State : "+state.bold()); </script> </html>


Output will be:

State : Bihar

String Methods - charAt()


Example 1:

<html> <head> <script> var state="Bihar" document.write("<br>character at 0th position is : "+state.charAt(0)); document.write("<br>character at 1st position is : "+state.charAt(1)); document.write("<br>character at 2nd position is : "+state.charAt(2)); </script> </html>
Output will be :

character at 0th position is : B character at 1st position is : i character at 2nd position is : h

Exapmple 2:

<html> <head> <script> var state="Bihar" state=state.charAt(2).bold().italics() document.write("Character at 2nd position is : "+state); </script> </html>
Output will be:

Character at 2nd position is : h

String Methods - italics()


Example 1:

<html> <head> <script> var state="Bihar" document.write("State : "+state.italics()); </script> </html>


Example 2:

<html> <head> <script> var state="Bihar" state=state.bold(); state=state.italics(); document.write("State : "+state); </script> </html>

String Methods - toLowerCase()


Example 1:

<html> <head> <script> var state="HIMANCHAL PRADESH" state=state.toLowerCase() document.write("State : "+state);

</script> </html>
Output will be:

State : himanchal pradesh

Example 2:

<html> <head> <script> var state="HIMANCHAL PRADESH" state=state.substring(0,state.length).toLowerCase().bold().italics() document.write("State : "+state); </script> </html>
Output will be :

State : himanchal Pradesh

String Methods - toUpperCase()


Example 1:

<html> <head> <script> var state="uttranchal" state=state.toUpperCase() document.write("State : "+state); </script> </html>
Example 2:

<html>

<head> <script> var state="uttranchal" state=state.substring(0,state.length).toUpperCase().bold().italics() document.write("State : "+state); </script> </html>


output will be:

State : UTTRANCHAL

String Methods - substring()


Example 1:

<html> <head> <script> var state="Bihar" state=state.substring(0,3) document.write("Characters from 0th to 2nd position are : "+state); </script> </html>
Output will be:

Characters from 0th to 2nd position are : Bih

Example 2:

<html> <head> <script>

var state="Bihar" state=state.substring(0,3).bold().italics() document.write("Characters from 0th to 2nd position are : "+state); </script> </html>
Output will be:

Characters from 0th to 2nd position are : Bih

Math Objects
Math object provides many properties and functions which allows to perform complex mathematical work. A Math object is a built in object of JavaScript using which a lot of mathematical calculations can be performed. We can use these mathematical functions to create the animation in JavaScript also Math object properties E- this property returns Euler's Constant (rougly 2.718) PI- this property returns the value of PI Length property returns the no of characters present in string. Math object Methods abs() this function calculates and returns the absolute value. ceil() this function returns the next greater or equal integer.. cos() this function is used to calculate the cosine number.. sin()this function is used to calculate the sin() of a number. random () this function returns a randomly calculated number between 0 and 1. . sqrt() this function calculates and returns the square root of a number. tan() this function calculates and returns tangent of a number. floor() this function returns next integer lesser than or equal to a number.. pow() - this function returns calculated value of one number for given number of powers.

bold() - returns the string formatting to bold. italics() returns the string formatting italics. charAt() returns the character present in string at given position. substring() returns the characters present from given start position to given end position. toLowerCase() returns the string converted to lowercase letters. toUpperCase() returns the string converted to uppercase letters. Math Objects abs() function
This function calculates and returns the absolute value. Suppose the value of any variable is 345 the absolute value of 345 will be 345. if the value of a variable is 345 then the absolute value of variable will be 345. Example:

<html> <head> </head>

<body> <script> var a=-45 document.write("<br> Value of a :"+a) document.write("<br> Absolute Value of a :"+Math.abs(a)) </script> </body> </html>
click here to view the results of this program in browser

Math Objects ceil() function


ceil()- this function returns the next greater or equal integer. If any number is having a decimal value then the value is increased with one else it remains as it is. Fox example a variable is having value 45.26 then the ceiling value of this variable will be 45 but if the variable value is 25 the ceil value will be 25 only. Example:

<html> <head> </head> <body> <script> document.write("<br>Ceiling Number is : "+Math.ceil(45.26)) document.write("<br>Ceiling Number is : "+Math.ceil(3.22)) document.write("<br>Ceiling Number is : "+Math.ceil(25)) </script> </body> </html>
click here to view the results of this program in browser

Math Objects cos() function


cos()- this function is used to calculate the cosine number. Math object contains cos() function which can return the cos

value of the angle provided with the cos function. Examples:

<html> <head> </head> <body> <script> var a=0 document.write("<br> Cosine of a is : "+Math.cos(a)) document.write("<br> Cosine of 90 is : "+Math.cos(90)) document.write("<br> Cosine of 180 is : "+Math.cos(180)) </script> </body> </html>
click here to view the results of this program in browser

Math Objects floor() function


floor()- this function returns next integer lesser than or equal to a number. If any value is having the decimal values with it floor function provides the decimal truncated value. Fox example a variable is having value 45.26 the floor value of that variable will be 45 but if the value is 32 then the floor value of variable will be 32 only. Example:

<html> <head> </head> <body> <script> document.write("<br>Floor Number is : "+Math.floor(45.26)) document.write("<br>Floor Number is : "+Math.floor(3.22)) document.write("<br>Floor Number is : "+Math.floor(26.23))

</script> </body> </html>

click here to view the results of this program in browser

Math Objects pow() function


pow()- this function returns calculated value of one number for given number of powers. For example if the parameters passed to the function are 2 , 3 then the answer will be 8 , 2*2*2 = 8 , this function requires the base and the power of the value and returns the calculated value. Example:

<html> <head> </head> <body> <script> var a=2 var b=3 document.write("<br> Value of 2's power 3 is : "+Math.pow(2,3)) document.write("<br> Value of 3's power 4 is : "+Math.pow(3,4)) document.write("<br> Value of 4's power 3 is : "+Math.pow(4,3)) </script> </body> </html>

click here to view the results of this program in browser

Math Objects random() function


random ()- this function returns a randomly calculated number between 0 and 1. The Math object contains a random function which can be used to get the randomly generated value between 0 & 1, The code given below will generated a random value but if refreshed every time it will generate a new randomly generated value. Example:

<html>

<head> </head> <body> <h5> On Refresing screen every time new number between 0 & 1 <br> will be generated by random function</h5> <script> document.write("<br>Random Number is : "+Math.random()) </script> </body> </html>

click here to view the results of this program in browser

Math Objects sin() function


sin()- this function is used to calculate the sin() of a give number. Math object contains sin function which can be used to get the sin value of any angle given to sin function as parameter. In the below given example we are passing different angle values to sin function which will generate different values Example:

<html> <head> </head> <body> <script> var a=0 document.write("<br> sine of a is : "+Math.sin(a)) document.write("<br> sine of 45 is : "+Math.sin(45)) document.write("<br> sine of 60 is : "+Math.sin(60)) document.write("<br> sine of 90 is : "+Math.sin(90)) </script>

</body> </html>
click here to view the results of this program in browser

Math Objects sqrt() function


sqrt()- this function calculates and returns the square root of a number. Math object has a sqrt function used to get the square root of the number given with function. Fox example if the variable value or value given to sqrt function is 81 then it will return 9 because the square root of 81 is 9. Example:

<html> <head> </head> <body> <script> var a=4 document.write("<br>Square Root of a is : "+Math.sqrt(a)) document.write("<br>Square Root of 81 is : "+Math.sqrt(81)) document.write("<br>Square Root is 49 is : "+Math.sqrt(49)) </script> </body> </html>

click here to view the results of this program in browser

Math Objects sqrt() function


tan()- this function calculates and returns tangent of a number. This function will return the value generated of the angle given with tan function. Example:

<html> <head> </head>

<body> <script> var a=0 document.write("<br> angent of a is : "+Math.tan(a)) document.write("<br> tangent of 45 is : "+Math.tan(45)) document.write("<br> tangent of 60 is : "+Math.tan(60)) document.write("<br> tangent of 90 is : "+Math.tan(90)) </script> </body> </html>
click here to view the results of this program in browser

Date Object
Date is a built-in object of JavaScript used to deal with date in a JavaScript program. A date is composed of day, month, year, hour, minute, seconds. We can access or change any of these attributes using suitable method. These all methods provide great help to access & maintain the date. The different functions of this object are: setDate( ) getDate( ) getDay( ) getMonth ( ) getYear( ) SetHour() SetMinutes() SetSeconds() getHour() getMinutes() getseconds() This function is used to set desire date to date object This function is used to get date from date object This function is used to get day of date from date object This function is used to get Month of date from date object This function is used to get Year of date from date object This function is used to set Hours to a date object This function is used to set Minutes to a date object This function is used to set Seconds to a date object This function is used to get Hours from a date object This function is used to get minutes from a date object This function is used to get Seconds from a date object

Date
The different date functions are used in the below given program. Like function to set desire date to date object, function get date from date object, function to get day of date from date object, function to get Month of date from date object, function to get Year of date from date object, function to set Hours to a date object , function to set Minutes to a date object, function to set Seconds to a date object, function to get Hours from a date object, function to get minutes from a date object, function to get Seconds from a date object etc. Example:

<html>

<head><title> setDate & getDate </title> </head> <body> <script> var birthday = new Date(1985,10,5); var day= birthday.getDate(); document.write("<br> Birth Date is : "+day) birthday.setDate(25); day= birthday.getDate(); document.write("<br> After Setting Birth Date to 25 date is : "+day) </script> </body> </html>
Click here to view the result of this program in browser Example:

<html> <head> </head> <body> <script> var birthday = new Date(1985,10,5); var day= birthday.getDay(); var month=birthday.getMonth(); var y = birthday.getYear(); document.write("<br> Birth Date is : "+day) document.write("<br> Birth Month is : "+month)

document.write("<br> Birth Year is : "+y) </script> </body> </html>


Click here to view the result of this program in browser Example:

<html> <head><title> setHour & getHour </title> </head> <body> <script> var calltime = new Date(1985,10,25,5,12,30); var h= calltime.getHours() var m = calltime.getMinutes() var s = calltime.getSeconds() document.write("<br>Call Time Hour is : "+h) document.write("<br>Call Time Minutes are : "+m) document.write("<br>Call Time Seconds are : "+s) calltime.setHours(9) calltime.setMinutes(29) calltime.setSeconds(14) var h= calltime.getHours() var m = calltime.getMinutes() var s = calltime.getSeconds() document.write("<br>After Setting Call Time Hour is : "+h) document.write("<br>After Setting Call Time Minutes are : "+m)

document.write("<br>After Setting Call Time Seconds are : "+s) </script> </body> </html>
Click here to view the result of this program in browser

Regular Expressions
Regulars expressions are a sort of shorthand , these are used in pattern matching and substitutions. A regular expression is just sequence or a pattern of characters that is matched against a string of text. Regexps are very powerful and useful tool. They contain a lot of meaning in a short space. Every single character in the regular expression has some meaning. Any regular expression should start with a / (slash) sign and end with a slash (/) sign. The below given example can explain the power of regular expressions. In this example 5 digits are to be entered by user, when user clicks on the button function ff is called and the value entered is checked with the regular expression. In the regular expression is /^\d{5}$/ / start of regular expression ^ to start the matching from first character \ indicates digit character {5} indicates that 5 , because it is preceded by \d which means digit character , so \d{5} means 5 digit characters $ - indicates end of the string The meaning of the above given expression is starting from beginning of the string there must be nothing other than 5 digits and There must also be nothing following those 5 digits.

<html> <head> </head> <body> <script>

function ff(f1) { var a=f1.t1.value var re5=/^\d{5}$/ if (a.search(re5)==-1) { alert('Enter Valid number')

} else { alert('good try') }

} </script>

<form name=f1> Enter Five digits code :<input type="text" name=t1> <br> <input type="button" value=" hit me to check the number " onclick="ff(f1)"> </form> </body> </html>

Click here to view the result of this program in browser

Browser Name
Browser is a program used to view the web pages. Web pages are created using any markup language like html , xml etc. The popular Browser programs are Internet Explorer, Netscape Navigator, Fire Fox etc. Navigator object of JavaScript can avail us the details about our browser, like which browser program we are using , what is the version of the browser we are using etc. Example

<html> <head> </head> <body bgcolor="yellow" text=red> <script type="text/javascript"> var browse = navigator.appName

document.write("<br>My Brower's Name is :"+browse) </script> </body> </html>

Click here to view the result of this program on browser.


Browser Version
Browser is a program used to view the web pages. Web pages are created using any markup language like html , xml etc. The popular Browser programs are Internet Explorer, Netscape Navigator, Fire Fox etc. Navigator object of JavaScript can avail us the details about our browser, like which browser program we are using , what is the version of the browser we are using etc. Example

<html> <head> </head> <body bgcolor="yellow" text=red> <script type="text/javascript"> var ver = navigator.appVersion document.write("<br>My Brower's Version is :"+ver) </script> </body> </html>

Click here to view the result of this program on browser.


Cookies
Cookies is a method of storing information locally in browser and sending it to server whenever the pages are requested by the user. When a user requests a page, an HTTP request is sent to the server. The request includes a header that defines several pieces of information, including the page being requested. The server returns a HTTP response that also includes a header. The header contains information about the document being returned. These headers all contains one or more fields of information in a basic format like fieldname : information. Example

<html> <head>

</head> <body bgcolor="yellow" text=red> Type any desired word in the text box it will be kept as cookie for this document. <form mehtod="post()"> <br> Cookie value : <input type = text size=10 onchange="ck(this.value);"> <br> <input type="submit"> </form>

<script type="text/javascript"> function ck(ff) { document.cookie=ff } var cooky =((document.cookie != "") && (document.cookie != null)) var cname=((cooky)? document.cookie: "Hello") document.write("<br>Cookies : "+document.cookie); </script> </body> </html>

Click here to view result of this program on Browser


Validations
We can validate the user input for our form inquiries using JavaScript. A form controls are used to collect data from the user , but we also know that garbage in garbage out, if a bad data will be collected then the results will also be bad. So to collect a good data we require validations & checks on the data being collected. Like if name of the person is asked the user can enter only name only in the text field. There are some examples to validate name, age, phone number of a person. Example to Validate a user's name:

<html> <head>

</head> <body bgcolor=yellow text=red> Name :<input type="text" name="t1"> <input type="Button" value="check" onclick="ncheck()"> <script> var ok=0 function ncheck() { var a=t1.value; for(i=0;i<a.length;i++) { if((a.charAt(i)>='a' && a.charAt(i)<='z')||(a.charAt(i)>='A' && a.charAt(i)<='Z') || (a.charAt==" " )) { ok=1 } else { ok=0 } } if (ok==0) { t1.value="Invalid Name"; } else {

t1.value="Good Name"; } } </script> </body> </html>

Click here to view the result of this program on browser


Example to validate a users age:

<html> <head> </head> <body bgcolor=yellow text=red> How many years old are Your ? :<input type="text" name="t1"> <input type="Button" value="check" onclick="ncheck()">

<script> var ok=0 function ncheck() { var a=t1.value; should=0 if(a.length>0 && a.length<3) { should=1 } if (a.length>0 && parseInt(a.value)==0) {

should =0 } if (should==1) { for(i=0;i<a.length;i++) { if((a.charAt(i)>0) && (a.charAt(i)<10)) { ok=1; } else { ok=0 break; } } } if ((ok==1) && (should==1)) { t1.value="..Long Live..."; } else { t1.value="Do not play.. please.."; } } </script> </body> </html>

Click here to view the result of this program on browser


Example to validate a users Phone number:

<html>

<head> </head> <body bgcolor=yellow text=red> Enter Phone Number :<input type="text" name="t1"> <input type="Button" value="check" onclick="ncheck()">

<script> var ok=0 function ncheck() { var a=t1.value; should=0 if(a.length==8) { should=1 } if (a.length>9 && a.length <12) { should=1 }

if (should==1) { for(i=0;i<a.length;i++) { if((a.charAt(i)>-1) && (a.charAt(i)<10)) {

ok=1; }

else { ok=0 break; } } } else { t1.value="Invalid Phone Number"; }

if ((ok==1) && (should==1)) { t1.value="valid Phone Number"; } else { t1.value="Invalid Phone Number"; } } </script> </body> </html>

Click here to view the result of this program on browser

You might also like