Functions and object in typescript- DAY5 OF 100DAYSOFCODE

Functions and object in typescript- DAY5 OF 100DAYSOFCODE

Functions:

Functions are a very important part of any programming language as it provides reusability. let's see, how to write function in js.

We have to give the type of params in circular brackets same as we give type to primitive value. if then we call the function by any other type, it will show an error. here is an example in function expression, function declaration and also using arrow function.

No alt text provided for this image

If you observe, then when we hover on sayHello then " (name: string) => string" is visible. where left-hand side of the arrow (name: string) is for the params of the function. and right-hand side of the arrow is a string.

if we don't provide explicitly right-hand side of the function, then the typescript set value based on the return value. if there is no return value then it will be set at the void.

we should explicitly tell typescript to take the return value. to avoid a future accidents.

No alt text provided for this image

Objects:

The object is key: value pair. and to mention type in typescript we can use key: datatype. let's directly show using examples.

No alt text provided for this image

We separate different key: value in the object using ",". but in type you need to use either a comma ", " or colon "; ". in the above example we use "; ". name:string; age:number; hobbies: string[].

You also have to give nested object types, if have any. let's say the user has locations nested object then you can give like,

No alt text provided for this image

Destructure of objects:

You think it's the same as above. we can do const {name: string} = user. right ? let's see

No alt text provided for this image

in this example, firstName is assigned to the string variable and gives back "meet" in the string. and first name will gives an error. in destructure works like that. so above thig will not work in destructuring. we have to mirror copy for destructure object and then assign types in mirror object as mention below.

No alt text provided for this image

Note: in left hand side of equal sign, stucture is same for before colon {firstName} and after colon {firstName: string} (this is mirror desturcture object).we just give datatype in right hand side of colon.. same is also applicable for latitude and longitude

Optional argument in function and object

Some times all params is not required in function or we have given default parms value in arguments. so in that types of cases you need to add question-mark before colon to show optional argument.

No alt text provided for this image

We can do same in object also.

No alt text provided for this image

That's it guys. hope you enjoy the reading. feel free to give suggestion. meeting you tommorrow. Ba byee!!

要查看或添加评论,请登录

Meet Vaghasiya的更多文章

  • START EXPRESS JS WITH TYPESCRIPT

    START EXPRESS JS WITH TYPESCRIPT

    In this article, we will learn How to install express js with typescript and minimal setup configuration of…

  • Redux with typescript

    Redux with typescript

    Let's see how we use redux with typescript install react typescript app npx create-react-app typescript-practise…

  • Using typescript with react.

    Using typescript with react.

    Here we will learn step by step process for starting the #typescript with a #reactjs . Steps: create a typescript app.

  • Index signature and keyof operator in Typescript

    Index signature and keyof operator in Typescript

    Index signature Let's say we have two types of objects. and you want to make a common function that returns total marks.

  • Use generics like pro

    Use generics like pro

    There is a rule in programming called DRY- don't repeat yourself. generics help us to use this convention in typescript.

  • High-level overview of type and interface in Typescript

    High-level overview of type and interface in Typescript

    Standard javascript object is a map of key: value pairs. When we define an object with properties (keys) and values…

  • Classes in typescript - 6thday of 100daysofcoding

    Classes in typescript - 6thday of 100daysofcoding

    Typescript is fully supported to work with modern javascript keyword class. Generally, classes are blueprints to make…

  • ARRAY AND TUPLES IN TYPESCRIPT - DAY4 OF #100DAYSOFCODE

    ARRAY AND TUPLES IN TYPESCRIPT - DAY4 OF #100DAYSOFCODE

    ARRAY IN TYPESCRIPT In typescript, typescript need to know type of each items in array. so it will tell us error if we…

  • TYPE- any in ts - DAY3 OF 100DAYSOFCODE

    TYPE- any in ts - DAY3 OF 100DAYSOFCODE

    Any type in typescript in the previous article, if you remember the last moment, if we don't declare and initialize…

    2 条评论
  • Type and Type system in Typescript - DAY2 of 100 DAYSOFCODE

    Type and Type system in Typescript - DAY2 of 100 DAYSOFCODE

    What is a type system? When we learn any programming languages, first they introduces with various data-types of that…

社区洞察

其他会员也浏览了