JavaScript

Fail Points from the previous exam

TODO

Quick Recap

Functions

Different types

Functions

anonymous functions

Functions without a name

var button = document.getElementById('myButton');

//add event listener
button.addEventListener('click', function(event) {
  console.log('I'm anonymous')
});

Functions

anonymous functions

Functions without a name

var list = [1,2,3]

list.map(function(item) {
  console.log('i am anonymous too!')
})

Functions

anonymous functions

Functions without a name

function makeSumator(n) {
  return function(m) {
    return m + n
  }
}

Functions

lambda functions

JavaScript supports lambdas

They are used where they are declared

they are used as data
technically anonymous
and normally they use arrow syntax

Functions

lambda functions

The lambda calculus is a minimal programming language/mathematical model of computation, which uses functions as its only "data structure". In the lamdba calculus the lambda-symbol is used to create (anonymous) functions. This is where the usage of the term "lambda" in other languages comes from.

Functions

lambda functions

var list = [1,2,3]

list.map(i => i * 2)

Functions

IIFE

Immediately-Invoked function expressions

(function() {
  // Do something
})()

Functions

IIFE

Immediately-Invoked function expressions

var module = {}

;(function(exports) {
  exports.sayHello = name => `Hello ${name}`
})(module)

console.log(module.sayHello('peter'))

this

var obj = {
  setName: function(name) {
    this.name = name
  }
}

more on numbers

What we learned

// Number primitive
var x = 5
// will cause a type conversion
// returning a number primitive
var y = Number(5)
// Using the Number function constructor 
// to make a number object
var z = new Number(5)

Using them on operations

Math.PI * 3
9.42477796076938

getting the integer

Math.floor(Math.PI * 3)
9
Math.ceil(Math.PI * 3)
10

What if we don't want to round?

Math.trunc(Math.PI * 3)
9

What if we reduce this array?

// Get integer part of 
[1, 2, 33, 'asd']
  .reduce( (acc, next) => acc + next, 0)

parseInt to the rescue

parseInt([1, 2, 33, 'asd']
  .reduce( (acc, next) => acc + next, 0))

parseInt 

parseInt('9.33asd', 10)
// 10 is the base 

parseInt 

parseInt(' 0xF', 16);
parseInt(' F', 16);
parseInt('17', 8);
parseInt(021, 8);
parseInt('015', 10); 

What if we want the decimal value?

parseFloat

parseFloat('9.33asd')
9.33

Exercise

var resumes = [{
    lines: "54",
    name: "Jose cuervo - cv",
    height: "153.561"
}, {
    lines: "15",
    name: "Maria Gutierrez - cv",
    height: "174.323b"
},{
    lines: "154b",
    name: "Sergin Capdevilla - cv",
    height: "185"
},{
    lines: "300-b",
    name: "Montserrat Luciana - cv",
    height: "166.99"
},{
    lines: "200",
    name: "Roser Garcia - cv",
    height: "172.98"
},{
    lines: "110",
    name: "John Snow - cv",
    height: "173"
}, {
    lines: "154.3",
    name: "Sir Paco de lucia - cv",
    height: "165"
},{
    lines: "123",
    name: "The fary - cv",
    height: "120"
},{
    lines: "88",
    name: "The faraon - cv",
    height: "210"
}]

Help the company to develop a solution for calculating the average number of lines of the resumes. And the average height of the candidates

Floats in JavaScript

What are floating points?

Given a fraction 1/2, 0.5 is the decimal (base 10) representation of the value

0.5 is a finite representation, while 1/3 produces an infinite representation in base 10. 0.3333333....

Floats in JavaScript

There are another ways of representing numbers rather than integers, fractions or decimals. They are called floating points

D1.D2D3D4...Dp x BE

mantissa of precission p x base with exponent

For example we can represent the number 1 as 1.0 x 10 in floating point. 1/2 can be represented as 0.1 x 2.

Floats in JavaScript

In the example: 1.3 x 10^2

The language needs to store 1 and 3 as different values in the binary machine representation

For avoiding that, we can get rid of the radix point using the formula D1D2D3D4...Dp / (Bp-1) x BE

Floats in JavaScript

JavaScript stores the numbers in the format specified as IEEE-754 which is the most common way to store floating numbers, it is a double precision format, meaning that 64 bits are allocated for each floating point

1 bit is used for the sign
11 for the exponent

and 52 for the mantissa

Floats in JavaScript

Rounding errors.


Given the fraction 1/10 which represents as 0.1 in decimal but as 0.0011001100110011... in base 2

When we round to a certain mantissa, we get rid of some small part of the value.

This means that the associative properties of addition, subtraction and multiplication of floating values are not guaranteed to work

Floats in JavaScript

0.1 + 0.2 === 0.3

false

JSBIN

Floats in JavaScript

Conclussion: JavaScript it's not a perfect fit for math. If you are going to do it use a library like BigDecimal which helps you handle big decimal numbers correctly

Floats in JavaScript

Another suggestion is to use toPrecision() or toFixed(), but caution! these methods work with strings, so use it only for representation purposes

More on floating numbers

Errors

Errors
Javascript API > > Type of errors (SyntaxError, etc )
Javascript API > > Catching errors
Javascript API > > Throwing own errors

Async Programming

Subtitle

Async Programming

> Async programming
Javascript Pillars > > How does it work?
Javascript Pillars > > Callbacks (and its nightmare)
Javascript Pillars > > Promises

Bundling it client side

exercise

document