FUTM-CPT 211
Back-End Web Development
Language Fundamentals
JavaScript – Strings
12/02/2025
INTRODUCTION TO STRINGS
Strings are a type of data used to represent text.
A string is simply a sequence of characters, which can include letters, numbers, symbols, and
spaces
In JavaScript, strings are enclosed in single (' ') or double (" ") quotes.
let message = "Hello, World!";
Immutable: Once a string is created, it cannot be changed. If you want to modify a string,
you create a new string instead.
COMMON STRING METHODS
Length Property: Returns the number of characters in a string.
let text = "JavaScript";
[Link]([Link]); // Output: 10
Accessing Characters: Use square brackets [] or charAt() to access individual characters.
[Link](text[0]); // Output: "J"
[Link]([Link](4)); // Output: "S“
Changing Case: Convert a string to uppercase or lowercase.
[Link]([Link]()); // Output: "JAVASCRIPT"
[Link]([Link]()); // Output: "javascript“
Substrings: Extract parts of a string using slice(), substring(), or substr().
[Link]([Link](0, 4)); // Output: "Java"
[Link]([Link](4, 10)); // Output: "Script“
COMMON STRING METHODS CONT’
let text = "JavaScript";
Searching: Find the position of a substring using indexOf() or lastIndexOf().
[Link]([Link]("Script")); // Output: 4
[Link]([Link]("a")); // Output: 3
Replacing Content: Replace part of a string using replace().
[Link]([Link]("Java", "Type")); // Output: "TypeScript“
Trimming Whitespace: Remove whitespace from the beginning and end of a string using
trim().
let spacedText = " JavaScript ";
[Link]([Link]()); // Output: "JavaScript"
ARRAYS
An array is a collection of elements stored in a single variable. Arrays can hold
multiple values of any data type.
let colors = ["red", "green", "blue"];
Arrays are ordered collections, meaning the values (elements) are stored in a
specific sequence, and you can access them using their index (position).
Creation: You can create arrays using square brackets ([]).
Indexing: Like strings, arrays are zero-based, meaning the first element is at index
0, the second at index 1, and so on.
COMMON ARRAY METHODS
Accessing Elements: Use square brackets [] to access elements by their index (starting from 0).
[Link](colors[0]); // Output: "red"
Length Property: Returns the number of elements in an array.
[Link]([Link]); // Output: 3
Adding Elements:
push(): Adds an element to the end of the array.
[Link]("yellow");
[Link](colors); // Output: ["red", "green", "blue", "yellow"]
unshift(): Adds an element to the beginning of the array.
[Link]("orange");
[Link](colors); // Output: ["orange", "red", "green", "blue", "yellow"]
COMMON ARRAY METHODS CONT’
Removing Elements:
pop(): Removes the last element of the array.
[Link]();
[Link](colors); // Output: ["orange", "red", "green", "blue"]
shift(): Removes the first element of the array.
[Link]();
[Link](colors); // Output: ["red", "green", "blue"]
Finding Elements:
indexOf(): Returns the index of the first occurrence of an element.
[Link]([Link]("green")); // Output: 1
includes(): Checks if an element exists in the array.
[Link]([Link]("blue")); // Output: true
COMMON ARRAY METHODS CONT’
Slicing and Splicing:
slice(): Extracts a portion of the array.
[Link]([Link](1, 3)); // Output: ["green", "blue"]
splice(): Adds or removes elements at a specific position.
[Link](1, 1, "yellow"); // Replaces "green" with "yellow"
[Link](colors); // Output: ["red", "yellow", "blue"]
ARRAY ITERATION METHODS
forEach(): Executes a function for each element in the array.
[Link](function(color) {
[Link](color);
});
map(): Creates a new array by applying a function to each element.
let uppercaseColors = [Link](function(color) {
return [Link]();
});
[Link](uppercaseColors); // Output: ["RED", "YELLOW", "BLUE"]
ARRAY ITERATION METHODS
filter():
Creates a new array with elements that pass a test.
let longColors = [Link](function(color) {
return [Link] > 3;
});
[Link](longColors); // Output: ["yellow"]
reduce(): Reduces the array to a single value by applying a function.
let numbers = [1, 2, 3, 4];
let sum = [Link](function(total, num) {
return total + num;
}, 0);
[Link](sum); // Output: 10
KEY POINTS
Strings and arrays are fundamental data structures in JavaScript.
Use string methods to manipulate and extract text.
Arrays are versatile and can be modified using methods like push(), pop(), splice(),
etc.
Iteration methods like map(), filter(), and reduce() are powerful tools for working
with arrays.