Skip to content

Strings

String Variables

We have to process lots of strings (characters) in programs a lot too. So variables will often contain strings.

Strings are a series of characters surrounded by double or single quotes.

"This is a string"
"This isn't a number"
"99"
'This is a string too'
'The cow says, "moo"'
"Fred"
"Bert"
"Ernie"

You have to have quotes around a string.

  • If a string is surrounded by double quotes then you can have single quotes inside the string.
  • If a string is surrounded by single quotes then you can have double quotes inside the string.
  • That's clever!
  • But, sometimes we need to put a character into a string that is special, like a tab. How do we do that?

Coding Standard

Strings

All string literal must use double quotes.

Escape Characters

Here's a list of characters that we need to be able to embed into strings.
To embed them in a string you just type the code with the backslash.

Code Special Character
\t Tab
\n New Line
\\ Literal backslash
\" Double Quote
\' Single Quote

Example of an escaping character

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
function demoEscapingSpecialCharacters() {
    // Embedding special characters
    let tabInThisVariable;
    let aNewLineInTheMiddle;

    tabInThisVariable = "This is a tab\tand this is after it";

    aNewLineInTheMiddle = "This line has a newline\nin its middle.";

    document.write(tabInThisVariable);
    document.write("<br />");
    document.write(aNewLineInTheMiddle);
}

Single Quote Example

1
2
3
4
5
6
7
8
function demoEscapingSingleQuote() {
    // Adding a single quote
    let output;

    output = 'Here\'s a single quote.';

    document.write(output);
}

Double Quote Example

1
2
3
4
5
6
7
8
function demoEscapingDoubleQuote() {
    // Adding a double quote
    let output;

    output = "A double quote (\") is embedded in this string.";

    document.write(output);
}

Single and Double Quote Example

1
2
3
4
5
6
7
8
function demoEscapingQuotes() {
    // Adding single and double quote
    let output;

    output = "Here's a string with a single quote and some \"double quotes\".";

    document.write(output);
}

Tab Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
function demoEscapingTabs() {
    // Adding tab characters

    let outputOne;
    let outputTwo;

    outputOne = "One\tTwo\tThree\tFour";
    outputTwo = "1\t2\t3\t4";

    document.write(outputOne);
    document.write("<br />");
    document.write(outputTwo);
}

The .length Property

  • There are lots of methods in JavaScript that let us manipulate strings. However, one of the most famous things associated with strings is not a method, but rather a "property." (A "property" is just object-oriented talk for a characteristic of an object.)  Here is a famous property of a string.
  • Length of a string: You use the ".length" property
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
function demoLengthProperty() {
    // The length of a string
    let mysteryString;
    let whatWillThisBe;

    mysteryString = "This is a string";
    whatWillThisBe = mysteryString.length;

    document.write("The mystery variable is ");

    document.write(whatWillThisBe);
}

Line Continuation

When you have JavaScript statement that exceed more than one line, you can concatenate them together.

1
2
3
4
5
6
// really long string
document.write("Here's an example of text that is so long we need to split "
        + "it into more lines. We call that a line continuation. We use "
        + "eight spaces from the beginning of the line of code. If we need "
        + "to have more split lines they will all be indented "
        + "eight spaces.");

Here's an example using variables. Variables do not have quotes around them, so you have to concatenate each variable with a string.

1
2
3
4
5
6
7
let numberOfLearningUnits;

numberOfLearningUnits = 5;

// really long string with variables
document.write("This course consists of " + numberOfLearningUnits
        + " Learning Units. Each unit consists of multiple parts. ");

Coding Standard

Indentation

If a line of code is too long to fit on one line of the text editor (see Line Length standard below), the continuation of the line must be indented in by eight (8) spaces to visually emphasize that this line is a continuation.

Read more

Related Reading

Pages 161 - 166 — Same as numbers, this jumps ahead pretty quickly. Read on if you'd like, but know we'll talk more about strings in Unit 2.

Hands on work

Demo

  1. String Variables
    • unit01/demos/demo-strings.html

Labs

  1. String Variables
    • unit01/labs/lab-06-stringVariables.html

Exercises

  1. Lab06 exercise
    • unit01/exercises/exercise-06.html