DEV Community

loading...

Beginner JavaScript - 8 - Strings

The Nerdy Dev
Building products is my profession, Creating content is my passion. We believe that Education should be freely accessible to everyone and no one should be deprived of it.
・Updated on ・3 min read

Hey everyone πŸ‘‹πŸ»,

In this article, let us discuss about the Strings in JavaScript. This is the eighth part of my Beginner JavaScript Series on Dev.

Strings in JavaScript - A complete picture

In JavaScript, the textual data stored in form of a series of characters is known as a string. Here in JavaScript, we don't have a separate type for a single character.

For example, if you have a sentence then that sentence is a series of characters so in the programming language, it is referred as a string of characters. A word itself is a string as well because it is composed of several characters like 'cricket', 'javascript' etc.

Let us now see how we can define strings using different types of quotes.

So we can use three types of quotes to define strings :

  1. Single Quotes
  2. Double Quotes
  3. Backticks

So let us see an example

// String in single quotes 
const wordInSingleQuotes = 'This is some string';

// String in double quotes 
const wordInDoubleQuotes = "This is string enclosed in double quotes";

const name = 'Alex';

// String in template strings (backticks)
const wishMe = `Good morning, ${name}`;  // interpolating name using template strings syntax. 
console.log(wishMe);  // logs Good morning, Alex

Enter fullscreen mode Exit fullscreen mode

Getting the length of strings

In JavaScript, to get the length of the string we can make use of the length property. Let us see an example for same :

const someVariable = "JavaScript is my favorite programming language"; 
console.log(someVariable.length); 
Enter fullscreen mode Exit fullscreen mode

Accessing characters

To extract a character at some position, say, position, use square brace notation like this : [position].
As an alternative we can also call the charAt method to extract a character sitting at some specific position.

Note : The first character starts from the zero position.

Let us see an example to understand how we can access characters in JavaScript.

const hello = "Hello JavaScript";

// 1. Using the square brace notation (indexing)
console.log(`The first character of our string is ${hello[0]}`); // H

// 2. Using the charAt method to get the first character of our string 
console.log( hello.charAt(0)); // H

// 3. Using the charAt method to get the last character of our string 
console.log(hello.charAt(hello.length-1)); // t 
Enter fullscreen mode Exit fullscreen mode

Iterating over characters using for...of

const hello = "Hello JavaScript";
for (let character of hello) {
  console.log(character);  
}
Enter fullscreen mode Exit fullscreen mode

The Immutability of Strings

Strings can’t be changed/mutated in JavaScript. It is impossible to change a character though you can definitely access it but you cannot set it to some other value.

const hello = 'Hello JavaScript';

hello[0] = 'h'; // does not work
console.log(hello[0]); // H (does not work)
Enter fullscreen mode Exit fullscreen mode

Let us see a couple of other methods in action:

const day = "Monday";

// 1. Change the string to lowercase completely. 
console.log(day.toLowerCase()); // monday

// 2. Change the string to uppercase completely. 
console.log(day.toUpperCase()); // MONDAY

// 2. To find the index of a character in the string, 
// we can make use of the indexOf method. If the character that we
// looking for does exists in the string, then we get the index for it else we get -1. 
const channelName = "the nerdy dev";
console.log(channelName.indexOf("t"));   // 0 
console.log(channelName.indexOf("O"));   // -1 

Enter fullscreen mode Exit fullscreen mode

So this is it for this one. If you want to learn about Strings, check out my video where I talk about Strings :

If you are looking to learn Web Development, I have curated a FREE course for you on my YouTube Channel, check the below article :

Looking to learn React.js with one Full Project, check this out :

πŸ‘‰πŸ» Follow me on Twitter : https://twitter.com/The_Nerdy_Dev

πŸ‘‰πŸ» Check out my YouTube Channel : https://youtube.com/thenerdydev

Discussion (0)