• JavaScript Video Tutorials

JavaScript String charAt() Method



The JavaScript String charAt() method returns a new string with a single character from the original string at a given index. An index is the position of a character in a string, starting from 0 for the first character and ending with n-1 for the last character, where n is the length of the string.

Note − This method returns an empty string if the given index value is outside the range of 0 to str.length-1. It also treats a white-space as a valid character and includes it in the output.

Syntax

Following is the syntax of JavaScript String charAt() method −

charAt(index)

Parameters

This method takes an optional parameter called 'index', which is explained below −

  • index − The index (position) of the character.

Return value

This method returns a character at the specified index.

Example 1

When we omit the index parameter, the charAt() method assumes its index parameter default value as 0 and returns the first character, 'T', in the given string "Tutorials Point".

<html>
<head>
<title>JavaScript String charAt() Method</title>
</head>
<body>
<script>
   const str = "Tutorials Point";
   document.write("str = ", str);
   document.write("<br>str.charAt() returns = ", str.charAt());
</script>
</body>
</html>

Output

The above program returns defualt index(0) character 'T'.

str = Tutorials Point
str.charAt() returns = T

Example 2

If we pass the index value as 6 to this method, it returns a new string with a single character at the specified index.

The following is another example of the JavaScript String charAt() method. Here, we are using this method to retrieve a string with a single character in the given string "Hello World" at the specified index 6.

<html>
<head>
<title>JavaScript String charAt() Method</title>
</head>
<body>
<script>
   const str = "Hello World";
   document.write("str = ", str);
   let index = 6;
   document.write("<br>index = ", index);
   document.write("<br>The character at index ", index ," is = ", str.charAt(index));
</script>
</body>
</html>

Output

After executing the above program, it returns a charcter 'W' at the specified index 6.

str = Hello World
index = 6
The character at index 6 is = W

Example 3

When the index parameter is not between 0 and str.length-1, this method returns an empty string.

We can verify the fact that the charAt() method returns an empty string if the index parameter is out of the range of 0-str.length-1 by executing the program below.

<html>
<head>
<title>JavaScript String charAt() Method</title>
</head>
<body>
<script>
   const str = "JavaScript";
   document.write("str = ", str);
   document.write("<br>str.length = ", str.length);
   let index = 20;
   document.write("<br>index = ", index);
   document.write("<br>The character at index ", index , " is = ", str.charAt(index));
</script>
</body>
</html>

Output

It will return an empty string for an index value, which is out of range as −

str = JavaScript
str.length = 10
index = 20
The character at index 20 is =

Example 4

This example demonstrates the real-time usage of the charAt() method. It counts the spaces and the words in a given string "Welcome to Tutorials Point".

<html>
<head>
<title>JavaScript String charAt() Method</title>
</head>
<body>
<script>
   const str = "Welcome to Tutorials Point";
   document.write("Given string = ", str);
   let spaces = 0;
   for(let i = 0; i<str.length; i++){
      if(str.charAt(i) == ' '){
         spaces = spaces + 1;
      }
   }
   document.write("<br>Number of spaces = ", spaces);
   document.write("<br>Number of words = ", spaces + 1);
</script>
</body>
</html>

Output

The above program counts and returns the number of spaces and words in a string.

Given string = Welcome to Tutorials Point
Number of spaces = 3
Number of words = 4
Advertisements