Convert a String to a Boolean and vice versa in TypeScript

# Table of Contents

1. Convert a String to a Boolean in TypeScript
2. Convert a Boolean to a String in TypeScript

# Convert a String to a Boolean in TypeScript

To convert a string to a boolean, use the strict equality operator to compare the string to the string "true".

If the condition is met, the strict equality operator will return the boolean value true, otherwise false is returned.

Copied!
// ✅ if the string is equal to "true" or "false"
const str1 = 'true';
const bool1 = str1 === 'true'; // 👉️ true

// ✅ if the string might be Uppercase or Title Case
const str2 = 'False';
const bool2 = str2.toLowerCase() === 'true'; // 👉️ false

If you need to convert a boolean to a string, click on the following subheading:

• Convert a Boolean to a String in TypeScript

The strict equality (===) operator checks if the values on the left and right-hand sides are equal and returns true if they are, and false otherwise.

If the string is equal to the string "true", the operator returns the boolean true and assigns it to the variable.

In all other cases, the value of the variable is false.

If you have to do this often, define a reusable function.

Copied!
function strToBool(str: string) {
  return str.toLowerCase() === 'true';
}

console.log(strToBool('true')); // 👉️ true
console.log(strToBool('True')); // 👉️ true
console.log(strToBool('false')); // 👉️ false
console.log(strToBool('abc')); // 👉️ false

The function takes a string as a parameter and converts it to its boolean equivalent.

To convert any other string to a boolean, use the Boolean object.

# Convert a String to a Boolean using regex

You can also use the RegExp.test() method to convert a string to a boolean.

Copied!
function strToBool(str: string) {
  return /true/.test(str);
}

console.log(strToBool('true')); // 👉️ true
console.log(strToBool('True')); // 👉️ false
console.log(strToBool('false')); // 👉️ false
console.log(strToBool('abc')); // 👉️ false
console.log(strToBool('is true')); // 👉️ true

The RegExp.test method returns true if the regular expression is matched in the string and false otherwise.

We called the test() method on a regular expression.

The forward slashes / / mark the beginning and end of the regular expression.

If the string "true" is contained in the string, we get a match.

If you only want to return true if the entire string is equal to "true", update the regex.

Copied!
function strToBool(str: string) {
  return /^true$/.test(str);
}

console.log(strToBool('true')); // 👉️ true
console.log(strToBool('True')); // 👉️ false
console.log(strToBool('false')); // 👉️ false
console.log(strToBool('abc')); // 👉️ false
console.log(strToBool('is true')); // 👉️ false

The caret ^ symbol matches the beginning of the input and the dollar sign $ matches the end of the input.

If you want to make the regular expression case-insensitive, use the i flag.

Copied!
function strToBool(str: string) {
  return /^true$/i.test(str);
}

console.log(strToBool('true')); // 👉️ true
console.log(strToBool('True')); // 👉️ true
console.log(strToBool('false')); // 👉️ false
console.log(strToBool('abc')); // 👉️ false
console.log(strToBool('is true')); // 👉️ false

The i flag allows us to perform a case-insensitive search in the string.

# Convert a String to a Boolean using the Boolean() constructor

To convert a string to a boolean, pass the string as a parameter to the Boolean() constructor.

Empty strings get converted to false, in all other cases the result is true.

Copied!
const bool1 = Boolean('test'); // 👉️ true
const bool2 = Boolean(''); // 👉️ false
const bool3 = Boolean('false'); // 👉️ true
const bool4 = Boolean('true'); // 👉️ true
const bool5 = Boolean(' '); // 👉️ true

We used the Boolean constructor to convert a string to a boolean.

All other strings convert to true.

This is because the Boolean constructor converts truthy values to true and falsy values to false.

The falsy values are: false, null, undefined, 0, "" (empty string), NaN (not a number).

All other values are truthy.

Notice that the empty string is a falsy value, this is why it gets converted to false.

If the string contains at least 1 character, be it an empty space, it's truthy and gets converted to true.

Copied!
console.log(Boolean('      ')); // 👉️ true

Therefore, this approach wouldn't work when trying to convert a string of "false" to a boolean value of false because all non-empty strings convert to the boolean value true.

A more concise approach, which achieves the same result is to use the double NOT (!!) operator.

# Convert a String to a Boolean using double NOT (!!)

The double NOT (!!) operator converts empty strings to false and all other strings to the boolean value true.

Copied!
const bool1 = !!'test'; // 👉️ true
const bool2 = !!''; // 👉️ false
const bool3 = !!'false'; // 👉️ true
const bool4 = !!'true'; // 👉️ true
const bool5 = !!' '; // 👉️ true

The double NOT (!!) operator is the same as using the logical NOT (!) operator twice.

The logical NOT (!) operator:

1. Converts a value to a boolean.
2. Inverts the boolean.

Here are some examples.

Copied!
console.log(!'test'); // 👉️ false
console.log(!''); // 👉️ true

The empty string is a falsy value, but when converted to a boolean and flipped, we get a true value back.

To perform a pure boolean conversion, we have to flip the value again by using a second logical NOT (!) operator.

Copied!
console.log(!!'test'); // 👉️ true
console.log(!!''); // 👉️ false

1. The first ! converts the string to a boolean and flips the result.

2. The second ! flips the boolean value, so we get a pure boolean conversion.

The double NOT (!!) operator is quite concise and does the same as the Boolean() constructor.

However, it's a bit harder to read if you aren't familiar with the logical NOT (!) operator.

Both ways of converting a string to a boolean are very common and often used throughout the same codebase.

# Convert a Boolean to a String in TypeScript

Use the String() constructor to convert a boolean to a string in TypeScript.

The String() constructor converts the passed-in value to a string and returns the result.

Copied!
// 👇️ const bool: true
const bool = true;

// 👇️ const str: string
const str = String(bool);

console.log(str); // 👉️ "true"
console.log(typeof str); // 👉️ "string"

The String() constructor takes a value as a parameter and converts it to a string.

Copied!
console.log(String(true)); // 👉️ "true"
console.log(String(false)); // 👉️ "false"

# Convert a Boolean to a String using toString()

Alternatively, you can use the toString method to convert a boolean to a string.

Copied!
const bool = true;

console.log(bool.toString()); // 👉️ "true"
console.log(typeof bool.toString()); // 👉️ "string"

The Boolean.toString() method returns the string representation of the boolean value.

# Convert a Boolean to a String using a template literal

Another common way to convert a boolean to a string is to interpolate the boolean in a string using a template literal.

Copied!
const bool = true;

console.log(`${bool}`); // 👉️ "true"

console.log(typeof `${bool}`); // 👉️ "string"

Template literals are delimited with backticks and allow us to embed variables and expressions using the dollar sign and curly braces ${expression} syntax.

The dollar sign and curly braces syntax allows us to use placeholders that get evaluated.

Copied!
const num = 50;

const result = `${num + 50} percent`;

console.log(result); // 👉️ 100 percent

# Convert a boolean to a string using the ternary operator

Another common way to convert a boolean value to a string is to use the ternary operator.

Copied!
const bool = true;

const str2 = bool ? 'true' : 'false';

console.log(str2); // 👉️ "true"
console.log(typeof str2); // 👉️ "string"

The ternary operator is very similar to an if/else statement.

If the boolean value is true, then the string true is returned, otherwise, the string false is returned.

This is convenient because there are only 2 possible boolean values, so a shorthand if/else statement gets the job done.