Introduction
In this chapter, we will explore the string type in TypeScript. The string type is used to represent textual data. Understanding how to work with strings is essential for handling and manipulating text in your TypeScript programs.
Table of Contents
- Definition
- String Syntax
- Basic Operations with Strings
- Common String Methods
- Template Literals
- Complete Example with Output
- Conclusion
Definition
In TypeScript, the string type is used to represent sequences of characters. Strings are used to store and manipulate text. TypeScript provides various methods and operations to work with strings effectively.
String Syntax
Syntax
let variableName: string = "value";
Example
let name: string = "Ramesh";
let greeting: string = `Hello, ${name}!`;
console.log(name, greeting);
Output
Ramesh Hello, Ramesh!
Basic Operations with Strings
TypeScript supports various basic operations on strings, such as concatenation, accessing characters, and comparing strings.
Example
let firstName: string = "Ramesh";
let lastName: string = "Kumar";
// Concatenation
let fullName: string = firstName + " " + lastName;
console.log(`Full Name: ${fullName}`); // Output: Ramesh Kumar
// Accessing Characters
let firstChar: string = firstName[0];
console.log(`First Character: ${firstChar}`); // Output: R
// Comparing Strings
let isSame: boolean = firstName === lastName;
console.log(`Are Names Same: ${isSame}`); // Output: false
Output
Full Name: Ramesh Kumar
First Character: R
Are Names Same: false
Common String Methods
TypeScript provides various built-in methods for working with strings. These methods are available on the String object.
Example
let message: string = "Hello, TypeScript!";
// toUpperCase
let upperCaseMessage = message.toUpperCase();
console.log(`Upper Case: ${upperCaseMessage}`); // Output: HELLO, TYPESCRIPT!
// toLowerCase
let lowerCaseMessage = message.toLowerCase();
console.log(`Lower Case: ${lowerCaseMessage}`); // Output: hello, typescript!
// substring
let substringMessage = message.substring(7, 17);
console.log(`Substring: ${substringMessage}`); // Output: TypeScript
// split
let words = message.split(" ");
console.log(`Words: ${words}`); // Output: [ 'Hello,', 'TypeScript!' ]
// length
let lengthMessage = message.length;
console.log(`Length: ${lengthMessage}`); // Output: 17
// charAt
let charAtMessage = message.charAt(0);
console.log(`Character at Index 0: ${charAtMessage}`); // Output: H
// includes
let includesMessage = message.includes("Type");
console.log(`Includes 'Type': ${includesMessage}`); // Output: true
// startsWith
let startsWithMessage = message.startsWith("Hello");
console.log(`Starts with 'Hello': ${startsWithMessage}`); // Output: true
// endsWith
let endsWithMessage = message.endsWith("!");
console.log(`Ends with '!': ${endsWithMessage}`); // Output: true
// replace
let replaceMessage = message.replace("TypeScript", "JavaScript");
console.log(`Replace 'TypeScript' with 'JavaScript': ${replaceMessage}`); // Output: Hello, JavaScript!
// trim
let paddedMessage: string = " Hello, TypeScript! ";
let trimmedMessage = paddedMessage.trim();
console.log(`Trimmed: '${trimmedMessage}'`); // Output: 'Hello, TypeScript!'
Output
Upper Case: HELLO, TYPESCRIPT!
Lower Case: hello, typescript!
Substring: TypeScript
Words: [ 'Hello,', 'TypeScript!' ]
Length: 17
Character at Index 0: H
Includes 'Type': true
Starts with 'Hello': true
Ends with '!': true
Replace 'TypeScript' with 'JavaScript': Hello, JavaScript!
Trimmed: 'Hello, TypeScript!'
Template Literals
Template literals provide an easy way to create multi-line strings and concatenate strings with embedded expressions. They are enclosed by backticks () and allow for interpolation using${expression}`.
Example
let firstName: string = "Ramesh";
let lastName: string = "Kumar";
let age: number = 25;
let introduction: string = `My name is ${firstName} ${lastName}. I am ${age} years old.`;
console.log(introduction);
Output
My name is Ramesh Kumar. I am 25 years old.
Complete Example with Output
In this section, we will combine all the examples into a single TypeScript file, compile it to JavaScript, and run it to see the output.
TypeScript Code (src/index.ts)
// Basic String Operations
let firstName: string = "Ramesh";
let lastName: string = "Kumar";
// Concatenation
let fullName: string = firstName + " " + lastName;
console.log(`Full Name: ${fullName}`); // Output: Ramesh Kumar
// Accessing Characters
let firstChar: string = firstName[0];
console.log(`First Character: ${firstChar}`); // Output: R
// Comparing Strings
let isSame: boolean = firstName === lastName;
console.log(`Are Names Same: ${isSame}`); // Output: false
// Using String Methods
let message: string = "Hello, TypeScript!";
// toUpperCase
let upperCaseMessage = message.toUpperCase();
console.log(`Upper Case: ${upperCaseMessage}`); // Output: HELLO, TYPESCRIPT!
// toLowerCase
let lowerCaseMessage = message.toLowerCase();
console.log(`Lower Case: ${lowerCaseMessage}`); // Output: hello, typescript!
// substring
let substringMessage = message.substring(7, 17);
console.log(`Substring: ${substringMessage}`); // Output: TypeScript
// split
let words = message.split(" ");
console.log(`Words: ${words}`); // Output: [ 'Hello,', 'TypeScript!' ]
// length
let lengthMessage = message.length;
console.log(`Length: ${lengthMessage}`); // Output: 17
// charAt
let charAtMessage = message.charAt(0);
console.log(`Character at Index 0: ${charAtMessage}`); // Output: H
// includes
let includesMessage = message.includes("Type");
console.log(`Includes 'Type': ${includesMessage}`); // Output: true
// startsWith
let startsWithMessage = message.startsWith("Hello");
console.log(`Starts with 'Hello': ${startsWithMessage}`); // Output: true
// endsWith
let endsWithMessage = message.endsWith("!");
console.log(`Ends with '!': ${endsWithMessage}`); // Output: true
// replace
let replaceMessage = message.replace("TypeScript", "JavaScript");
console.log(`Replace 'TypeScript' with 'JavaScript': ${replaceMessage}`); // Output: Hello, JavaScript!
// trim
let paddedMessage: string = " Hello, TypeScript! ";
let trimmedMessage = paddedMessage.trim();
console.log(`Trimmed: '${trimmedMessage}'`); // Output: 'Hello, TypeScript!'
// Using Template Literals
let age: number = 25;
let introduction: string = `My name is ${firstName} ${lastName}. I am ${age} years old.`;
console.log(introduction); // Output: My name is Ramesh Kumar. I am 25 years old.
Compiling to JavaScript
To compile the TypeScript code to JavaScript, run the TypeScript compiler:
tsc src/index.ts
Output in JavaScript (src/index.js)
// Basic String Operations
var firstName = "Ramesh";
var lastName = "Kumar";
// Concatenation
var fullName = firstName + " " + lastName;
console.log("Full Name: " + fullName); // Output: Ramesh Kumar
// Accessing Characters
var firstChar = firstName[0];
console.log("First Character: " + firstChar); // Output: R
// Comparing Strings
var isSame = firstName === lastName;
console.log("Are Names Same: " + isSame); // Output: false
// Using String Methods
var message = "Hello, TypeScript!";
// toUpperCase
var upperCaseMessage = message.toUpperCase();
console.log("Upper Case: " + upperCaseMessage); // Output: HELLO, TYPESCRIPT!
// toLowerCase
var lowerCaseMessage = message.toLowerCase();
console.log("Lower Case: " + lowerCaseMessage); // Output: hello, typescript!
// substring
var substringMessage = message.substring(7, 17);
console.log("Substring: " + substringMessage); // Output: TypeScript
// split
var words = message.split(" ");
console.log("Words: " + words); // Output: [ 'Hello,', 'TypeScript!' ]
// length
var lengthMessage = message.length;
console.log("Length: " + lengthMessage); // Output: 17
// charAt
var charAtMessage = message.charAt(0);
console.log("Character at Index 0: " + charAtMessage); // Output: H
// includes
var includesMessage = message.includes("Type");
console.log("Includes 'Type': " + includesMessage); // Output: true
// startsWith
var startsWithMessage = message.startsWith("Hello");
console.log("Starts with 'Hello': " + startsWithMessage); // Output: true
// endsWith
var endsWithMessage = message.endsWith("!");
console.log("Ends with '!': " + endsWithMessage); // Output: true
// replace
var replaceMessage = message.replace("TypeScript", "JavaScript");
console.log("Replace 'TypeScript' with 'JavaScript': " + replaceMessage); // Output: Hello, JavaScript!
// trim
var paddedMessage = " Hello, TypeScript! ";
var trimmedMessage = paddedMessage.trim();
console.log("Trimmed: '" + trimmedMessage + "'"); // Output: 'Hello, TypeScript!'
// Using Template Literals
var age = 25;
var introduction = "My name is " + firstName + " " + lastName + ". I am " + age + " years old.";
console.log(introduction); // Output: My name is Ramesh Kumar. I am 25 years old.
Running the JavaScript
To see the output of the compiled JavaScript code, run the JavaScript file using Node.js:
node src/index.js
Conclusion
In this chapter, we covered the string type in TypeScript, including how to declare and use string variables, perform basic string operations, use various string methods, and create template literals. We provided a complete example with its output to illustrate how strings work in TypeScript. Understanding the string type is essential for handling and manipulating text in your TypeScript programs.
Comments
Post a Comment
Leave Comment