JavaScript is an Object Oriented Programming (OOP) language.
An object is a collective data type
that possesses data and methods to transform data.
Properties are the values
associated with an object.
Example : the length property of
the String object is used to return the number of characters in a string:
<script type="text/javascript"> var txt="Hello World!" document.write(txt.length) </script> |
The output of the code above will
be:
12 |
Methods are the actions that can
be performed on objects.
Example : the toUpperCase() method of the String object
is used to display text in uppercase letters:
<script type="text/javascript"> var str="Hello world!" document.write(str.toUpperCase()) </script> |
The output of the code above will be:
HELLO WORLD! |
The String object is used
to manipulate a stored piece of text.
See Also: http://www.quirksmode.org/js/strings.html
<html> <body> <script
type="text/javascript"> var
txt="Hello World!" document.write("<p>Big:
" + txt.big() + "</p>") document.write("<p>Small:
" + txt.small() + "</p>") document.write("<p>Bold:
" + txt.bold() + "</p>") document.write("<p>Italic:
" + txt.italics() + "</p>") document.write("<p>Blink:
" + txt.blink() + " (does not work in IE)</p>") document.write("<p>Fixed:
" + txt.fixed() + "</p>") document.write("<p>Strike:
" + txt.strike() + "</p>") document.write("<p>Fontcolor:
" + txt.fontcolor("Red") + "</p>") document.write("<p>Fontsize:
" + txt.fontsize(16) + "</p>") document.write("<p>Lowercase:
" + txt.toLowerCase() + "</p>") document.write("<p>Uppercase:
" + txt.toUpperCase() + "</p>") document.write("<p>Subscript:
" + txt.sub() + "</p>") document.write("<p>Superscript:
" + txt.sup() + "</p>") document.write("<p>Link:
" + txt.link("http://www.w3schools.com") +
"</p>") </script> </body> </html> |
The indexOf()
method
How to use the indexOf() method to
return the position of the first occurrence of a specified string value in a
string.
<html> <body> <script
type="text/javascript"> var
str="Hello world!" document.write(str.indexOf("Hello")
+ "<br />") document.write(str.indexOf("World")
+ "<br />") document.write(str.indexOf("world")) </script> </body> </html> |
The match()
method
How to use the match() method to search for a specified string value within a
string and return the string value if found
<html> <body> <script
type="text/javascript"> var str="Hello world!" document.write(str.match("world")
+ "<br />") document.write(str.match("World")
+ "<br />") document.write(str.match("worlld")
+ "<br />") document.write(str.match("world!")) </script> </body> </html> |
Replace characters in a string - replace()
How to use the replace() method to replace some characters with some other
characters in a string.
<html> <body> <script
type="text/javascript"> var
str="Visit Microsoft!" document.write(str.replace(/Microsoft/,"W3Schools")) </script> </body> </html> |
Method |
Description |
Creates
an HTML anchor |
|
Displays a string in a big
font |
|
Displays a blinking string |
|
Displays a string in bold |
|
Returns the character at a
specified position |
|
Returns the Unicode of the
character at a specified position |
|
Joins two or more strings |
|
Displays a string as
teletype text |
|
Displays a string in a
specified color |
|
Displays a string in a
specified size |
|
Takes the specified
Unicode values and returns a string |
|
Returns the position of
the first occurrence of a specified string value in a string |
|
Displays a string in
italic |
|
Returns the position of
the last occurrence of a specified string value, searching backwards from the
specified position in a string |
|
Displays a string as a
hyperlink |
|
Searches for a specified string
value in a string |
|
Replaces some characters
with some other characters in a string |
|
Searches a string for a
specified value |
|
Extracts a part of a
string and returns the extracted part in a new string |
|
Displays a string in a
small font |
|
Splits a string into an
array of strings |
|
Displays a string with a
strikethrough |
|
Displays a string as
subscript |
|
Extracts a specified
number of characters in a string, from a start index |
|
Extracts the characters in
a string between two specified indices |
|
Displays a string as
superscript |
|
Displays a string in
lowercase letters |
|
Displays a string in
uppercase letters |
|
Represents the source code
of an object |
|
Returns the primitive
value of a String object |
The Array object is used to store a set of values in a single variable name
The following code line defines an Array object called
myArray:
var myArray=new
Array() |
Two ways of adding values to an
array: (you can add as many values as you need to define as many variables you
require).
1: add as many values as needed
var mycars=new Array() mycars[0]="Saab" mycars[1]="Volvo" mycars[2]="BMW" |
Could pass an integer argument to
control the array's size:
var mycars=new Array(3) mycars[0]="Saab" mycars[1]="Volvo" mycars[2]="BMW" |
2:
var mycars=new Array("Saab","Volvo","BMW") |
<html> <body> <script
type="text/javascript"> var mycars = new Array() mycars[0] = "Saab" mycars[1] = "Volvo" mycars[2] = "BMW" for (i=0;i<mycars.length;i++) { document.write(mycars[i] + "<br
/>") } </script> </body> </html> |
·
Refer to it by name and index number.
·
The index number starts at 0.
var mycars=new Array(3) mycars[0]="Saab" mycars[1]="Volvo" mycars[2]="BMW" document.write(mycars[0]) |
will result in the following
output:
Saab |
To modify a value in an existing array, add a new
value to the array with a specified index number:
mycars[0]="Opel" |
Now, the following code line:
document.write(mycars[0]) |
will result in the following
output:
Opel |
Sorting
·
Syntax : sort(compareFunction)
·
If omitted, the array is sorted lexicographically (in
dictionary order) according to the string conversion of each element. ·
For example, "80" comes before "9"
in lexicographic order, but in a numeric sort 9 comes before 80. Sorting Text – Compare function omitted <html> <body> <script
type="text/javascript"> var arr = new Array(6) arr[0] = "Jani" arr[1] = "Hege" arr[2] = "Stale" arr[3] = "Kai Jim" arr[4] = "Borge" arr[5] = "Tove" document.write(arr + "<br
/>") document.write(arr.sort()) </script> </body> </html> If If So, the compare function has the
following form: To compare numbers instead of
strings, the compare function can simply subtract Example <html> <body> <script
type="text/javascript"> function sortNumber(a, b) { return a - b } var arr = new Array(6) arr[0] = "10" arr[1] = "5" arr[2] = "40" arr[3] = "25" arr[4] = "1000" arr[5] = "1" document.write(arr + "<br
/>") document.write(arr.sort(sortNumber)) </script> </body> </html> Converting
Strings to Numbers: parseFloat syntax:
How it works: ·
The argument of ·
The result of ·
If the string argument cannot be parsed as a decimal number,
the results will be different in different browsers (either ·
Examples (comments in each line give the
conversion results): parseFloat('1.45kg') // 1.45 parseFloat('77.3') // 77.3 parseFloat('077.3') // 77.3 parseFloat('0x77.3') // 0 parseFloat('.3') // 0.3 parseFloat('0.1e6') // 100000 parseInt syntax: How it works: ·
The first argument of ·
The result returned by ·
The second argument ( ·
If there is only one argument, the number base is detected
according to the general JavaScript syntax for numbers. ·
Strings that begin with ·
All other strings are parsed as decimal numbers. ·
If the string argument cannot be parsed as an integer, the
results will be different in different browsers (either ·
Examples (comments in each line give the
conversion results): parseInt('123.45') // 123 parseInt('77') // 77 parseInt('077',10) // 77 parseInt('77',8) // 63
(= 7 + 7*8) parseInt('077') // 63
(= 7 + 7*8) parseInt('77',16) // 119 (= 7 + 7*16) parseInt('0x77') // 119 (= 7 + 7*16) parseInt('099') // 0 (9 is not an octal digit) parseInt('99',8) // 0 or NaN, depending on the platform parseInt('0.1e6') // 0 parseInt('ZZ',36) // 1295 (= 35 + 35*36) Method Description Joins two
or more arrays and returns the result Puts all the elements of
an array into a string. The elements are separated by a specified delimiter Removes and returns the
last element of an array Adds one or more elements
to the end of an array and returns the new length Reverses the order of the
elements in an array Removes and returns the
first element of an array Returns selected elements
from an existing array Sorts the elements of an
array Removes and adds new
elements to an array Represents the source code
of an object Converts an array to a
string and returns the result Adds one or more elements
to the beginning of an array and returns the new length Returns the primitive
value of an Array object ·
The Math object allows you to perform common mathematical
tasks. ·
The Math object includes several mathematical values and
functions. JavaScript provides eight
mathematical values (constants) that can be accessed from the Math object. Examples of functions (methods): The following example uses the
round() method of the Math object to round a number to the nearest integer: The code above will result in the
following output: The following example uses the random()
method of the Math object to return a random number between 0 and 1: The code above can result in the
following output: The following example uses the floor()
and random() methods of the Math object to return a random number between 0 and
10: The code above can result in the
following output: Method Description Returns
the absolute value of a number Returns the arccosine of a
number Returns the arcsine of a
number Returns the arctangent of x
as a numeric value between -PI/2 and PI/2 radians Returns the angle theta of
an (x,y) point as a numeric value between -PI and PI radians Returns the value of a
number rounded upwards to the nearest integer Returns the cosine of a
number Returns the value of Ex Returns the value of a number
rounded downwards to the nearest integer Returns the natural
logarithm (base E) of a number Returns the number with
the highest value of x and y Returns the number with
the lowest value of x and y Returns the value of x to
the power of y Returns a random number
between 0 and 1 Rounds a number to the
nearest integer Returns the sine of a
number Returns the square root of
a number Returns the tangent of an
angle Represents the source code
of an object Returns the primitive
value of a Math object Examples: CompareFunction -
Specifies
a function that defines the sort order.
Sorting Numbers
compareFunction
is
supplied, the array elements are sorted according to the return value of the compare function. a
and b
are two
elements being compared, then:
compareFunction(a, b)
< 0, sort b
to a
lower index than a
.
compareFunction(a, b)
= 0, leave a
and b
unchanged with respect to each other, but sorted with respect to all
different elements.
compareFunction(a, b)
> 0, sort b
to a
higher index than a
.
function compare(a, b) {
if (a is less than b by some ordering criterion)
return -1
if (a is greater than b by the ordering criterion)
return 1
// a must be equal to b
return 0
}
b
from a
:
function compareNumbers(a, b) {
return a - b
}
parseFloat('string')
parseFloat
must be a string or a string expression. parseFloat
is the
number whose decimal representation was contained in that string (or the number
found in the beginning of the string). 0
or NaN
).
parseInt( 'string' [,
base] )
parseInt
must be a
string or a string expression. parseInt
is an integer whose representation was contained in that string
(or the integer found in the beginning of the string). base
), if present,
specifies the base (radix) of the number whose string representation is
contained in the string
. The base
argument
can be any integer from 2 to 36. 0x
or -0x
are
parsed as hexadecimals; strings that begin with 0
or -0
are
parsed as octal numbers. 0
or NaN
).
Array Object Methods
JavaScript Math
Object
Mathematical Values
Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E
Mathematical Methods
document.write(Math.round(4.7))
5
document.write(Math.random())
0.03155624673486179
document.write(Math.floor(Math.random()*11))
0
Math Object Methods
More JavaScript and Forms