String

  • Revision slug: JavaScript/Reference/Global_Objects/String
  • Revision title: String
  • Revision id: 54298
  • Created:
  • Creator: Maian
  • Is current revision? No
  • Comment static methods

Revision Content

Summary

Core Object

An object representing a series of characters in a string.

Created by

The String constructor:

new String(string)

Parameters

string 
Any string.

Description

The String object is a wrapper around the string primitive data type. Do not confuse a string literal with the String object. For example, the following code creates the string literal s1 and also the String object s2:

s1 = "foo"; // creates a string literal value
s2 = new String("foo"); // creates a String object

You can call any of the methods of the String object on a string literal value-JavaScript automatically converts the string literal to a temporary String object, calls the method, then discards the temporary String object. You can also use the String.length property with a string literal.

You should use string literals unless you specifically need to use a String object, because String objects can have counterintuitive behavior. For example:

s1 = "2 + 2" // creates a string literal value
s2 = new String("2 + 2") // creates a String object
eval(s1)     // returns the number 4
eval(s2)     // returns the string "2 + 2"

A string can be represented as a literal enclosed by single or double quotation marks; for example, "Netscape" or 'Netscape'.

You can convert the value of any object into a string using the global String function.

Accessing individual characters in a string

There are two ways to access an individual character in a string. The first is the charAt method:

'cat'.charAt(1) // returns "a"

The other way is to treat the string as an array, where each index corresponds to an individual character:

'cat'[1] // returns "a"

Note: The second way (treating the string as an array) is not part of the ECMAScript; it's a JavaScript feature.

In both cases, attempting to set an individual string results in an error:

'cat'.charAt(0) = 'b'; // error
'cat'[2] = 'r';        // error

Properties

  • constructor: Specifies the function that creates an object's prototype.
  • length: Reflects the length of the string.
  • prototype: Allows the addition of properties to a String object.

Static methods

  • fromCharCode: Returns a string created by using the specified sequence of Unicode values.

Methods

Methods unrelated to HTML

  • charAt: Returns the character at the specified index.
  • charCodeAt: Returns a number indicating the Unicode value of the character at the given index.
  • concat: Combines the text of two strings and returns a new string.
  • indexOf: Returns the index within the calling String object of the first occurrence of the specified value, or -1 if not found.
  • lastIndexOf: Returns the index within the calling String object of the last occurrence of the specified value, or -1 if not found.
  • match: Used to match a regular expression against a string.
  • replace: Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.
  • search: Executes the search for a match between a regular expression and a specified string.
  • slice: Extracts a section of a string and returns a new string.
  • split: Splits a String object into an array of strings by separating the string into substrings.
  • substr: Returns the characters in a string beginning at the specified location through the specified number of characters.
  • substring: Returns the characters in a string between two indexes into the string.
  • toLowerCase: Returns the calling string value converted to lowercase.
  • toSource: Returns an object literal representing the specified object; you can use this value to create a new object. Overrides the Object.toSource method.
  • toString: Returns a string representing the specified object. Overrides the Object.toString method.
  • toUpperCase: Returns the calling string value converted to uppercase.
  • valueOf: Returns the primitive value of the specified object. Overrides the Object.valueOf method.

Methods related to HTML

  • anchor: Creates an HTML anchor that is used as a hypertext target.
  • big: Causes a string to be displayed in a big font as if it were in a BIG tag.
  • blink: Causes a string to blink as if it were in a BLINK tag.
  • bold: Causes a string to be displayed as if it were in a B tag.
  • fixed: Causes a string to be displayed in fixed-pitch font as if it were in a TT tag.
  • fontcolor: Causes a string to be displayed in the specified color as if it were in a <FONT COLOR="color"> tag.
  • fontsize: Causes a string to be displayed in the specified font size as if it were in a <FONT SIZE="size"> tag.
  • italics: Causes a string to be italic, as if it were in an I tag.
  • link: Creates an HTML hypertext link that requests another URL.
  • small: Causes a string to be displayed in a small font, as if it were in a SMALL tag.
  • strike: Causes a string to be displayed as struck-out text, as if it were in a STRIKE tag.
  • sub: Causes a string to be displayed as a subscript, as if it were in a SUB tag.
  • sup: Causes a string to be displayed as a superscript, as if it were in a SUP tag.

Examples

Example: String literal

The following statement creates a string literal and assigns it to the variable last_name:

var last_name = "Schaefer";

Example: String literal properties

The following statements evaluate to 8, "SCHAEFER", and "schaefer":

last_name.length
last_name.toUpperCase()
last_name.toLowerCase() 

Example: Setting an individual character in a string

An individual character cannot be directly set in a string. Instead, a new string can be created using the substr or substring methods:

function setCharAt(str, index, ch) {
   return str.substr(0, index - 1) + ch + str.substr(index);
}

alert(setCharAt('scam', 2, 'p')); // outputs "spam"

Example: Pass a string among scripts in different windows or frames

The following code creates two string variables and opens a second window:

var lastName = "Schaefer";
var firstName = "Jesse";
empWindow = window.open('string2.html', 'window1', 'width=300,height=300');

If the HTML source for the second window (string2.html) creates two string variables, empLastName and empFirstName, the following code in the first window assigns values to the second window's variables:

empWindow.empFirstName = firstName;
empWindow.empLastName = lastName;

The following code in the first window displays the values of the second window's variables:

alert('empFirstName in empWindow is ' + empWindow.empFirstName);
alert('empLastName in empWindow is ' + empWindow.empLastName);

Revision Source

<p>
</p>
<h3 name="Summary"> Summary </h3>
<p><b>Core Object</b>
</p><p>An object representing a series of characters in a string.
</p>
<h3 name="Created_by"> Created by </h3>
<p>The String constructor:
</p>
<pre class="eval">new String(<i>string</i>)
</pre>
<h3 name="Parameters"> Parameters </h3>
<dl><dt> <code>string</code> </dt><dd> Any string.
</dd></dl>
<h3 name="Description"> Description </h3>
<p>The <code>String</code> object is a wrapper around the string primitive data type. Do not confuse a string literal with the <code>String</code> object. For example, the following code creates the string literal <code>s1</code> and also the String object <code>s2</code>:
</p>
<pre class="eval">s1 = "foo"; // creates a string literal value
s2 = new String("foo"); // creates a String object
</pre>
<p>You can call any of the methods of the <code>String</code> object on a string literal value-JavaScript automatically converts the string literal to a temporary <code>String</code> object, calls the method, then discards the temporary <code>String</code> object. You can also use the <code>String.length</code> property with a string literal.
</p><p>You should use string literals unless you specifically need to use a <code>String</code> object, because String objects can have counterintuitive behavior. For example:
</p>
<pre class="eval">s1 = "2 + 2" // creates a string literal value
s2 = new String("2 + 2") // creates a String object
eval(s1)     // returns the number 4
eval(s2)     // returns the string "2 + 2"
</pre>
<p>A string can be represented as a literal enclosed by single or double quotation marks; for example, "Netscape" or 'Netscape'.
</p><p>You can convert the value of any object into a string using the global <a href="en/Core_JavaScript_1.5_Reference/Functions/String">String</a> function.
</p>
<h4 name="Accessing_individual_characters_in_a_string"> Accessing individual characters in a string </h4>
<p>There are two ways to access an individual character in a string. The first is the <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/charAt">charAt</a> method:
</p>
<pre class="eval">'cat'.charAt(1) // returns "a"
</pre>
<p>The other way is to treat the string as an array, where each index corresponds to an individual character:
</p>
<pre class="eval">'cat'[1] // returns "a"
</pre>
<p>Note: The second way (treating the string as an array) is not part of the ECMAScript; it's a JavaScript feature.
</p><p>In both cases, attempting to set an individual string results in an error:
</p>
<pre class="eval">'cat'.charAt(0) = 'b'; // error
'cat'[2] = 'r';        // error
</pre>
<h3 name="Properties"> Properties </h3>
<ul><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/constructor">constructor</a>: Specifies the function that creates an object's prototype.  
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/length">length</a>: Reflects the length of the string.  
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/prototype">prototype</a>: Allows the addition of properties to a String object.  
</li></ul>
<h3 name="Static_methods"> Static methods </h3>
<ul><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/fromCharCode">fromCharCode</a>: Returns a string created by using the specified sequence of Unicode values.
</li></ul>
<h3 name="Methods"> Methods </h3>
<h4 name="Methods_unrelated_to_HTML"> Methods unrelated to HTML </h4>
<ul><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/charAt">charAt</a>: Returns the character at the specified index.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/charCodeAt">charCodeAt</a>: Returns a number indicating the Unicode value of the character at the given index.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/concat">concat</a>: Combines the text of two strings and returns a new string.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/indexOf">indexOf</a>: Returns the index within the calling String object of the first occurrence of the specified value, or -1 if not found.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/lastIndexOf">lastIndexOf</a>: Returns the index within the calling String object of the last occurrence of the specified value, or -1 if not found.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/match">match</a>: Used to match a regular expression against a string.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/replace">replace</a>: Used to find a match between a regular expression and a string, and to replace the matched substring with a new substring.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/search">search</a>: Executes the search for a match between a regular expression and a specified string.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/slice">slice</a>: Extracts a section of a string and returns a new string.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/split">split</a>: Splits a String object into an array of strings by separating the string into substrings.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/substr">substr</a>: Returns the characters in a string beginning at the specified location through the specified number of characters.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/substring">substring</a>: Returns the characters in a string between two indexes into the string.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/toLowerCase">toLowerCase</a>: Returns the calling string value converted to lowercase.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/toSource">toSource</a>: Returns an object literal representing the specified object; you can use this value to create a new object. Overrides the <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/Object/toSource">Object.toSource</a> method.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/toString">toString</a>: Returns a string representing the specified object. Overrides the <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/Object/toString">Object.toString</a> method.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/toUpperCase">toUpperCase</a>: Returns the calling string value converted to uppercase.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/valueOf">valueOf</a>: Returns the primitive value of the specified object. Overrides the <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/Object/valueOf">Object.valueOf</a> method.
</li></ul>
<h4 name="Methods_related_to_HTML"> Methods related to HTML </h4>
<ul><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/anchor">anchor</a>: Creates an <a class="external" href="http://www.w3.org/TR/html401/struct/links.html#adef-name-A">HTML anchor</a> that is used as a hypertext target.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/big">big</a>: Causes a string to be displayed in a big font as if it were in a <a class="external" href="http://www.w3.org/TR/html401/present/graphics.html#edef-BIG"><code>BIG</code> tag</a>.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/blink">blink</a>: Causes a string to blink as if it were in a <code>BLINK</code> tag.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/bold">bold</a>: Causes a string to be displayed as if it were in a <a class="external" href="http://www.w3.org/TR/html401/present/graphics.html#edef-B"><code>B</code> tag</a>.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/fixed">fixed</a>: Causes a string to be displayed in fixed-pitch font as if it were in a <a class="external" href="http://www.w3.org/TR/html401/present/graphics.html#edef-TT"><code>TT</code> tag</a>.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/fontcolor">fontcolor</a>: Causes a string to be displayed in the specified color as if it were in a <code>&lt;FONT COLOR="<i>color</i>"&gt;</code> tag.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/fontsize">fontsize</a>: Causes a string to be displayed in the specified font size as if it were in a <code>&lt;FONT SIZE="<i>size</i>"&gt;</code> tag.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/italics">italics</a>: Causes a string to be italic, as if it were in an <a class="external" href="http://www.w3.org/TR/html401/present/graphics.html#edef-I"><code>I</code> tag</a>.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/link">link</a>: Creates an <a class="external" href="http://www.w3.org/TR/html401/struct/links.html#adef-href">HTML hypertext link</a> that requests another URL.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/small">small</a>: Causes a string to be displayed in a small font, as if it were in a <a class="external" href="http://www.w3.org/TR/html401/present/graphics.html#edef-SMALL"><code>SMALL</code> tag</a>. 
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/strike">strike</a>: Causes a string to be displayed as struck-out text, as if it were in a <a class="external" href="http://www.w3.org/TR/html401/present/graphics.html#edef-STRIKE"><code>STRIKE</code> tag</a>.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/sub">sub</a>: Causes a string to be displayed as a subscript, as if it were in a <a class="external" href="http://www.w3.org/TR/html401/struct/text.html#edef-SUB"><code>SUB</code> tag</a>.
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/sup">sup</a>: Causes a string to be displayed as a superscript, as if it were in a <a class="external" href="http://www.w3.org/TR/html401/struct/text.html#edef-SUP"><code>SUP</code> tag</a>.
</li></ul>
<h3 name="Examples"> Examples </h3>
<h4 name="Example:_String_literal"> Example: String literal </h4>
<p>The following statement creates a string literal and assigns it to the variable <code>last_name</code>:
</p>
<pre class="eval">var last_name = "Schaefer";
</pre>
<h4 name="Example:_String_literal_properties"> Example: String literal properties </h4>
<p>The following statements evaluate to <code>8</code>, "<code>SCHAEFER</code>", and "<code>schaefer</code>":
</p>
<pre class="eval">last_name.length
last_name.toUpperCase()
last_name.toLowerCase() 
</pre>
<h4 name="Example:_Setting_an_individual_character_in_a_string"> Example: Setting an individual character in a string </h4>
<p>An individual character cannot be directly set in a string. Instead, a new string can be created using the <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/substr">substr</a> or <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/substring">substring</a> methods:
</p>
<pre class="eval">function setCharAt(str, index, ch) {
   return str.substr(0, index - 1) + ch + str.substr(index);
}

alert(setCharAt('scam', 2, 'p')); // outputs "spam"
</pre>
<h4 name="Example:_Pass_a_string_among_scripts_in_different_windows_or_frames"> Example: Pass a string among scripts in different windows or frames </h4>
<p>The following code creates two string variables and opens a second window:
</p>
<pre class="eval">var lastName = "Schaefer";
var firstName = "Jesse";
empWindow = window.open('string2.html', 'window1', 'width=300,height=300');
</pre>
<p>If the HTML source for the second window (<code>string2.html</code>) creates two string variables, <code>empLastName</code> and <code>empFirstName</code>, the following code in the first window assigns values to the second window's variables:
</p>
<pre class="eval">empWindow.empFirstName = firstName;
empWindow.empLastName = lastName;
</pre>
<p>The following code in the first window displays the values of the second window's variables:
</p>
<pre class="eval">alert('empFirstName in empWindow is ' + empWindow.empFirstName);
alert('empLastName in empWindow is ' + empWindow.empLastName);
</pre>
Revert to this revision