Difference between revisions of "JavaScript String Object"

From Techotopia
Jump to: navigation, search
(Manipulating Strings with the String Object)
(Creating a JavaScript String Object)
Line 32: Line 32:
  
 
returns the postion index of the word ''my'' in the string (the word ''my'' begins position 8 because the first character is always index position 0, '''not''' index position 1).
 
returns the postion index of the word ''my'' in the string (the word ''my'' begins position 8 because the first character is always index position 0, '''not''' index position 1).
 +
 +
To split a string up based on the locations of a specified delimiter (in this case semi-colons):
 +
 +
<pre>
 +
 +
</pre>
  
 
== JavaScript String Object Methods ==
 
== JavaScript String Object Methods ==

Revision as of 19:21, 27 April 2007

The JavaScript String Object is one of the most useful of the JavaScript Core Objects. It provides a range of methods thaty can be used to perform a variety of string manipluation tasks (replacing parts of a string with different text, extreacting frgaments of a string, finding where a particular character appears in a string and much, much more).


Contents


Creating a JavaScript String Object

An instance of a String object is created just as any other object instance is created (See JavaScript Object Basics). The object is created using the new keyword with the string to be used as the property passed through as the argument. For example:


myString = new String("This is my string");

JavaScript String object methods and properties are accessed using the standard object dot notation:

objectName.property accesses a property. For example:


var stringLen = myString.length;

returns the length of the string and assigns it to the variable stringLen

Similarly:


var position = myString.indexOf ("my");

returns the postion index of the word my in the string (the word my begins position 8 because the first character is always index position 0, not index position 1).

To split a string up based on the locations of a specified delimiter (in this case semi-colons):


JavaScript String Object Methods

The following table lists the most commonly used methods built into the String object class:

MethodDescription
anchor(name)Creates an <a> tag of the form <a name="name>.
big()Increases the font size of the text by returning the string wrapped in HTML <big> and </big> elements (e.g. Example)
bold()Makes the string bold by returning the string wrapped in <b> and </b> elements (e.g Example)
charAt(index)Returns the character at the specified index into the string. It is important to remember that the first character in a string in at index 0, not index 1.
concat(arg1, arg2 ...)Takes two or strings as arguments and combines them into a single string. Returns the combined string.
fixed()Returns the string ready to be displayed in fixed pitch (teletype style) font by wrapping the string in HTML <tt> and </tt> elements (e.g. Example)
fontcolor(color)Returns the string with a new foreground color by wrapping the string in HTML <font color="color"> and </font> elements (e.g. Example)
fontsize(size)Specifies the color of the string by wrapping the string in HTML <font size="size"> and </font> elements (e.g. Example)
indexOf(string, start)Takes a string as an argument and returns the index of the first occurance of that string in an instance of a String object. The optional start argument specifies the index into the string where the search should begin. Returns -1 if no match to the string is found.
italics()Returns the string to be displayed in italics by wrapping the string in HTML <i> and </i> elements (e.g. Example)
lastIndexOf(string, start)Takes a string as an argument and returns the index of the last occurance of that string in an instance of a String object. The optional start argument specifies the index into the string where the search should begin. Returns -1 if no match to the string is found.
link()Accepts a URL as an argument and constructs and returns an <a> tag using the URL as the href attribute.
match(regex)Accepts a regular expression (regex) as an argument and returns an array of matches found in the String object instance.
replace(regex, replacetext)Accepts two arguments: a regular expression and a replacement string. Replaces all matches to the regular expression in a String object instance with the replacement string provided. Returns -1 if no match is found.
search(regex)Accepts a regular expression as an argument and returns the index value of the location of the match in the String object. Returns -1 if no match is found.
slice(start, end)Accepts a start and an end index as arguments and returns the string fragment that is located between these two positions.End is optional. If not specified returns fragment from start index to end of string.
small()Makes the string smaller by returning it wrapped in the string in HTML <small> and </small> elements (e.g Example)
split(delimiter, limit)Accepts a delimiter and an optional limit as arguments and returns an array. This array contains the string broekn up into fragments using the delimeter value to decide where to spit the string. The limit value allows tyhe developer to impose a limit on how many fragments are returned
strike()Returns string wrapped in the string in HTML <strike> and </strike> elements to produce a strikeout effect (e.g Example)
sub()Returns string wrapped in the string in HTML <sub> and </sub> elements to produce a subscript effect (e.g Example)
sup()Returns string wrapped in the string in HTML <sup> and </sup> elements to produce a superscript effect (e.g Example)
substr(start, length)Accepts a start and length (number of characters) as arguments and returns the string fragment that is located between these two positions. length is optional. If not specified returns fragment from start index to end of string. If a negative index is passed through the index is referenced from the end of the string.
substring(start, end)Accepts a start and an end index as arguments and returns the string fragment that is located between these two positions. End is optional. If not specified returns fragment from start index to end of string.
toLowerCase()Returns the string with all characters converted to lower case
toUpperCase()Returns the string with all characters converted to upper case

JavaScript String Object Properties

PropertyDescription
lengthThe length of the string in characters
prototypeProvides a mechanism for developers to add properties to a string instance (see JavaScript Object Basics for details on extending objects).

JavaScript String Object Examples

Now that we are familiar with the methods and properties provided with the String object it is time to look at some examples. Before beginning, however, it is important to understand that the String Object methods do not modify the string contained in the object itself. Rather, a modified string is returned, leaving the original String object untouched.

After the following script fragment fragment is executed:


myString = new String ("This is my string");
var upperCase = myString.toUpperCase();

myString still contains "This is my string". What the toUpperCase() method did was return the string converted to uppercase which was then assigned to variable upperCase. Therefore, the value of the string variable upperCase is now "THIS IS MY STRING".

Getting the length of a String Object

The length of a string object is obtained by accessing the length property:


myString = new String ("This is my string");
var stringLen = myString.length // assigns length of string to variable stringLen

Setting String Object text Effects

The JavaScript String object provides an extensive range of text effects. The script below shows how to use some of these:


myString = new String ("This is my string");

document.writeln ( myString.bold() );   // Displays text in bold

document.writeln ( myString.color("red"); // Displays text in red

document.writeln ( myString.italic());  // Displays text in italics

Performing Conversions on String Objects

The conversion methods of the String object are accessed in the same way as all other String object methods, and can be used to perform such tasks as converting the string to all upper case or all lower case.


myString = new String ("This is my string");
var upperCase = myString.toUpperCase();    // upperCase variable now contains 'THIS IS MY STRING'

myString = new String ("This Is My String");
var lowerCase = myString.toLowerCase();    // lowerCase variable now contains 'this is my string'

Manipulating Strings with the String Object

One of the most powerful features of the JavaScript String Object in the ability to manipulate strings. This includes breaking a string up into multiple sections, extracting fragments of a string and finding whterh whether a particular string sequence in contained in a string.

To extract a single character from a specific index into the string:


myString = new String ("This is my string");
var thirdChar = myString.charAt(2);    // returns 'i' which is the thrid character (remember the first character is index 0!)

To extract a section of the string between two index points:


myString = new String ("This is my string");
var partString = myString.substring(5, 10);    // returns 'is my' which is the text between index points 5 and 10

To extract a given number of characters after an index point:


myString = new String ("This is my string");
var partString = myString.substr(5, 2);      // returns 'is' which is conists of the 2 characters after index point 5

To find where a particular string appears within a String object:


myString = new String ("This is my string");
var location = myString.indexOf ("my");      // returns 8 which is the index position where 'my' begins

location = myString.indexOf ("hello");      // returns -1 because myString does not contain the word "hello"

To replace part of the string with another string:


myString = new String ("This is my string");
var newString = myString.replace ("my", "your");   // returns 'This is your string'