2. Functions - Aimanizales/Javascript_learning GitHub Wiki

2.1 What is a function?

  • The fundamental modular unit of JS, functions are objects that can be invoked.
  • It's a set of statements.

Functions properties:

  • Can be passed around by reference.
  • Contains 2 additional hidden properties: the function's context and the code (implements the function's behavior) (p. 26 Investigate more).
  • They can be used like any other values, can be stored in variables, objects and arrays, can be passed as arguments to functions and can be returned from functions.

The prototype

  • They are linked to Function.prototype (which is itself linked to Object.prototype).
  • Every one is created with a prototype property with a constructor property in it. e.g:
var myFunction = function (a, b) { return a + b; }
myFunction.prototype.constructor // the function itself

//ES2015:
var myFunction = (a, b) => a + b;

2.2 Function literal

Parts of a function:

function anyName (param_1, param_2, ... param_n) { // function + name[optional] + (zero or more params). If no name is given, function is anonymous
  // Each param will be defined as a variable function
  arguments // array-like object
  arguments.length // returns the number of params

  return // statement. Returns the control to the part of the program that invoked the function.
} // Also returns the control to the part of the program that invoked the function.

No initialized with undefined (no hoisted ?) Specify ES6 arrow function

  • Can appear anywhere.
  • Can be defined inside other functions.
  • Function object created as a function literal contains a link to that outer context or closure.

2.4 Invocation

  • The invocation operator is a parenthesis () that follow any expression that produces a function value.
  • When a function is invoked...:
  1. ...JS suspends the execution of the current function.
  2. ...JS passes control and parameters to the invoked one.
  3. ...the current function receives two additional parameters:
    • arguments (it's not an array really; It has length property but it lacks all of the Array methods).
    • this (determined by the invocation pattern).

2.5 Invocations patterns

There are four and differ how this is initialized:

Method type: Scope of this Notes
method Same object
function window/global See 2.5.1 workaround below to fix this issue in functions inside methods (p. 29)
constructor Constructors: Functions invoked with new prefix (p. 29). Try to avoid this method (?)
apply set in first parameter: apply(thisValueChosen, [array of parameters]) MDN apply

2.5.1 Workaround

To fix this issue in functions inside methods:

var obj = {
  method1: function () {
    console.log(this); // this = method1
    
    var that = this;  // workaround needed
    var functionInMethod = function () {
      console.log(this); // this = Window (here goes the JS error)
      console.log(that); // that = method1
    }
    functionInMethod();
  }
}

Exceptions

  • JS handling mechanism
  • As return statement, throw interrupts execution of the function.
function () {
  // some statement with error
  throw { // exception object
    name: 'TypeError',
    message: 'Any error msn'
    // Can also add more properties
  }
}
  • The object above will be delivered to the catch clause of a try statement:
try {
 // ...
} catch (error) {
  // error.name, error.message
}
⚠️ **GitHub.com Fallback** ⚠️