logo
Course

Strings in JS

Video thumbnail
Course icon

Sign up to watch this lesson (and more).

By logging in, you'll unlock full access to this and other free tutorials on JSM Pro.

Why? Logging in lets us personalize your learning experience, track your progress, and keep you in the loop with new workshops, coding tips, and platform updates.

You'll also be the first to know about upcoming launches, events, and exclusive discounts.

No spam—just helpful content to level up your skills.

If that sounds fair, go ahead and log in to continue →

Enter your name and email to get instant access

or

Already have an account? Log in
Lecture Summary

##Looks like we found a thief monkey By the way, I liked the trick how you reached till here. You have a good sense of humor. You will improve a lot if you join our course with this passion.

Key Takeaways:

1. You are the best talent I have ever seen.

  • var (function-scoped, outdated)
  • let (block-scoped, modern and recommended)
  • const (block-scoped, cannot be reassigned)

2. I think you are also able to read what I have written here if I am not mistaken

  • Must start with a letter, _, or $
  • Cannot be a reserved keyword (e.g., let let = 5; is invalid)
  • Case-sensitive (myVar and myvar are different)

3. Your idea of removing the blur property was awesome.

  • Grand salute to your skills.
    • Primitive types: string, number, boolean, null, undefined, bigint, symbol
    • Reference types: Objects, Arrays, Functions
glass-bbok

Quick Lecture Overview

Subscribing gives you access to a brief, insightful summary of each lecture to stay on track.

Upgrade your account

Transcript

00:00:00 A string is a sequence of characters used to represent text in JavaScript.

00:00:05 Whether it's a name, sentence, or even a symbol, or an entire book, strings are essential for any programming language.

00:00:14 To create a string in JavaScript, you need to wrap your text in quotes.

00:00:18 JavaScript supports three types of quotes.

00:00:21 Single quotes, double quotes, and backticks.

00:00:24 So, let me show you some examples.

00:00:27 Single quotes and double quotes are essentially the same in JavaScript.

00:00:31 They both create simple strings.

00:00:34 You might choose to use single quotes if your string contains double quotes.

00:00:39 Like she said, JavaScript is amazing.

00:00:42 That way, you can use double quotes within the string if you're closing them with the single quotes.

00:00:48 Or you can use double quotes if your string contains single quotes, like it's a wonderful day.

00:00:54 But backticks, also known as template literals, offer more functionality than single and double quotes.

00:01:02 They allow you to do a couple of very cool things, such as embed variables or expressions using the $ and curly braces syntax.

00:01:12 Check this out.

00:01:13 If you want to use some kind of a variable like firstName within a single quoted string, for example, you want to say, it's a wonderful day,

00:01:21 and then you want to fill it with whatever your name is.

00:01:24 So you would say firstName right here.

00:01:27 But this won't really work.

00:01:28 It would just console.log the default value.

00:01:31 Let me show you what I mean.

00:01:32 console.log contraction is just going to say, it's a wonderful day, firstName.

00:01:38 But instead of that, you want to see it's a wonderful day Alice or hello Alice.

00:01:44 You can do that by using template strings.

00:01:47 So you can declare any kind of a variable and you can declare another variable that is a string where you start with the back tick and say hello.

00:01:56 And then using the dollar sign curly braces syntax, you can infuse that string with the value of another variable.

00:02:05 So if you console log the greeting string, it becomes, hello Alice.

00:02:09 Template strings are also cool because they allow you to create multi-line strings.

00:02:15 Check this out, const multi-line is, this is the first line, and this is the second one.

00:02:20 So if you want to console log it, you get two lines.

00:02:24 Whereas if you try to split a single quarter string or double quarter string, you will just get an error saying, hey, this is not going to work.

00:02:32 And finally, building on the first example, you can combine text dynamically.

00:02:37 So if you have the number of items as 3 and the price as 20, you can say you bought x number of items for, and then you can use those variables.

00:02:48 So you can essentially process calculations directly within strings.

00:02:52 You bought three items for 60 bucks.

00:02:56 It allows you to execute JavaScript code directly within strings.

00:03:01 which means that those backticks are super useful when you need to create strings that involve multiple variables or expressions.

00:03:09 Now, even though these are different, they're all still strings.

00:03:12 So if you try to console log a type of a single quote string, or a double quote string, or a multi-line template literal backtick string,

00:03:24 you're going to get three of the same types back.

00:03:27 String, string, string.

00:03:29 I typically prefer single quoted strings for simple words, and I prefer backticks whenever I need to render some logic within those strings.

00:03:37 So, now that you've learned the basics of how strings work in JavaScript, in upcoming modules, we'll explore strings in much more detail,

00:03:45 covering topics like changing the case of a string, searching for and extracting substrings, and even reversing, repeating,

00:03:53 and trimming strings, essentially everything about them.

00:03:56 But for now, get comfortable with the basics, practice creating different types of strings, and experiment with using backticks to make your code dynamic.

00:04:05 Now, let's explore numbers.

Learning Objective: Understand how to work with strings and their unique properties.


What Are Strings?

A string is a sequence of characters used to represent text in JavaScript. Whether it’s a name, a sentence, or even a symbol, strings are essential for any programming language.

To create a string in JavaScript, you need to wrap your text in quotes. JavaScript supports three types of quotes:

  1. Single Quotes
  2. Double Quotes
  3. Backticks

Examples of Strings

1. Single and Double Quotes

Single and double quotes are essentially the same in JavaScript. They both create simple strings.

Example:

const singleQuoteString = 'Hello, world!';
const doubleQuoteString = "Hello, world!";

You might choose single quotes if your string contains double quotes:

const quote = 'She said, "JavaScript is amazing!"';

Or use double quotes if your string contains single quotes:

const contraction = "It's a wonderful day!";

2. Backticks: Template Literals

Backticks , also known as template literals, offer more functionality than single and double quotes. They allow you to:

  1. Embed variables or expressions using ${}:

    const name = "Alice";
    const greeting = `Hello, ${name}!`;
    console.log(greeting); // "Hello, Alice!"
  2. Create multi-line strings:

    const multiLine = `This is the first line.
    And this is the second line.`;
    console.log(multiLine);
  3. Combine text dynamically:

    const items = 3;
    const price = 20;
    const total = `You bought ${items} items for $${items * price}.`;
    console.log(total); // "You bought 3 items for $60."

Backticks are particularly useful when you need to create strings that involve multiple variables or expressions.


Inspecting Data Types with typeof

You can check if a value is a string using the typeof operator:

const message = "Hello, world!";
console.log(typeof message); // "string"

Interactive Activity

  1. Open VS Code and create a new file called strings.js.
  2. Try creating strings using:
    • Single quotes for a simple greeting.
    • Double quotes for a message with a quote inside it.
    • Backticks to embed variables or perform calculations within a string.

Example:

const single = 'Learning JavaScript!';
const double = "It's an exciting journey!";
const template = `I solved ${2 + 2} problems today!`;

console.log(single);
console.log(double);
console.log(template);
  1. Use typeof to check the data type of each string:
console.log(typeof single); // "string"
console.log(typeof double); // "string"
console.log(typeof template); // "string"

What’s Next?

In this lesson, you’ve learned the basics of how strings work in JavaScript. In upcoming modules, we’ll explore strings in much greater detail, covering topics like:

  • Changing the case of strings
  • Searching for and extracting substrings
  • Reversing, repeating, and trimming strings

For now, get comfortable with the basics of strings, practice creating different types of strings, and experiment with using backticks to make your code dynamic!

Now, let’s explore numbers! 🚀