String Type in TypeScript

A string is a sequence of characters used to represent text.

let name: string = "Rahul";

Here, "Rahul" is a string value.

You can declare a string variable using let.

let city: string = "Patna";

console.log(city);

The type annotation string tells TypeScript that city should contain text.

You can also create a string constant using const.

const country: string = "India";

console.log(country);

The variable cannot be reassigned because it is declared using const.

Strings can be written using double quotation marks.

let name: string = "Rahul";

let course: string = "TypeScript";

Both values are strings.

Strings can also be written using single quotation marks.

let name: string = 'Rahul';

let course: string = 'TypeScript';

Single quotes and double quotes can both be used for strings.

Template literals use backticks `. They are useful when creating strings that contain variables.

let name: string = "Rahul";

let message: string = `Hello ${name}`;

console.log(message);

The output will be:

Hello Rahul

You can explicitly specify the string type using a type annotation.

let studentName: string = "Amit";

let courseName: string = "JavaScript";

let city: string = "Patna";

All three variables are explicitly typed as strings.

TypeScript can automatically determine that a variable contains a string.

let name = "Rahul";

TypeScript infers the type of name as string.

A string variable declared using let can be reassigned to another string.

let city: string = "Patna";

city = "Delhi";

console.log(city);

The new value must still be a string.

A variable typed as string cannot receive a number.

let name: string = "Rahul";

// Error
// name = 100;

TypeScript prevents incompatible values from being assigned.

An empty string contains no characters.

let message: string = "";

console.log(message);

The variable still has the type string.

The length property returns the number of characters in a string.

let name: string = "Rahul";

console.log(name.length);

Output:

5

The toUpperCase() method converts letters to uppercase.

let name: string = "rahul";

console.log(name.toUpperCase());

Output:

RAHUL

The toLowerCase() method converts letters to lowercase.

let name: string = "RAHUL";

console.log(name.toLowerCase());

Output:

rahul

String concatenation means joining two or more strings together.

let firstName: string = "Rahul";
let lastName: string = "Kumar";

let fullName: string =
    firstName + " " + lastName;

console.log(fullName);

Output:

Rahul Kumar

Template literals make it easy to insert variables into strings.

let name: string = "Amit";
let course: string = "TypeScript";

let message: string =
    `My name is ${name} and I am learning ${course}.`;

console.log(message);

You can access a character using its index. The first character has index 0.

let name: string = "Rahul";

console.log(name[0]);
console.log(name[1]);

Output:

R
a

The includes() method checks whether a string contains another string.

let message: string =
    "Welcome to TypeScript";

console.log(
    message.includes("TypeScript")
);

The result is true.

The startsWith() method checks whether a string starts with a specified value.

let message: string = "Hello World";

console.log(
    message.startsWith("Hello")
);

The result is true.

The endsWith() method checks whether a string ends with a specified value.

let message: string = "Hello World";

console.log(
    message.endsWith("World")
);

The result is true.

The trim() method removes spaces from the beginning and end of a string.

let name: string =
    "   Rahul   ";

console.log(name.trim());

The output is:

Rahul

The substring() method can extract part of a string.

let text: string = "TypeScript";

let result: string =
    text.substring(0, 4);

console.log(result);

Output:

Type

The replace() method can replace part of a string.

let message: string =
    "Hello Rahul";

let result: string =
    message.replace(
        "Rahul",
        "Amit"
    );

console.log(result);

Output:

Hello Amit

Functions can accept string parameters and return strings.

function greet(name: string): string {

    return `Hello ${name}`;

}

console.log(
    greet("Rahul")
);

String values can be stored inside objects.

let student: {
    name: string;
    course: string;
} = {

    name: "Amit",
    course: "TypeScript"

};

console.log(student.name);
console.log(student.course);

You can create an array containing multiple strings.

let students: string[] = [
    "Amit",
    "Rahul",
    "Priya"
];

console.log(students);

Every element in this array is a string.

Strings are commonly used for text displayed in React Native applications.

import { Text } from "react-native";

const appName: string = "Student App";

function App() {

    return (
        <Text>
            {appName}
        </Text>
    );

}

Here, appName is explicitly typed as a string.

Text entered by a user is commonly handled as a string.

import { TextInput } from "react-native";

let userName: string = "";

<TextInput
    value={userName}
/>

This concept is useful when building login forms, registration forms, and other React Native applications.

Mistake 1: Assigning a number to a string variable.

let name: string = "Rahul";

// Error
// name = 100;

Mistake 2: Calling a string method on a number.

let age: number = 20;

// Incorrect
// age.toUpperCase();

Always make sure that the value and the operation match the type.