Functions

• Fat arrow syntax =>

  • Arrow functions capture the this where the function is created rather than where it is invoked

• Parameter name does not matter, type matters

• Contextual inferring - type specified in declaration can be ignored in implementation

• Overload: reduce use of "any", define several function signatures with same name

• this

  • this - the cause of lots of confusion

    • the 'primitive' - someFunction.call(thisVariable, param1, param2)

    • the 'normal way' - someFunction(...)

      • non-strict mode: 'window'

      • strict mode: undefined

    • member: someObject.someFunction(){ // someObject is 'this'

    • use someFunction.bind(something) - return a new function which always feeds the something as 'this'

  • fat arrow syntax: ()=>{} has no own "this","arguments","super","new.target" so following normal variable lookup rules the enclosing scope's "this" etc will be found (Arrow functions capture the this where the function is created rather than where it is invoked)

  • better define "this" type with typescript

// fat arrow => syntax for function type

let myAdd: (x: number, y: number) => number

// optional parameter

function buildName(firstName: string, lastName?: string) {

// with default

function buildName(firstName: string, lastName = "Smith")

// rest parameters, result in an array

function buildName(firstName: string, ...restOfName: string[]) {

// explicit "this" type

createCardPicker: function(this: Deck) {

function add(x: number, y: number): number {

return x + y;

}

type AddFunction = (x:number, y:number) => number;

const add:AddFunction = (x,y)=>{

return x+y

}

Tagged template literals run a template string through a function (such as f below)

function f(strings, variable1, variable2){

// do something

return aString;

}

const result = f`a taged string literal with ${variable1} and ${variable2}!`

How it works:

• f receives all information of the template (between ``)

  • the first parameter (strings) receives an arryay of strings from the template (["a taged string literal with ", " and ", "!"])

  • subsequent parameters will receive the variables interpolated in the template

    • use rest operator to receive variable length parameters function f(strings, ...variables){}

• f returns a string, becoming the result

Use case:

• Basically this is a syntax for calling a function with a template & variables

• The syntax is more elegant than function call arguments in certain scenarios