JavaScript Functions

In any moderately complex JavaScript program, everything happens inside functions.

Functions are a core, essential part of JavaScript.

A function is a series of code statements combined together in a single block and given a name.

The code in the block can then be executed by referencing that name.

Defining of function?

Functions are defined using the function keyword followed by a name that describes the use of the function, a list of zero or more arguments in (), and a block of one or more code statements in {}.

Here's a function declaration:

// Function declaration
function sayHello(){ 
  console.log("Hello World");
}

A function can be run any time you want by invoking it, means by calling the name of it like this:

// Function call
sayHello();
            

Example

// Function declaration
function sayHello(){ 
  console.log("Hello World");
}
// Function call
sayHello();

Passing Arguments to Functions

Values are passed in comma-delimited form to the function. The function definition needs a list of arguments in () that match the number being passed in.

A function can have one or more argument:

// Function with argument
function sayHello(name){ 
  console.log("Hello, my name is " + name);
}
sayHello("Muhammad");

In the above example we passed nameas argument to the function. now this function will expect us to pass the parameter when invoking the function.

Example

// Function with argument
function sayHello(name){ 
  console.log("Hello, my name is " + name);
}
sayHello("Muhammad");

Here is a function with two argument:

// Function with two argument
function sayHello(name, age){ 
  console.log("Hello, My name is " + name + " I am " + age + " years old" );
}
sayHello("Muhammad", 20);

In the above example we passed nameand nameas arguments to the function. now this function will expect us to pass those two parameters when invoking the function.

Example

// Function with two argument
function sayHello(name, age){ 
  console.log("Hello, My name is " + name + " I am " + age + " years old" );
}
sayHello("Muhammad", 20);

Let's see another example when we can pass an argument, we invoke the function passing parameters:

// Function with two argument
function getData(color, age){ 
  console.log("The color is " + color + " and Age is " + age +" !" );
}
getData("green", 25);
getData("black");

Note that in the second invocation I passed the black string parameter as the color argument, but no age. In this case, age inside the function is undefined.

Example

// Function with two argument
function getData(color, age){ 
  console.log("The color is " + color + " and Age is " + age +" !" );
}
getData("green", 25);
getData("black");

We can check if a value is not undefined using this conditional:

// Function with argument
function getData(color, age){ 
  //do something
  if (typeof age !== 'undefined'){ 
    //...
  }
}

typeof is a unary operator that allows us to check the type of a variable.

You can also check in this way:

// Function with argument
function getData(color, age){ 
  //do something
  if (age){ 
    //...
  }
}

although the conditional will also be true if ageis null, 0or an empty string.

Default Parameters

You can have default values for parameters, in case they are not passed:

function getData(color = 'black', age = 25){ 
  console.log("The color is " + color + " and Age is " + age +" !" );
}
getData("green");

Now that we did not passed the parameter of age it will use the default one.

Example

function getData(color = 'black', age = 25){ 
  console.log("The color is " + color + " and Age is " + age +" !" );
}
getData("green");

You can pass any value as a parameter: numbers, strings, booleans, arrays, objects, and also functions.

Return value

A function has a return value. By default a function returns undefined, unless you add a return. keyword with a value:

Adding a return keyword followed by a variable or value returns that value from the function

function getData(){ 
  return 'hi';
}

We can assign this return value to a variable when we invoke the function:

function getData(){ 
  return 'hi';
}
let result = getData();

resultnow holds a string with the hivalue.

Example

function getData(){ 
  return 'hi';
}
let result = getData();
console.log(result);

You can only return one value.

To return multiple values, you can return an object, or an array, like this:

function getData(){ 
  return ['Codingkoleji',30];
}
let [user, age] = getData();

Example

function getData(){ 
  return ['Codingkoleji',30];
}
let [user, age] = getData();
console.log(user);
console.log(age);

Functions can be defined inside other functions:

let getData =function(){ 
    let dosomething =function(){
      return getData();
    }
  return 'I love JavaScript';
}

The nested function cannot be called from the outside of the enclosing function

Example

let getData =function(){ 
  let dosomething =function(){
    return 'I love JavaScript';
  }
    return dosomething;
}
let result = getData();
console.log(result);