Quick Reach
- 1 The strings in javascript
- 2 Declaring string variables
- 3 A string example by primitive type
- 4 Creating string as javascript object example
- 5 Dealing with special characters in strings
- 6 Useful javascript string functions and properties
- 7 A string length property example
- 8 Javascript replace method example
The strings in javascript
The string is the way to store a word or combination of words in string variables. The string variables are basically objects. The string object has properties and built-in functions that you can use to manipulate strings in Javascript.
This tutorial explains how to use strings with examples and at the bottom part you can see useful Javascript string functions’ links as well.
Declaring string variables
This is how you can create JS string as a primitive type:
var str_name = “Your name”;
You can also use new keyword with String to create a string:
var str_name = new String(“Your name”);
Normally you should use primitive type to create strings as these are faster in execution.
* A string in javascript is enclosed in single or double quotes.
A string example by primitive type
Following is an example of creating a string variable. We will create a string variable with primitive values.
Experience this example online
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<!DOCTYPE html>
<html>
<body>
<button onclick=“showalert()”>Show string</button>
<script type=“text/javascript”>
function showalert(){
var str_name = “Your name”;
alert (str_name);
}
</script>
</body>
</html>
|
Creating string as javascript object example
Following example creates a string javascript object by using the new keyword. To see demo online click the link below:
Experience this example online
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<!DOCTYPE html>
<html>
<body>
<button onclick=“showalert()”>Show string</button>
<script type=“text/javascript”>
function showalert(){
var str_name = new String(“Your name”);
alert (str_name);
}
</script>
</body>
</html>
|
Dealing with special characters in strings
As mentioned earlier you can use single or double quotes to enclose strings. What if your string contains quoted text? For example,
var str_quoted = (“This is “quoted” string”);
This is a wrong way to create a string in Javascript.
This is how a string with double quotes can be created by using a backslash:
var str_quoted = (“This is ”quoted” string”);
See following working example to learn more about this.
Javascript escape quotes example
Following is an example of using javascript escape quotes with backslash:
Experience this example online
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<!DOCTYPE html>
<html>
<body>
<button onclick=“showalert()”>JS string with javascript escape (backslash)</button>
<script type=“text/javascript”>
function showalert(){
var str_quoted = (“This is “quoted” string”);
alert (str_quoted);
}
</script>
</body>
</html>
|
As you can see, javascript escapes the quotes by using a backslash. The quotes can be seen in the alert.
Javascript escape characters
Similarly, you can use other javascript escape characters as follows:
- ” – To add double quotes in the string
- ’ – To add single quote in the string
- n – adds a line in the string
Useful javascript string functions and properties
Following are a few useful string functions and properties that you can use to manipulate strings. Click on any to go to its detailed chapter with online examples.
- String length (property)
- Javascript substring
- Javascript replace
- Javascript split string
- Slice method of string
- Trim
Let us look at a few string method examples.
A string length property example
Following is a javascript string length property example. The length property returns the total number of characters in a given string. As you click on the button, the number of characters in the string will be shown in an alert.
Experience this example online
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<!DOCTYPE html>
<html>
<body>
<button onclick=“showalert()”>string length</button>
<script type=“text/javascript”>
function showalert(){
var str = (“This is string tutorial!”);
alert (“The length of string is: “ + str.length);
}
</script>
</body>
</html>
|
Javascript replace method example
Following is a javascript replace method example. The replace method searches the string and returns a new string after replacing the given strings.
Experience this example online
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<!DOCTYPE html>
<html>
<body>
<button onclick=“showalert()”>string before and after replace</button>
<script type=“text/javascript”>
function showalert(){
var str = (“This is string tutorial!”);
var str_rep = str.replace(“javascript”,“JS”);
alert (“The string before replace: “ + str);
alert (“The string after replace: “ + str_rep);
}
</script>
</body>
</html>
|
The demo shows two alerts before and after Javascript string replace method.
Also see Javascript array
Leave A Comment?