TyprScript: Let’s Clear Some Confusions Between Different Types.

TypeScript is a superset of JavaScript that adds optional static typing, which can help catch errors at compile-time rather than run-time. This can lead to more robust code and easier maintenance. Additionally, TypeScript provides improved IDE support and better documentation through its type annotations. In this post, we are going to look at some key differences between some of its types.

1. Deffence Between “unknown and any ” datatypes.

a. A variable defines with the ” Unknown ” type simply means the type of the variable is not yet known and as such, any type of data can be assigned to it.

b. A variable defines with the ” any “ type simply means no specific type of data was specified for this variable and as such, any type of data can be assigned to it. ( similar to the unknown type )

But what is the difference between these two data types?

Example:

let me: any;
let you: unknown;

// Using the any type:

//notice how we are able to assign any kind of data to the " me " variable of type   " any "

me = 4;

me = "Hey, I'm coding!"

me = {name: "Simpson", age: 35, occupation: "Software Engineer"}


// Let's call a method on these variables

console.log(me.age) // Ok

console.log(me.name.toUpperCase());  // Ok

 // Using the unknown type:

//notice how we are able to assign any kind of data to the " me " variable of type   " unknown "


you = 6;

you = "Hey, are you a coder?"

you = {name: "Alex", age: 30, occupation: "Data Analyst"}


// Let's call a method on these variables

console.log(you.age);  // Compile-time error


console.log(you.toUpperCase());  // Compile-time error


if(typeof you === "string"){

console.log(you.toUpperCase());    // Ok,  // note the type check here

}



The key takeaway here is that:

The type ” any “ can infer its type from the assigned value and as such, we can directly call any method on its variable such as getName(), getAge(), toUpperCase(), etc.

On the other hand, the ” unknown ” can not infer its type so for that, we can not directly call any method on a variable of the ” unknown type ” because the type was not inferred from the value, and we know that the type of variable will determine the methods that are available to use, so for that, the compiler will not know what methods to call.

So, for us to be able to call a method on a variable of the ” unknown type “, we must apply a type check/guard as you have noticed in the example code above.

So, When Do We Use One Instead Of The Other?

You should use unknown instead of any when you want to provide stronger type safety in your code.

Using unknown forces you to perform a type check before using a value, which helps prevent runtime errors that can be caused by using values of the wrong type. This makes it a more type-safe option than any.

If you are working with an API or library that returns values of unknown type. In this case, using unknown forces you to check the type of the returned value before using it, which can help prevent runtime errors.

Summary.

The key difference between ” unknown ” and “ any ” is that ” any “ allows you to perform any operation on a value without any type checking, whereas unknown requires you to perform type checking before performing any operations on the value.

2. Deffence Between “tuple and union” datatypes.

Tuple and Union are two distinct concepts in TypeScript.

Tuple:

A Tuple is a type that represents an array with a fixed number of elements, where each element can have a different type. For example, a tuple with two elements could be defined as [string, number].

Example:

let me:  [ number, string ];

let you: [number, string, boolean]

you = [25, "Alex", true]

me = [ 35, "Simpson];  // Ok.

me = [ "Simpson", 35];  // Compile-time error 

console.log(me);

Union:

On the other hand, a Union is a type that represents a value that can be one of several types. For example, a union of string and number types could be defined as string | number.

Example:

let me: string | number ;

me = 5;  // Ok

me = "Some strings" // Ok. 

Summary.

In summary, while tuples are used to represent arrays with a fixed number of elements and different types, unions are used to represent values that can be of different types. And it’s worth to know that Tuples are mutable in TypeScript.

Conclusion

We have seen that TypeScript is a programming language that is a superset of JavaScript. It adds optional static typing, classes, and interfaces to JavaScript, making it easier to write and maintain large-scale applications. TypeScript code is transpiled into JavaScript, which can be run in any browser or runtime that supports JavaScript. It also has great tooling and integration with popular editors and development environments. And in this post, we have looked at some features it brought into the world of JavaScript to make it easier to write and maintain.