- What is the String Object?
- The String Object vs the String Literal
- The String Object's Properties
- The String Object’s Methods
- Regular Expressions
- The string object provides properties and methods to get information about strings or to modify strings.
- A String object is created in either of two ways: a programmer creates one by using the new keyword with the constructor function
- Or JavaScript creates one temporarily when one of the methods is called from a string literal
- Boils down to how they are created.
- The String Object:
- Syntax : var name = new String (“string value”);
- Example: var presenter = new String (“Andrew”);
- The String Literal
- Syntax : var name = “value”;
- Example: var presenter = “Andrew”;
- String Objects have only three properties
- Length
- Returns the length of the string (number of Characters)
- Prototype
- Used to add properties or methods to a string
- Constructor
- Returns the value of the constructor function.
- Methods are instructions to our Object
- Two basic types of String Object Methods
- Methods that add HTML Tags
- Methods that obtain information about or alter a string
Thanks to everyone who attened this month's PACS JavaScript SIG. The following is a
summary of my notes and examples I used during the meeting.
Objectives of
Today’s SIG:
What is a String
Object:
The String Object
vs the String Literal:
Example script
<script
type="text/javascript">
var
presenter1="Andrew";
var
presenter2="Andrew";
// var presenter1 =
new String ("Andrew");
// var presenter2 =
new String ("Andrew");
if (presenter1 ==
presenter2){
window.alert("The
strings are the same");
}
else {
window.alert("The
strings are not the same!");
}
// Because a string
object is and object value and not a literal value
// Reminder: try it
with one object and one literal
</script>
String Object
Properties:
Here are the
property examples that I used in the SIG
<script
type="text/javascript">
// length property
var
presenter="Andrew";
document.write("The
name has "+presenter.length+" characters.</br>");
// Prototype
property
String.prototype.status="wide
awake";
document.write(presenter+"
is "+presenter.status+"</br>");
The constructor
Property Sends back the value of the constructor function
// constructor
property
function
sigleader(name,condition){
this.name=name;
this.condition=condition;
}
var guy=new
sigleader("Don Arrowsmith","exhausted");
document.write(guy.name+"
is "+guy.condition+"</br>");
document.write(guy.constructor);
/* The constructor
property makes absolutely no practical difference to anything internally.
It's only any use
if your code explicitly uses it. For example, you may decide you need each
of your objects to
have a reference to the actual constructor function that created it; if so,
you'll need to set
the constructor property explicitly when you set up inheritance by assigning
an object to a
constructor function's prototype property.
*/
String Object
Methods:
I've supplied the
following method examples from the SIG.
The fontcolor()
Method adds font color to the text string that is used to call it.
It takes in a
string parameter that indicates what color the text should be
syntax = <font
color="color_value">text_string </font>
// The fontcolor()
method
var the_text1 =
"I am so mad I am red";
document.write(the_text1.fontcolor("red")+"</br>");
The fontsize()
Method adjusts the font size of the text string that calls the method.
It takes in a
numeric value to represent the size of the text (between 1 and 7).
syntax = <font
size="number">text_string</font>
// the fonsize()
method
var the_text2 =
"I am so huge";
document.write(the_text2.fontsize(7)+"</br>");
var the_text2 =
"I am so small";
document.write(the_text2.fontsize(2)+"</br>");
// combine the two
var the_text3 =
"I'm hugely mad";
document.write(the_text3.fontcolor("red").fontsize(10)+"</br>");
The link() Method
works like the anchor() method, but instead it creates a typical hyperlink on
the page.
It takes in a
string parameter that is the value of the URL.
syntax = <a
href="url"> text_string </a>
// attaching a link
using the link() method
var the_text4 =
"When I'm hugely mad I like to go here"
var full_link =
the_text4.link("http://www.gohawaii.com/");
document.write(full_link);
The 4th set of
examples show how certain String Methods can be used to gather information
about the string similar to how an object's properties can.
The charAt() Method
determines which character resides at a particular position in a string. As with arrays the position count begins
with 0 (zero). IF you want to find the
last character, you need to know how many characters are in the string before
you use the method. You can use the length property to determine the number of
characters in the string
// finding a
character using charAt() Method
var
the_text1="Welcome to PACS JavaScript SIG";
var
which_char=the_text1.charAt(0);
document.write("The
first character is "+which_char+"</br>");
document.write("The
first character is "+the_text1.charAt(12)+"</br>");
// using the length
property to find the last character
var position =
the_text1.length-1;
var last_char =
the_text1.charAt(position);
document.write("The
last character is "+last_char+"</br>");
The charCodeAt()
Method works the same way as the charAt() method, but returns the character
code of the character at the position sent as the parameter.
HTML character code
// return the
character code with the charCodeAt() Method
var
which_char1=the_text1.charCodeAt(0);
document.write("The
first character is "+which_char1+"</br>");
document.write("The
first character is "+the_text1.charCodeAt(12)+"</br>");
The concat() Method
method works much like the Array Object's concat() method. It combines the text string that calls the
method with any number of other text strings sent as parameters and returns
the combined value.
// combine multiple
strings together using the concat() Method
var the_text0 =
"Welcome to the ";
document.write(the_text0.concat(the_text1)+"</br>");
The fromCharCode()
method creates a string from a series of character codes sent as parameters to
the method.
// The
fromCharCode() Method
document.write("This
code equals "+String.fromCharCode(72,73)+"</br>");
The indexOf()
Method finds out where a certain character or string begins in a string. It then returns the position of only the
first occurrence of the character or string that is set as the parameter. A "-1" value is returned if it
isn't found. The position count begins
at 0 and the method is case sensitive.
Adding an integer at the second parameter, dictates the starting point
where the count begins.
// The indexOf()
Methodl (First instance)
var position =
the_text1.indexOf("A");
document.write(the_text1+"</br>");
document.write(position+"</br>");
// The
lastIndexOf() Method (Last instance)
var
position2=the_text1.lastIndexOf("A");
document.write(position2+"</br>");
Try changing out
the "A" with a "a" and see what values you get.
My fifth set of
examples are a sample of string methods that can manipulate the text. The following are the methods, a description
of how they work and a sample script.
The slice() Method
pulls out a portion of a string and returns a new string. The text string that was sliced
takes in two
numeric parameters to tell it where to begin and end the portion of the string
to be pulled.
var
the_text1="Welcome to PACS JavaScript SIG";
// The slice()
Method
var
the_text2=the_text1.slice(11,15);
document.write(the_text1+"</br>");
document.write(the_text2+"</br>");
The substr() Method
pulls out a portion of a string and returns the portion that is removed as a
new string. It takes two numeric
parameters, the first parameter specifies the beginning of the removal and the
second parameter specifies how many characters to remove.
// The substr()
Method
var
the_text3=the_text1.substr(11,15);
document.write(the_text1+"</br>");
document.write(the_text3+"</br>");
The substring()
Method works much like the substr() method, but it allows you to send
parameters for the beginning position and the ending position of the portion
for the string you want to remove. It
then returns the removed portion as a new string.
// The substring()
Method
var
the_text4=the_text1.substring(11,15);
document.write(the_text1+"</br>");
document.write(the_text4+"</br>");
The toLowerCase()
Method returns in lowercase letters the value of the string that called it.
// The
toLowerCase() Method
document.write(the_text1.toLowerCase()+"</br>");
The toUpperCase()
Method returns in uppercase letters the value of the string that called it.
// The
toUpperCase() Method
document.write(the_text1.toUpperCase()+"</br>");
Next Month we'll
start off by talking about Regular Expressions:
