JavaScript - Strings and Methods

An index

is the position of a character within a string, and it is zero-based. This means that the first character of a string has an index of 0, the second character has an index of 1, and so on. For example, in the string hello, the character h is at index 0, e is at index 1, l is at index 2, and so on.

Bracket notation

uses square brackets ([]) and the index of the character you want to access. Let's look at an example: let greeting = "hello"; console.log(greeting[1]); // "e".

length property

To get the last character of a string, you can use the length of the string minus one. The length property of a string tells you how many characters it contains, so to access the last character, you would subtract one from the length: In this case, the length of hello is 5, and the last character (o) is at index 4 which is 5 - 1. let greeting = "hello"; console.log (greeting[greeting.length - 1]); // "o"

Get multiple characters index concat

let greeting = "hello"; let firstTwo = greeting[0] + greeting[1]; // "he" console.log(firstTwo); In this example, we are concatenating the first and second characters using bracket notation to form the string he.

The \n escape

sequence tells JavaScript to insert a line break at that point, which results in the string being displayed across multiple lines. let poem = "Roses are red,\nViolets are blue,\nJavaScript is fun,\nAnd so are you."; console.log(poem);

Backslash

escape the inner quotes by placing a backslash () before them: let statement = "She said, \"Hello!\""; console.log(statement); // She said, "Hello!" The backslash tells JavaScript to treat the quotes as literal characters, so they appear correctly in the output.

Single backslash

You can also escape other special characters, such as the backslash itself (\), or single quotes within a string surrounded by single quotes (\'). Here's another example using single quotes: let quote = 'It\'s a beautiful day!'; console.log(quote); // It's a beautiful day! By escaping the single quote with \', JavaScript knows to include it as part of the string rather than ending the string early.

Template literals

make it easier to create strings that span multiple lines or include expressions (like variables or even JavaScript code) directly within the string. template literals are defined with backticks (`).

Template literal example

const name = "Alice"; const greeting = Hello, ${name}!; console.log(greeting);

String interpolation

allows you to embed variables and expressions inside a string. This is a significant improvement over the older method, where you would concatenate strings and variables using the + operator.

substring

is a sequence of characters that appears within a larger string. For example, in the string hello world, hello and world are substrings.

The indexOf() method

in JavaScript allows you to search for a substring within a string.

indexOf()

returns the index (or position) of the first occurrence of that substring. If the substring is not found, indexOf() returns -1, which indicates that the search was unsuccessful.

Two Arguments indexOf()

indexOf() method takes two arguments: the first is the substring you want to find within the larger string, and the second is an option starting position for the search. If you don't provide a starting position, the search will begin at the start of the string.

Argument

is a value you give to a function or method when you call it, enabling that function or method to perform its task using the specific information you provide. You will learn more about arguments in future lessons.

Example1 typeOf

You can also specify where to begin searching within the string by providing a second argument to indexOf(). Here's an example: let sentence = "JavaScript is awesome, and JavaScript is powerful!"; let position = sentence.indexOf("JavaScript", 10); console.log(position); // 27 In this case, the search for JavaScript begins after the 10th character, and so the second occurrence of JavaScript is found at index 27.

Example2 typeOf

the following would return -1 because the capital letter F is not found in the string freeCodeCamp. console.log("freeCodeCamp".indexOf("F")) // -1

The prompt()

method takes two arguments: The first one is the message which will appear inside the dialog box, typically prompting the user to enter information. And the second one is a default value which is optional and will fill the input field initially prompt(message, default);

What exactly does the prompt() method do?

It opens a dialog box that asks the user for some input, and then it returns the text entered by the user as a string.

Prompt example

Show Prompt

const btn = document.getElementById("prompt-btn"); const output = document.getElementById("output"); btn.addEventListener("click", () => { const userName = prompt("What is your name?", "Guest"); output.textContent = "Hello, " + userName + "!"; });

Downsides of Prompt()

is useful for quick testing or small applications, it's generally avoided in modern, complex web applications due to its disruptive nature and inconsistent behavior across different browsers.

ASCII, short for American Standard Code for Information Interchange

is a character encoding standard used in computers to represent text. It assigns a numeric value to each character, which is universally recognized by machines.

The ASCII standard covers 128 characters including

Uppercase and lowercase English letters (A-Z, a-z). Numbers (0-9). Common punctuation marks and symbols (!, @, #, and so on). Control characters (such as newline and tab).

charCodeAt() method

This method is called on a string and returns the ASCII code of the character at a specified index. let letter = "A"; console.log(letter.charCodeAt(0)); // 65

fromCharCode() method

allows you to do the opposite: convert an ASCII code into its corresponding character. let char = String.fromCharCode(65); console.log(char); // A

The includes() method

is used to check if a string contains a specific substring. If the substring is found within the string, the method returns true otherwise, it returns false. let phrase = "JavaScript is awesome!"; let result = phrase.includes("Awesome"); console.log(result); // false. It is also case sensitive.

Includes() method example

For example, you might want to check if a user's input includes a specific word or character before performing some action. One way to achieve this is by using the includes() method.

The slice() method

allows you to extract a portion of a string and returns a new string, without modifying the original string. It takes two parameters: the starting index and the optional ending index. Let's look at a simple example of extracting part of a string: let message = “Hello, world!”; let greeting = message.slice(0, 5); console.log(greeting); // Hello

The toUpperCase() method

converts all the characters to uppercase letters and returns a new string with all uppercase characters. This is useful when you want to emphasize text or create consistency in the format of strings.

toUpperCase() example

let greeting = "Hello, World!"; let uppercaseGreeting = greeting.toUpperCase(); console.log(uppercaseGreeting); // "HELLO, WORLD!" The original string remains unchanged because toUpperCase() returns a new string, rather than modifying the original one.

The toLowerCase() method

converts all characters in a string to lowercase. This is helpful when you need to standardize input, such as when comparing user-provided text or making case-insensitive checks.

toLowerCase() example

= let shout = "I AM LEARNING JAVASCRIPT!"; let lowercaseShout = shout.toLowerCase(); console.log(lowercaseShout); // "i am learning javascript!"

The trim() method

is the most commonly used way to remove whitespace from both the beginning and the end of a string. let message = " Hello! "; console.log(message); // " Hello! "let trimmedMessage = message.trim(); console.log(trimmedMessage); // "Hello!"

trimStart()

removes whitespace from the beginning (or start) of the string.

trimEnd()

removes whitespace from the end of the string.