Beginner's TypeScript #2
Tags: programming, beginners, tutorial, typescript
Published: 2023-12-19 15:00:00

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0rvk86tdiutolsnwt97g.png)

⭐ **Working with Object Params** ⭐

Consider this **addTwoNumbers** function:

```ts
export const addTwoNumbers = (a, b) => {
  return a + b
}
```

The function accepts a params object with **first** and **second** properties.

```ts
{
  first: 2,
  second: 4,
}
```

Similarly to [the previous time](https://dev.to/nhannguyendevjs/beginners-typescript-1-eg4), we get the "implicitly has an 'any' type" error.

We need to type **params** as an object with a key of **first** that is a number and a key of **second** that is also a number.

👉 **Solutions:**

1️⃣ **Pass an Object Type Directly:**

Perhaps the simplest solution is to pass an object type directly to the params argument.

Use curly braces to represent the object, then create a type inline:

```ts
export const addTwoNumbers = (params: { first: number; second: number }) => {
    ...
}
```

Note that TypeScript will understand if you use a comma between the **first** and **second** types like this:

```ts
params: {first: number, second: number}
```

2️⃣ **Create a Named Type:**

A useful technique is creating a named type. Use the **type** keyword, then provide a name and object similar to the previous solution.

In this case, we will name the type **AddTowNumbersArgs** and type **first** and **second** as **number**:

```ts
type AddTwoNumbersArgs = {
  first: number;
  second: number;
}
```

Now we can set the **params** to be typed as **AddTowNumbersArgs**:

```ts
export const addTwoNumbers = (params: AddTwoNumbersArgs) => {
  return params.first + params.second;
}
```

3️⃣ Create an Interface:

Interfaces can be used to represent objects (they can do other things, but we are only concerned with objects for now).

Using **interface** is similar to using **type**.

```ts
interface AddTwoNumbersArgs {
  first: number;
  second: number;
}

export const addTwoNumbers = (params: AddTwoNumbersArgs) => {
  return params.first + params.second;
}
```

👉 **Choosing Inline vs. Type vs. Interface:**

The inline technique used in the first solution will provide a verbose error that includes the full object type:

```bash
Argument of type 'number' is not assignable to a parameter of type'{first: number; second: number;}'
```

But generally speaking, we should be using aliases instead of going inline.

So when should you choose **type** and when should you choose **interface**?

It comes down to the syntax we prefer.

Technically, **type** can represent anything. It could be a **number**, a **string**, or a **boolean**.

TypeScript will give you an error if you try to use a string with **interface**:

```ts
// this won't work!
interface AddTwoNumbersArgs = string
```

When we are just getting started, it does not really matter if you choose **type** or **interface**.

**Just be consistent!**

---

I hope you found it useful. Thanks for reading. 🙏
Let's get connected! You can find me on:
- **Medium:** https://medium.com/@nhannguyendevjs/
- **Dev**: https://dev.to/nhannguyendevjs/
- **Hashnode**: [https://nhannguyen.hashnode.dev](https://nhannguyen.hashnode.dev/)/
- **Linkedin:** https://www.linkedin.com/in/nhannguyendevjs/
- **X (formerly Twitter)**: https://twitter.com/nhannguyendevjs/