Lessons

JavaScript Basics

Operators in JavaScript

Conditional Statements in JavaScript

JavaScript Strings

JavaScript Arrays

JavaScript Loop

JavaScript Functions

Conclusion

Strings in JavaScript

JavaScript strings are used to store text. They are sequences of characters enclosed within quotes. You can work with strings in multiple ways, including single quotes, double quotes, and template literals.

JavaScript Strings with Quotes

A JavaScript string can be created using either single (' ') or double (" ") quotes, and both work the same way. Using quotes allows you to create text content within your code.

javascript
1
2
let greeting1 = "Hello, World!";  // Double quotes
let greeting2 = 'Hello, World!';  // Single quotes

Quotes Within Strings

When you need quotes inside a string, be sure they don’t match the surrounding quotes. For example, if you use double quotes to enclose a string, you can include single quotes inside, and vice versa.

javascript
1
2
let message1 = "It's a sunny day!";
let message2 = 'He said, "JavaScript is fun!"';

Alternatively, you can use escape characters (like a backslash \) to include both types of quotes inside a string.

Escape Characters in JavaScript Strings

  • \' inserts a single quote ' into a string.
  • \" inserts a double quote " into a string.
  • \\ inserts a backslash \ into a string.
  • \n inserts a new line (line break) into a string.
  • \t inserts a horizontal tab (adds a tab space) into a string.

Example:

javascript
1
2
let quote = "The instructor said, \"Practice makes perfect.\"";
let path = "C:\\Program Files\\JavaScript";

JavaScript Template Literals

Introduced in ES6, template literals make it easy to work with strings. They use backticks (`) instead of quotes and allow for embedding expressions and using multi-line strings.

Benefits of Template Literals:

  1. Multi-line Support: Easily write strings on multiple lines without breaking them up.
  2. Interpolation: Insert variables or expressions directly within the string.
javascript
1
2
3
4
5
6
7
let name = "Alice";
let greeting = `Hello, ${name}! How are you today?`;

let poem = `Roses are red,
Violets are blue,
JavaScript is fun,
And so are you.`;

Note: Template literals are not supported in older browsers like Internet Explorer.

Finding the Length of a String in JavaScript

You can find the length of a string using the .length property. This is useful for checking the length of text input, such as in form validation.

javascript
1
2
let text = "JavaScript";
let length = text.length;  // Outputs: 10

Breaking Long Strings for Readability

For long lines of code, you can break up strings by concatenating them with the + operator. This can make your code easier to read.

javascript
1
2
let message = "Learning JavaScript is " +
"both challenging and rewarding!";

Or, if you’re using a template literal, simply break it across multiple lines:

javascript
1
2
let message = `Learning JavaScript is 
both challenging and rewarding!`;

JavaScript Strings as Objects

Although you can create strings as objects using the new keyword, this is generally discouraged. Using new String() complicates code and may lead to unexpected results.

javascript
1
2
3
4
5
let str1 = "JavaScript";
let str2 = new String("JavaScript");

console.log(str1 == str2);  // true, values are the same
console.log(str1 === str2); // false, different types (string vs object)

Avoid creating strings as objects for better performance and simpler code.

Key Takeaways

  • Use single or double quotes to create strings in JavaScript.
  • Use escape characters to handle special characters within strings.
  • Template literals (``) are powerful for multi-line strings and variable interpolation.
  • Avoid using new String() to create strings, as it can cause type issues and slow down performance.

Frequently Asked Questions