VirtualMV/JavaScript/Strings
Overview
By the end of this page you will be able to:
|
String Literals
- A string literal is zero or more characters enclosed in double (") or single (') quotation marks.
- A string must be delimited by quotation marks of the same type; that is, either both single quotation marks or both double quotation marks.
- The following are examples of string literals:
- "qwerty"
- 'qwerty'
- "1234"
- "first line \n second line"
- 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.
Special characters
- The following table lists the special characters that you can use in JavaScript strings.
Character | Meaning |
\b | Backspace |
\f | Form feed |
\n | New line |
\r | Carriage return |
\t | Tab |
\v | Vertical tab |
\' | Apostrophe or single quote |
\" | Double quote |
\\ | Backslash character (\) |
Length (js4_01)
Properties | Comment |
Length | Returns the number of characters in a string |
<html> <head><title>JavaScript (js4_01)</title></head> <body> <script type="text/javascript"> var strX="JavaScript is great! " document.write("<p>" + strX + "</p>Length: ") document.write(strX.length) </script> </body> </html>
Example :Click here to run js4_01.
String methods
Method | Meaning (Returns..) |
anchor() | a string as an anchor |
big() | a string in big text |
blink() | a string blinking |
bold() | a string in bold |
charAt() | the character at a specified position |
concat() | two concatenated strings |
fontcolor() | a string in a specified color |
fontsize() | a string in a specified size |
indexOf() | the position of the first occurrence of a specified string inside another string (–1 if it never occurs) |
italics() | a string in italic |
lastIndexOf() | Returns the position of the first occurrence of a specified string inside another string (-1 if it never occurs). |
link() | Returns a string as a hyperlink |
match() | the specified string, or "null", instead of a numeric value (Similar to indexOf and lastIndexOf) |
replace() | Replaces some specified characters with some new specified characters |
search() | an integer if the string contains some specified characters, if not it returns -1 |
substr() | Returns the specified characters. 14,7 returns 7 characters, from the 14th character (starts at 0) |
substring() | the specified characters. 7,14 returns all characters from the 7th up to but not including the 14th (starts at 0) |
sup() | a string as superscript |
toLowerCase() | the string in lower case |
toUpperCase() | the string in upper case |
indexOf .. example (js4_02)
IndexOf() : Returns the position of the first occurrence of a specified string inside another string. Returns –1 if it never occurs
<html> <head><title>JavaScript (js4_02)</title></head> <body> <script type="text/javascript"> var strFind = "is"; var strX="Javascript is great!"; var intPos=strX.indexOf(strFind) if (intPos>=0){ document.write("In <b>'" + strX + "'</b> <br /> '" + strFind + "' was found at position: ") document.write(intPos + "<br />") } else { document.write(strFind + " not found!") } </script> </body> </html>
Example :Click here to run js4_02.
match .. example (js4_03)
match() : Similar to indexOf and lastIndexOf, but this method returns the specified string, or "null", instead of a numeric value
<html> <head><title>JavaScript (js4_03)</title></head> <body> <script type="text/javascript"> var strX = "Javascript is great!"; var strMatch1 = "great"; var strMatch2 = "not"; document.write("<p>String = " + strX + "<br />") document.write("Match1 ("+ strMatch1 + ") = " + strX.match(strMatch1) + "<br />") document.write("Match2 ("+ strMatch2 + ") = " + strX.match(strMatch2)+"</p>") </script> <p>This example tests if a string contains a specified word. If the word is found it returns the word.</p> </body> </html>
Example :Click here to run js4_03.
substr/substring .. example (js4_04)
substring() : Returns the specified characters. 7,14 returns all characters from the 7th up to but not including the 14th (starts at 0)
<html> <head><title>JavaScript (js4_04)</title></head> <body> <script type="text/javascript"> var strX= " Javascript is great! "; document.write("<p>" + strX + "</p>"); document.write("<p>substr(5,6) = "+ strX.substr(5,6) + "</p>"); document.write("<p>substring(5,6) = " + strX.substring(5,6) + "</p>"); </script> <p>The substr() method returns a specified part of a string. If you specify (5,6) the returned string will be from the fifth character (start at 0) and 6 long.</p> <p>The substring() method also returns a specified part of a string. If you specify (5,6) it returns all characters from the fifth character (start at 0) and up to, but not including, the sixth character.</p> </body> </html>
Example :Click here to run js4_04.
toUpperCase/toLowerCase .. example (js4_05)
<html> <head><title>JavaScript (js4_05)</title></head> <body> <script type="text/javascript"> var strX=("Hello JavaScripters!") document.write(strX.toLowerCase()) document.write("<br>") document.write(strX.toUpperCase()) </script> </body> </html>
Example :Click here to run js4_05.
LeftStr .. example (js4_06)
Some languages provide Left, Right and Mid string functions. JavaScript requires you to write your own (there is a sneaky way to do this using the split method and arrays but we'll leave that until arrays are covered). B. Devington Rayan (2002) [1] describes the JavaScript Left and Right string. A modified version is as follows:
<html> <head> <title>Left String example</title> <script type="text/javascript"> <!-- function fnLeftStr(strX, n){ if (n <= 0) return ""; else if (n > String(strX).length) return strX; else return String(strX).substring(0,n);}//--> </script> </head> <body> <div style="color: #0000FF"> <script type="text/javascript"> var strTest = "Hello World"; document.write('The first 5 characters of '+strTest); strResult = fnLeftStr(strTest,5); document.write(' are "'+strResult+'"'); </script> </div> </body> </html>
Example :Click here to run js4_06.
Exercise: Using String methods to reverse text (js4_07)
Create a JavaScript that takes "Firstname Lastname" input and reverses it to "Lastname, Firstname".
- For example "Neil Coomber" is converted to "Coomber, Neil"
Sample solution |
---|
Note:I have used substr and substring to show the difference, you could rewrite the code with either.
<script type="text/javascript"> <!-- function fnReverseName(strX){ var intSpace = strX.indexOf(" "); //Find out where space is in the string if (intSpace > 0) { var strFName = strX.substr( 0, intSpace); // gets string starting from 0 for a length of intSpace var strLName = strX.substring (intSpace+1, strX.length); //Gets astring starting from intSpace+1 ending at the length of the string return strLName+", "+ strFName; } else {return String(strX);} } //--> </script> </head> <body> <script type="text/javascript"> var strTest = "Neil Coomber"; document.write( strTest +"with the order changed becomes" ); document.write(' becomes "'+fnReverseName(strTest) + '"'); </script> </body> </html> |
Example :Click here to run js4_07_ReverseName.
References
- ↑ Rayan, B.D. (2002) Adding Left and Right Functionality in JavaScript. Retrieved November 1, 2009 from http://www.devx.com/tips/Tip/15222
virtualMV | Superquick wiki guide | Please give me some feedback |
VirtualMV/JavaScript/Strings. (2024). In WikiEducator/VirtualMV wiki. Retrieved December 10, 2024, from http:https://wikieducator.org/VirtualMV/JavaScript/Strings (zotero)
|