JavaScript:
Strings
P R O F I SI E BÖ R GER - 2 0 2 4
DR M M OYO - 2025
I NF O R MATION SY STE M S 2 0 2
Overview
•Understand string data
•Use string variables
•Understand string concatenation
•Changing strings to numbers
•Changing numbers to strings
•Explore some of the string manipulations
methods
Strings
•A string literal constant is a sequence of characters that are directly written in the
code
◦ Literal refers to the fact that the characters enclosed within the quotation marks should be
taken literally
◦ Constant refers to the fact that the string’s value does not change while the program is
running
•A string variable is a named memory location that stores a reference to a string value
that can be changed during runtime.
◦ Strings can be words such as “Peter Pan”, “R100.34”, “2013 Sales”, “03F2345”, etc.
•Be careful not to confuse a string variable with a string literal constant
Template literals
•Template literals, also known as template strings, are a feature in
JavaScript that allows for easier string interpolation and multi-line
strings
◦ Multi-line strings
◦ We can embed variables in strings using the syntax ${ }
◦ Provides an easy way to interpolate variables into strings
Insert (something
of a different
nature) into
something else
String Variables
•A string variable is a memory cell that can store a string, which is
zero or more characters enclosed in quotation marks (“”)
•String variable is used to store text
•NOTE:
◦ “” - empty string
◦ “ “ - space character
Assigning strings to string variables
•Assignment statements are so named because they assign values to
the memory cells inside the computer
•When you assign a new value to a memory cell, the new value
replaces the old value, because a memory cell can store only one
value at a time
let fullName = “Peter Pan”;
let firstName = “Peter”; fullName = “Chadwick Boseman”;
let code911 = “Call 911 now!”;
Joining Strings
•Joining strings together is called concatenation
◦ result is a new string
•You concatenate strings with the concatenation operator (+)
◦ overloaded – used for joining strings and addition
let firstName = “Moses”;
let lastName = “Sinyoro”;
let town = “Makhanda”;
let sentence = firstName + lastName + “lives in” + town;
Result: “MosesSinyorolivesinMakhanda”
sentence = firstName + “ “ + lastName + “ lives in “ + town;
Result: “Munya Katurura lives in Makhanda”
Joining Strings
Joining Strings
[Link](3 + 3 + “words”); 6words
[Link](3 + “words” + 3 ); 3words3
[Link](“words” + 3 + 3 ); words33
•Operands on either side of the + operator are first evaluated to see if they are
strings or numbers
•If one or both are strings then concatenation applies
•If both are numbers, then addition applies
3 + 3 + “words” 6 + “words” “6words”
Left to Right
Changing strings to numbers
•Convert a string to a number by using the method Number():
◦ sometimes you will have strings that represent numbers, such as “10”
or “10.1”
◦ the method converts the string into a number, and it then returns the
number
◦ the string can contain only numbers and the full stop/dot (.)
let num1 = “10”;
let num2 = “10.1”;
let x = Number(num1);
let y = Number(num2);
Changing strings to numbers
•First creates a temporary copy of the string in memory; it
then converts the contents of the copy to a number
•When an invalid character is in the string NaN (Not a
Number) will be returned Number(“456”) // 456
Number(“24,789”) // NaN
Number(“39%”) // NaN
Number(“R123.89”) // NaN
Number(“cat”) // NaN
Number(“ “) // 0
Number(“10.1”) // 10.1
Number(“”) // 0
Changing Numbers to Strings
•Use the method toString()
let x = 10;
let y = 10.1;
let num1 = toString(x);
let num2 = toString(y);
Changing the appearance
of strings
•Several string methods can be used to
manipulate strings:
◦ toUpperCase()
◦ returns a copy of the string in uppercase
◦ toLowerCase()
◦ returns a copy of the string in lowercase
◦ replace(find, replace)
◦ returns a copy of the string where all specified characters have
been replaced with others
◦ trim()
◦ returns a copy of the string where the spaces have been
removed from beginning and end of a string (but NOT the
interior). To limit to just the beginning trimStart() or just the
end trimEnd()
Changing the appearance of strings
let name = “Will Smith”;
let big = [Link](); // “WILL SMITH”
let small = [Link](); // “will smith”
let changed = [Link](“W”, “B”); // “Bill Smith”
let spaces = “ Will Smith “;
let removeSpaces = [Link](); // “Will Smith”
Working with Strings
•Escape characters and sequences
◦ An escape character is placed before characters within strings to
indicate that they are to be treated as regular keyboard
characters, not as syntax
◦ JavaScript’s escape character is the backslash (\)
◦ Escape sequence: combination of an escape character with a
specific character, usually to carry out a special function
Working with Strings
String indexing
•Each character in a string has an index position
•JavaScript strings start at index position 0
var words = “The moon”;
0 1 2 3 4 5 6 7
T h e m o o n
Searching strings (finding the
start position of a substring)
•Searching for substrings within a text string
◦ The startsWith(), endsWith(), and includes() methods indicate
whether a text string contains a specified substring (group of
characters); returning a Boolean value
◦ Whitespace character: any blank or nonprintable character (e.g.,
space, tab, line break)
•Search a string to find the index of the first occurrence:
◦ indexOf(string)
◦ The method returns a number that represents the starting
position (first occurrence only) of one string within another
•Find the last occurrence of a substring using
lastIndexOf()
◦ Both returns -1 if not found
More working with strings
let sentence = "This is my stringy string";
let subsentence = [Link]("stringy");
[Link](subsentence); //returns true
subsentence = [Link]("word");
[Link](subsentence); //returns false
let words = “The moon”;
let position = [Link](“moon”); // returns 4
let spacePosition = [Link](“ “); // returns 3
0 1 2 3 4 5 6 7
T h e m o o n
Extracting substrings
number of characters
•Extract a substring from a string: to extract (deprecated
method)
◦ substr(startIndex, length)
◦ substring(startIndex, endIndex) endIndex not included
•If no length is provided, then extraction will take place to end of the
string (both methods)
•A new string is created and returned
•To return the character at a specific index position:
◦ charAt(index)
Extracting substrings
let name = “Will Smith”;
let firstName = [Link](0, 4); // Will
let lastName = [Link](5); // Smith
let character = [Link](5) // S
String length
•Every string has a length; a property of all strings
•Every character - no matter what it is, is counted in
the length property
•The property is a number that represents the number of characters
in the string
let name = “Will Smith”;
let howLong = [Link]; // 10
Example
How will the output be different if
we printed the output to the
console??