functions

1
Functions in javascript
2
 What is a Function?

• A function is basically a group of statements
  that perform specific tasks/operations.
• Functions provide a way to create reusable code
  packages which are more portable and easier to
  debug.
• Functions allow a programmer to divide a big
  program into a number of/several small and
  manageable functions.
• It helps programmers in writing modular codes.
• The function is a kind of reusable tool where we
  can write code/functionality to reuse whenever we
  want (Function allow the code to be called many
  times without repetition).
• Wrapping up / making smaller chunks of statements
  / reusable codes together for readability or
  separation of concern/proper organization is
  functions (Grouping of a repetitive task).

3
 What is a Function?

• Functions (logical block of code) are one of the
  most important control structure in any
  programming language.
• In other languages, it might be called MODULES,
  SUBROUTINES(SUB-ROUTINES).
• There are two steps to utilize function
• create/define a function with function keyword.
• call/invoke a function.

4
advantages of using functions

• Code reusability - call a function several times.
• Less coding - makes our program compact, no need
  to write lines of code each time.
• Easier to maintain - changes are done only at one
  location.
• Easier to eliminate the errors - fixing errors
  becomes much easier.

5
 Function Definition / Function Declaration /
Creating Function

• The function declaration starts by using the
  function keyword,
• followed by a unique function name,
• a list of parameters in parentheses i.e. ()
  (that might be empty),
• and a statement block surrounded by curly braces
  .

6
Syntax Example

• //1. define / declare / create function
• function showMessage ()
• //Body of function
• //code to be executed
• console.log('welcome to JavaScript function')
• alert('welcome to JavaScript function')

7
Function Invocation / Calling a Function / Run a
Function

• Defined function can be invoked/called/run from
  anywhere in the document, by typing function name
  followed by a set of parentheses, like
  functionName()
• Syntax Example 
• //2. invoke / call the function
• showMessage()

8
Function Naming

• Function denotes an action/task. The function
  name should be brief, as accurate as possible and
  describe what the function does, like a verb.
• Usually, Function name starts with
• "getSomething" returns value,
• "createSomething" create something,
• "calcSomething" calculate something,
• "checkSomething" check something and return a
  boolean, etc.
• Examples of function names
• getSum()
• createFields()
• calcAge()

9
Types of Function

• Regular Function
• Parameterized Function
• Return Type Function (Function returning values)

10
Regular Function

• Simple/Normal function which we use daily to
  perform some action/task.
• Syntax Example
• var name 'Dinanath'
• //1. define / declare / create function
• function sayHello ()
• //Body of function
• //code to be executed
• console.log('Hello ' name)
• alert('Hello ' name)
• //2. invoke / call the function
• sayHello()

11
 Parameterized FunctionOne can pass data to
functions using parameters (function
arguments).You can specify parameters when you
define your function to accept input values at
run time.

• Syntax Example 
• // Parameterized function
• //1. define / declare / create function
• function sayHello (name)
• //Body of function
• //code to be executed
• console.log('Hello ' name)
• alert('Hello ' name)
• //2. invoke / call the function
• sayHello('Dinanath')
• sayHello('Dino')

• var total
• function calculateSum (num1, num2)
• total num1 num2
• console.log(total)
• calculateSum(10, 20)
• calculateSum(100, 200)

12
Default Values for Function Parameters ES6With
ES6, now you can specify default values to the
function parameters. This means that if no
arguments are provided to the function when it is
called these default parameters values will be
used.

• Syntax Example 
• // Parameterized function with default parameters
• //1. define / declare / create function
• function sayHello (name 'User')
• //Body of function
• //code to be executed
• console.log('Hello ' name)
• alert('Hello ' name)
• //2. invoke / call the function
• sayHello()
• sayHello('Amber')

• var total
• function calculateSum (num11, num22)
• total num1 num2
• console.log(total)
• calculateSum()
• calculateSum(100, 200)

13
Return Type Function (Function returning values)

• A function can return a value back to the script
  that called the function, as a result, using the
  return statement.
• We can call a function that returns a value and
  use it in our program.
• The return statement usually placed as the last
  line of the function.

14
Return Type Function (Function returning values)

• Syntax Example
• // Return type function
• //1. define / declare / create function
• function getSum (num1, num2)
• //Body of function
• //code to be executed
• var sum num1 num2
• return(sum)

• //2. invoke / call the function
• console.log(getSum(10,20))
• console.log(getSum(100,200))
• var total getSum(50,50)
• alert(total)

15
 Different ways to define Function

• The syntax that we've used before to create
  functions is called function declaration. There
  is another syntax for creating a function that is
  called a function expression and Immediately
  invoked function expression (IIFE).
• function declaration (Regular/Normal function)
• function expression
• Variables contain the expressions of a
  functionAnonymous function expression
• Named function expression

16
Syntax Example

• // function declaration (Regular / normal
  function)
• function getSum1(num1, num2)
• var total num1 num2
• return total

• // function expression - Anonymus
• var getSum2 function(num1, num2)
• var total num1 num2
• return total
• alert(getSum2(10,20))
• // assign function to another variable
• var sum1 getSum2
• alert(sum1(100,200))

17

• Syntax Example
• // function expression - named
• var getSum2 function getTotal(num1, num2)
• var total num1 num2
• return total
• alert(getSum2(10,20))
• // ------------------------------
• // assign function to another variable
• var sum1 getSum2
• alert(sum1(5,10))

18
Immediately invoked function expression (IIFE)

• It runs as soon as the browser finds it
• Declare and run the function at the same time
• Syntax Example 
• // Immediately invoked function expression
  (IIFE)
• (function ()
• console.log('Welcome to Immediately invoked
  function expression (IIFE)')
• ())
• (function( userName )
• console.log('Welcome', userName)
• )( Dinanath ')