Functions in Js and its types!!! (Part 1)
Tags: webdev, beginners, programming, javascript
Published: 2021-12-29 07:53:58

Suppose we want a greeting massage to new users on email.

`We can write :`

```
let Username = "Namish";
let Username2 = "Iqbal"
console.log(`Hello ${Username} Have a nice day. Thanks to reaching out. I'll get back to you soon.);

console.log(`Hello ${Username2} Have a nice day. Thanks to reaching out. I'll get back to you soon.);
```
`Output`

```

﻿
10Functions.js:231 Hello Namish Have a nice day. Thanks to reaching out. I'll get back to you soon.

10Functions.js:233 Hello Iqbal Have a nice day. Thanks to reaching out. I'll get back to you soon.
```

As we can see same line of code is repeating itself for each user. What if there are hundreds of users or millions. That will gonna be quite hectic.


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

## Introduction to functions

To tackle these kind of scenarios `functions` were introduced.
Functions will reduce the redundancy and make code more readable fast, agile. 

`Lets see same code with a function.`
```
function greeting ()
{
     let name = "Shashma"
    console.log(`Hello ${name} Have a nice day. Thanks to reaching out. I'll get back to you soon.`);
}

greeting;

```

`Output:`

```
Hello Shashma Have a nice day. Thanks to reaching out. I'll get back to you soon.

```

As you can see we just need to change the variable's value can function we print the desired output. But wait !!!! can we optimize this function so we I have to make more less effor. Hell Yes.

## Introduction to arguments in function

`What is arguments ?` You may ask quite often. I find it quite confusing in my early coding days.
So arguments are nothing but placeholders. Basically it tells the functions that there will value pass to the functions. Lets see the code first.

```
function greeting (name)
{
    console.log(`Hello ${name} Have a nice day. Thanks to reaching out. I'll get back to you soon.`)
}

greeting('Shashma');

```

` Output : `

```
Hello Shashma Have a nice day. Thanks to reaching out. I'll get back to you soon.

```

As you can see above the function is quite different then before. the variable name is now in () of functions. The 'name' in function `function greeting(name)` is a placeholder for name. It's like fill in the blanks where you have to just put the value.

But What if there are multiple placeholders we need for multiple values?

We can use multiple arguments like :

```
function greeting(name, regards)
{
console.log(`Hello ${name} Have a nice day. Thanks to reaching out. I'll get back to you soon. ${regards}`)

greeting('Shashma', 'regards');
```

`Output :`

```
Hello Shashma Have a nice day. Thanks to reaching out. I'll get back to you soon regards.
```
This way we can pass multiple arguments in a function. 

`But what if we don't pass the value in the function?`
It will give undefined in output

```
function greeting (name, regards)
{
    console.log(`Hello ${name} Have a nice day. Thanks to reaching out. I'll get back to you soon.`)
}

greeting('Shashma');
```

`Output :`

```
Hello Shashma Have a nice day. Thanks to reaching out. I'll get back to you soon undefined.
```

To resolve this we can give default value to the arguments Like: 

```
function greeting (name, regards='thanks')
{
    console.log(`Hello ${name} Have a nice day. Thanks to reaching out. I'll get back to you soon ${regards}.`)
}

greeting('Shashma');

```

`Output :`

```
Hello Shashma Have a nice day. Thanks to reaching out. I'll get back to you soon thanks.
```

If we pass the value if will give the output of that value else it will give default value.

```
function greeting (name, regards='thanks')
{
    console.log(`Hello ${name} Have a nice day. Thanks to reaching out. I'll get back to you soon ${regards}.`)
}

greeting('Shashma' , 'regards');
```
`Output :`

```
Hello Shashma Have a nice day. Thanks to reaching out. I'll get back to you soon regards.
```

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