JavaScript Strings Tutorial

A JavaScript string is a series of characters enclosed in single or double quotes. In more recent versions of JavaScript, strings can also be enclosed in backticks with added features and flexibility; these are referred to as template literals.

A string is a primitive data type, yet JavaScript provides a String class with properties and methods for use with string literals and variables. Dot syntax is used to apply these properties and methods to string instances. For example, the length property returns the number of characters in a string. It is applied as follows:

var str = 'hello';
var len = str.length; // 5

String methods do not modify the strings they are applied to. Instead they return new strings. We demonstrate by applying the toUppercase method to an example string:

var str = 'hello';
var str2 = str.toUpperCase();
// display string returned by toUppercase
console.log( str2 ); // HELLO
// display original string
console.log( str ); // hello

As you can see, the toUpperCase method converts all the characters of the string to uppercase. What if we want to convert just the first character to uppercase?

JavaScript does not provide a large number of string methods, so when you want to accomplish something a little more complex, you have to be creative. Since the string methods return modified strings, we can chain them, applying subsequent methods to the results of the previous.

To convert the first letter of a string to uppercase, we combine the charAt, toUppercase, and slice methods as follows:

var str = 'hello';
var str2 = str.charAt(0).toUpperCase() + str.slice(1);
console.log( str2 ); // Hello

Using JavaScript String Methods

This tutorial describes JavaScript's string methods and demonstrates how to use them. We present them using a task-oriented approach:

The table below lists JavaScript string methods, gives a brief description of each, and provides links to the pages where they are discussed and demonstrated:

Name Description Page
indexOf Search string; return location of match or -1. Search
lastIndexOf Search string; return location of last match or -1. Search
search Search string using regular expression; return location of match or -1. Search
match Search string using regular expression; return array containing results. Match
replace Return new string resulting from regular expression search and replace. Replace
slice Return substring as specified by start and end locations in string. Slice
substring Similar to slice, but doesn't support negative integer arguments. Slice
split Return array of substrings by splitting string on separator you specify. Split
toUpperCase Return new string with all characters in uppercase. Basics
toLowerCase Return new string with all characters in lowercase.
charAt Return the character at the specified location. Basics
charCodeAt Return Unicode encoding of character at specified location.
fromCharCode Static method; return string from list of Unicode numeric encodings.
trim Return new string with whitespace removed from beginning and end.

Updates to the JavaScript specification have added new string methods. MDN maintains an up-to-date list complete with browser-support information.

Back to top