You aren't married to JavaScript, doesn't matter how much you love it, you must give it a try to TypeScript. Maybe you don't have a reason to move, but I will take you on a journey, where you'd like to taste TypeScript a bit. I can give you more than 13 Reasons Why you should move to typescript, but for now, I'll try to convince you to move on to TypeScript in 5 points where I will tell you why TypeScript is much better than JavaScript for development, and why you should choose TypeScript for your next project.
Strictly Typed JavaScript
When I say you need errors, doesn't mean I want you to write errorful codes, but the code you've written must be error-free, and for that, it is the job of your dev environment to give you errors. And in JS, it just doesn't do it, it is one of the reasons people love it, and at the same time hate it too. When I say errors, I mean everything except syntax errors. JS doesn't give an error when you write something wrong, but it gives you an error when something wrong happens. So if some part of your code isn't executed at the time of testing, then be ready for some pain in the production. :)
Let's see an example
I'm writing a code to multiply two numbers, I'll do this in both JS and TS, and you'll see how JS is so unreliable and may break your application in many ways.
function multiply (num1, num2 ) {
return num1 * num2;
}
console.log(multiply(3, 4));
// returns 12
console.log(multiply(3));
// return NaN
console.log(multiply(3, null));
// returns 0
console.log(multiply());
// returns NaN
You can literally call multiply in any manner, there's no restriction, and it always gives you unexpected results, that's the worst thing about JS, suppose now you have to use those returned values somewhere, how much inconsistency and unexpected results it causes in your application.
But thanks to TypeScript, it is very strict, it won't let you proceed if you do not follow the rules if the function expects the, then you must pass the number, and it says both should be numbers, then you have to pass two arguments and both must be numbers. Let's see the same code in TypeScript. If you're not aware of the TS syntax, don't worry, it is similar to JS, except the return type comes before the opening brace and argument types with their names.
function multiply (num1:number, num2:number) :number{
return num1 * num2;
}
console.log(multiply(3, 4));
// returns 12
console.log(multiply(3));
// ~~~~~~~~~~~
// Expected 2 arguments, but got 1.(2554)
// input.tsx(1, 33): An argument for 'num2' was not provided.
console.log(multiply(3, null));
// ~~~~
// Argument of type 'null' is not assignable to parameter of type 'number'.
console.log(multiply());
// ~~~~~~~~~~~
// Expected 2 arguments, but got 0.(2554)
// input.tsx(1, 20): An argument for 'num1' was not provided.
So here in TS, there are never unpredictable results, you can only proceed when you remove all the errors, that's what makes me fall in love with TS <3
TS is not just bound to tell the errors in your code that you've written, but it also tells you the possibility, of where an error may come. Let's see a quick example of this.
// I'm writing some TS code, you can ignore it and look at the comment, I've written in the code.
// Type is user
interface User {
// Property is name of type string
name: string;
// Property is age of type number
age: number;
// Property is social which is optional and have properties
social?: {
// Property is facebook which and have type string which is optional
facebook?: string;
// Property is twitter which and have type string which is optional
twitter?: string;
}
}
Now as you can see, the social property is optional means there may be cases where social is undefined, TS knows that, and it will not let you proceed until you handle it.
let userData:User = dataFromSomeSource;
console.log(user.social.facebook);
// ~~~~~~~~~~~
// Object is possibly 'undefined'.(2532)
if(user.social){
console.log(user.social.facebook);
}
So, this is silently ignored by JS, and it causes errors from case to case, which is another reason why TS is considered more reliable.
Auto Tested and Documented.
It also automatically tests your codes by checking all the possibilities and tells you if any of the possibility fails. Sounds amazing right, well yes, it is. This feature prevents a huge number of bugs at the time of development, you don't need to write a test for your function nor need to test it manually at different values, TS do it for you and tells you if you've missed something that may cause a problem later.
In the code below, I have written a function that takes two arguments and returns an array of string by adding each parameter to the array if they are not undefined. The first argument is required while the second is optional.
function arrayFy (name1:string, name2?: string): Array<string> {
// ~~~~~~~~~~~~~
// Function lacks ending return statement and return type does not include 'undefined'.(2366)
let resultArray = [name1];
if(name2) return resultArray.push(name2);
// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Type 'number' is not assignable to type 'string[]'.(2322
}
The code above is a very common scenario for me to make a mistake. Array.push does not return the updated array, but returns the new length of the array. So if the above code is written in the JS, there won't be any error, and my code just runs and gives expected results, which I have to debug and find the mistake here, and my function is returning 2 if I pass the second argument too. But here in TS, you can clearly see that TypeScript automatically run the case, and tell you that in that particular case, your function will fail to return an array of strings.
There's another error, say if you don't pass the second parameter, you're still returning nothing (undefined), which also violates the behaviour of your function as it must return an array of strings. So, here I made some changes in the function and TS gives you a green flag, which means the function will never ever give you an unexpected result. See below.
function arrayFy (name1:string, name2?: string): Array<string> {
let resultArray = [name1];
if(name2) {
resultArray.push(name2);
}
return resultArray;
}
Always a few steps ahead of JavaScript
release, TS release it before the official release and you can use it without any worries of compatibility in browsers as you can compile TS to any previous version of JavaScript (like ES5). TypeScript has a lot of features that JavaScript doesn't.
So we can say that TypeScript is also a superset of JavaScript, ECMA5, ECMA6, ECMA7 and ECMAnext, and some features that don't even exist in JavaScript.
Conclusion
. compiler.
If you're still not satisfied with the reasons I gave you, and have some counter questions, you can anytime contact us, and believe me, it is worth giving a try, you won't regret it.
SOCIAL SHARE CARD GENERATOR