A beginner guide switching from javasctipt to typescript.

One morning I woke up and the new technical wave is that I should use typescript instead of javascript.

Okay, wait do you mean I have to start learning a new programming language?

I took a quick peek at a typescript file, boy oh boy this is going to be difficult.

Yeah yeah yeah I know that feeling. So here's a quick guide on how u can understand some basic concepts on switching from javascript to typescript.

Now I'm not here to give you some definition and setup tutorial or why you should use typescript instead kinda lecture. you can find that with just a simple Google search. But trust me on this many developers didn't like the Idea of typescript initially but then when we finally did, we didn't want to go back to plain old javascript and guess what maybe you'll be one too.

let dive in

The whole idea of typescript is being intentional about each step you take in programming.

Declaring variables

In plain javascript, we would do something like
let first variable = 0

we all know this is a number variable yeah even typescript does(wouldn't want to go into that detail here) but here's the equivalent in typescript.

let firstVariable: number = 0
let firstString: string = 'My first string'
let firstBool:boolean = true

where Number, String, Boolean is a type. Yeah, why are we doing all this additional stuff?

well, I believe the moment you start trying this out in your IDE you'll discover warnings saying you can't leave a variable of type Number null etc.
Trust me this stuff would come in handy when things start getting complex. I wouldn't want to be talking about the benefits of typescript here as it is out of the scope of this post.

Now we might ask what about variables such as arrays and objects

let firstArrayOfNumbers: Array<number>
let secondArrayOfStrings: Array<string>
let thirdArrayOfBool:Array<boolean>

Now at this point, I'm sure you're having some interesting questions here and that's great. Let then fire up your research you are on the right track

what about objects?

interface MyObject {
    name: string
    age: number
    address: string
    married: boolean
}

let myFirstObject: MyObject = {
    name: "Titus",
    age: 30,
    address: "Linux street",
    married: false
}

Here you are describing each field of the object. What would be the type of each field? This comes in handy when you would want to use the variable in some other place.
Just simplly you created your own type for an object definition called MyObject.

Lastly, how do I write functions

Like I said the whole Idea of typescript is being intentional. Now when we want to write a function we ask what would this function take. , what would be the response of the function? would the parameters be strings and the returned value be a number?
what if I'm not returning anything?

function myFirstAddFunction (a:number,b:number) : number {
    return a + b
}

function myFirstVoidFunction (a: number): void{
    console.log(a)
}

I believe this isn't the finest of tutorials but the aim of this post is just to awaken your curiosity. Now you have questions make research and take various tutorials online without being scared and trust me you'll love the benefits that typescript comes with.

Thanks for reading

you can connect with me on linkedin
twitter