EasyCode365EasyCode365

Strings and Text

Welcome to the world of text in JavaScript! Whenever you see a welcome message on a website, a username on a screen, or an error alert, you are looking at text. In this lesson, you will learn how to write text in your code and combine words to create useful messages.

What is a String?

In programming, a piece of text is called a string. You can think of it as a string of letters, numbers, or symbols tied together in a line. A string can be as short as a single letter, or as long as an entire book.

How to Write Strings with Quotes

To tell JavaScript that a word is a string of text and not a command or piece of code, you must wrap it in quotes.

JavaScript gives you three ways to wrap your text:

  • Single quotes: 'Hello'
  • Double quotes: "Hello"
  • Backticks: `Hello`

All three ways are valid and work perfectly for writing basic text!

Combining Strings with Variables

Often, you will want to mix normal text with a variable (a named container that holds data). For example, you might want a program to say "Hello" followed by a user's specific name.

When you want to combine text and variables easily, backticks are often the easiest choice. Backticks allow you to insert variables directly into the text using a special placeholder that looks like this: ${variableName}.

First Code Example

Here is how we create a simple personalized greeting and show it in the output section using console.log().

Can edit
const firstName = "Alex";
const greeting = `Hello, ${firstName}!`;
console.log(greeting);

Step-by-Step Explanation

Let's break down exactly what is happening in the code above:

  • const firstName = "Alex"; We create a variable named firstName and store the string "Alex" inside it. We used double quotes here to wrap our text.
  • const greeting = `Hello, ${firstName}!`; We create a second variable named greeting. We use backticks here so we can drop the firstName variable right into the middle of the text using the ${} placeholder.
  • console.log(greeting); We use the console.log() command to send our final message to the output section below the code. After you click Run, you should see: Hello, Alex!.

Mini Task

Try it yourself in the editable code block above.

  1. Change "Alex" to your own name.
  2. Click Run.
  3. Check the output below the code and watch the message update.

Short Quiz

Question: Which character is best to use when you want to easily combine text with a variable? A) Single quotes (') B) Double quotes (") C) Backticks (`)

Answer: C! Backticks are special because they allow you to use the ${} placeholder to inject variables directly into your strings.

Small Challenge

Can you write a short program that prints a message about your favorite color?

  1. Create a variable called favoriteColor and set it to a string (like "blue" or "green").
  2. Create a variable called message using backticks.
  3. Use the backticks and your variable to make the message say "My favorite color is blue."
  4. Print the message in the output section using console.log().
Can edit
// put your code below

console.log()

Summary

  • A string is the programming term for text.
  • Strings must be wrapped in single quotes, double quotes, or backticks to work properly.
  • Backticks are incredibly useful because they let you easily combine text and variables to build dynamic, personalized messages.
  • You can use console.log() to send your strings to the output section and see the results of your code.