How to Convert a Bool to String Value in TypeScript ?

When we talk about converting a boolean to a string value in TypeScript, we mean changing the data type of a variable from a boolean (true or false) to a string (a sequence of characters). We have multiple approaches to convert a bool to a string value in TypeScript.

Example: let's say you have a variable isLogged that represents whether a user is logged in or not:

const isLogged: boolean = true;

If you need to use this boolean value as a string, you can convert it to a string representation using various methods, as discussed earlier. The result would be a new variable with a string data type:

const isLogged: boolean = true;
const isLoggedAsString: string = isLogged.toString();

Now, isLoggedAsString holds the string representation of the boolean value true as "true". This can be useful when you need to concatenate it with other strings, display it in a user interface, or pass it to functions or APIs that expect string values.

Below are the approaches used to Convert a bool to a string value in TypeScript:

Approach 1: Using Ternary Operator

The ternary operator is a concise way to write a conditional expression. It allows you to check a condition and choose between two values based on whether the condition is true or false.

Example: In this example, the ternary operator checks if myBool is true. If true, it assigns the string 'true'; otherwise, it assigns 'false'.

const myBool: boolean = true;
const boolAsString: string = myBool ? 'true' : 'false';
console.log(boolAsString); // Outputs 'true' or 'false'

Output:

true

Approach 2: Using Template Literal

Template literals are a convenient way to create strings in TypeScript. When you enclose an expression within ${}, it gets evaluated and included in the resulting string.

Example: In this example, the expression ${myBool} is evaluated, and the result is a string containing the boolean value converted to its string representation.

const myBool: boolean = true;
const boolAsString: string = `${myBool}`;
console.log(boolAsString); // Outputs 'true' or 'false'

Output:

true

Approach 3: Using toString()

The toString() method is available on primitive values, including booleans. It converts the boolean to its string representation.

Example: In this example, the toString() method is called on myBool, returning a string representation of the boolean value.

const myBool: boolean = true;
const boolAsString: string = myBool.toString();
console.log(boolAsString); // Outputs 'true' or 'false'

Output:

true

Approach 4: Using String Constructor

The String constructor can also be employed to convert boolean values to their string representation. By passing a boolean value to the String constructor, it automatically converts it into its string equivalent.

Syntax:

let bool: boolean = true;
let str: string = String(bool);

Example: In this example we converts a boolean value to its string representation using the String constructor and logs it. The result is either 'true' or 'false'.

const myBool: boolean = true;
const boolAsString: string = String(myBool);
console.log(boolAsString);

Output:

true

Approach 5: Using JSON.stringify()

In this approach, we use the JSON.stringify() method to convert a boolean to its string representation. This method converts JavaScript values to a JSON string, making it a versatile option for handling various data types, including booleans.

Example: The following example demonstrates how to use JSON.stringify() to convert a boolean to a string in TypeScript.

const isLogged: boolean = true;
const isLoggedAsString: string = JSON.stringify(isLogged);

console.log(isLoggedAsString);

Output:

true

Using concat() Method

The concat() method can be used to concatenate an empty string to a boolean, converting it to a string.

Syntax:

let str: string = boolValue.concat("");

Example: In this example, concatenating an empty string ("") to the boolean converts it to a string.

const boolValue: boolean = true;
const boolAsString: string = boolValue + "";
console.log(boolAsString);
console.log(typeof boolAsString);

true
string