[freeCodeCamp] Basic JavaScript - Strings

gutsytechster

Prashant Sharma

Posted on June 2, 2020

[freeCodeCamp] Basic JavaScript - Strings

Howdy fellows!

I hope you all are fine at this time of the pandemic. I am trying to utilize as much of my time as I can. So, I have started learning JavaScript from freeCodeCamp's JavaScript curriculum. This is the second post in the series, which I am writing to keep notes of my learning, which might help someone else. You can find my previous post here.

Let's get started

Strings

In JavaScript, a string can be written using any of the single or double quotes, as long as we start and end the string with the same quotation. For e.g.

var myString = "My name is Prashant";
var anotherString = 'I study in college';

In the above example, both myString and anotherString are valid strings in JavaScript.

Escaping literal quotes in JavaScript

When we need to insert a single or double quote within a string, we escape that character by pre-pending it by \ i.e. a backslash.  For e.g.

var myString = "It is a \"double quoted\" string";

would result in

It is a "double quoted" string;

However, you may not need to escape the string if your surrounding quotes are not same as what you want in the string. Let me give you an example

var myString = 'I am a "double quoted" string';

would give the same result as above. As you may notice, here we didn't need to escape the quote as the surrounding quote is a single quote (''), but what we used inside is a double quote.
Vice -versa would be true as well i.e. you may keep the double quotes for surrounding your string and use single quote inside of your string without escaping.

Other escape sequences in String

Apart from using escape sequence for multiple quotes within the same string, escape sequences are also used to type out characters which we may not be able to do otherwise. For e.g. a tab.

Some of the escape sequences present in JavaScript can be listed as

  • \' for single quotes
  • \" for double quotes
  • \\ for backslash, when you want to use backslash as a character in a string
  • \n for newline
  • \r for carriage return
  • \t for tab
  • \b for word boundary
  • \f for a form feed

String Concatenation

We can concatenate two strings using the + operator. For e.g.

var myString = "My name is Prashant" + " and I love programming.";

would give result as

"My name is Prashant and I love programming".

Make sure you give spaces where you want. Concatenation doesn't add spaces by itself. You may notice, I've provided a space in the second part of string concatenation.

You can use the shorthand += for concatenation as well. For e.g.

var myString = "My name is Prashant";
myString += " and I love programming";

This would give the same result as above.

We can use variables to store part of strings and then use them for concatenation. For e.g. the above example can also be written as

myName = "Prashant";
myHobby = "programming";

myString = "My name is " + myName + " and I love " + myHobby;

Finding the length of a string

To find the length of a string, we can make use of length property available to String data type as

var myString = "Prashant";
myString.length; // This would give us 8

Look carefully, how I have used the property using the .(dot)  with the variable.

You may directly use the string to access its length property instead of storing it to a variable like

"Prashant".length; // This would also give us 8

Accessing individual characters of a string

We can access each character of a string using indexes. In JavaScript, we have indexes start from 0. Indexes are used along with the bracket notation to access the characters as

var myStr = "Example";
myStr[0]; // This would give us the 1st character of myStr i.e. "E"
myStr[1]; // This would give use the 2nd character i.e. "x".

This was easy, wasn't it?

  • Accessing the last character of a string

When you want to get the last character of the string, you may not know the last index of the string. In such cases, we can make use of the length property, we just discussed above.

We know that length property gives us the length of a string. So can you now think of at what index would the last character of a string be? Yes, it would be the length - 1 as index starts with 0 in JavaScript.

For e.g. in the above example, Example has length 7 but the last index of this string is 6. I hope, now you get it.

myStr[myStr.length - 1];  // This would give you the last character of myStr
  • Accessing last to Nth character in a string

In a similar fashion as above, if you want to get the nth character from the last, you can access it using myStr.length - n, when n is the nth character from the last.

String Immutability in JavaScript

In JavaScript, strings are immutable i.e. once created you cannot alter the contents of a string. For e.g.

var myStr = "Pan";
myStr[0] = "C";

would result in the following error as we are trying to alter the contents of myStr.

TypeError: Cannot assign to read only property '0' of string 'Pan'

But this doesn't mean that we can't change the value of myStr. You can always reassign it to any other value. It's just that individual characters of a string cannot be changed.

Conclusion

In this post, we got familiar with the fundamentals of a string in JavaScript and how to manipulate and access them.

References

I will be talking about other JavaScript fundamentals in the next post. Till then, be curious and keep learning! :)

💖 💪 🙅 🚩
gutsytechster
Prashant Sharma

Posted on June 2, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related