DEV Community

Cover image for How to add a boolean type annotation to a function parameter in TypeScript?
MELVIN GEORGE
MELVIN GEORGE

Posted on • Originally published at melvingeorge.me

How to add a boolean type annotation to a function parameter in TypeScript?

Originally posted here!

Boolean type annotations can be added to function parameters by declaring the function and then adding the name of the parameter followed by the : symbol (colon) and then the type boolean after the symbol.

TL;DR

// add boolean type annotation
// to the parameter isAdmin
function setAdmin(isAdmin: boolean) {
  if (isAdmin) {
    console.log("Admin set");
  } else {
    console.log("Admin not set");
  }
}

// call the function
setAdmin(true); // ✅ allowed
Enter fullscreen mode Exit fullscreen mode

For example, let's say we have a function called setAdmin and on calling the function checks to see if the boolean type parameter isAdmin is true or false and log output accordingly.

So to get the boolean value we can use a parameter called isAdmin. It can be done like this,

// a simple function
function setAdmin(isAdmin) {
  if (isAdmin) {
    console.log("Admin set");
  } else {
    console.log("Admin not set");
  }
}
Enter fullscreen mode Exit fullscreen mode

Now we need to only allow boolean type values as the value for the parameter isAdmin. To do that we can add a boolean type annotation to the function parameter. In our case, the parameter is isAdmin.

It can be done like this,

// add boolean type annotation to
// the parameter isAdmin
function setAdmin(isAdmin: boolean) {
  if (isAdmin) {
    console.log("Admin set");
  } else {
    console.log("Admin not set");
  }
}
Enter fullscreen mode Exit fullscreen mode

Now let's try to call the function setAdmin and then pass a boolean value as an argument to the function like this,

// add boolean type annotation
// to the parameter isAdmin
function setAdmin(isAdmin: boolean) {
  if (isAdmin) {
    console.log("Admin set");
  } else {
    console.log("Admin not set");
  }
}

// call the function
setAdmin(true); // ✅ allowed
Enter fullscreen mode Exit fullscreen mode

As you can see from the above code TypeScript allowed us to pass the boolean value of true to the function parameter isAdmin since the allowed type for the isAdmin function parameter is a boolean.

Now let's try to pass another value of string type Hello! to the isAdmin function parameter to see what happens,

// add boolean type annotation
// to the parameter isAdmin
function setAdmin(isAdmin: boolean) {
  if (isAdmin) {
    console.log("Admin set");
  } else {
    console.log("Admin not set");
  }
}

// call the function
setAdmin(true); // ✅ allowed
setAdmin("Hello"); // ❌ not allowed. Argument of type 'string' is not assignable to parameter of type 'boolean'.
Enter fullscreen mode Exit fullscreen mode

As you can see that the TypeScript will throw an error saying that the Argument of type 'string' is not assignable to parameter of type 'boolean'. which is also what we want to happen.

See the above codes live in codesandbox.

That's all 😃!

Feel free to share if you found this useful 😃.


Discussion (0)