LESS TALK, MORE CODE: December 2018

Let's talk a little about javascript functions and objects. I'll use Atom text editor, you can find lots off tutorial about using Atom.

Named functions:

function multiply(a,b) {
  var result = a*b;
  return result;
}

var multiplied = multiply(3,4);
console.log(multiplied);

console output:

12

function multiply(a,b) {
  var result =  ["my result:", a*b];
  return result;
}

var multiplied = multiply(3,4);
console.log(multiplied);
console.log(multiplied[0] + " >>>> " + multiplied[1]);

console output:

[ 'my result:', 12 ]
my result: >>>> 12

Anonymous functions:

var a = 4;
var b = 3;

 //only execute if we call the variable as if it is a function
var multiplied = function() {
  var result =  a*b;
  console.log(result);
}

// which means inside multiplied variable there is a anonymous function, run it!

multiplied();

console output:

12

//only execute if we call the variable as if it is a function
var multiplied = function(a,b) {
  var result =  ["my result:", a*b];
  return result;
}

// which means inside multiplied variable there is a anonymous function, run it!
console.log(multiplied(4,5));

console.log(multiplied);

console output: 

[ 'my result:', 20 ]

[Function: multiplied]

Immediately invoked functional expressions:

//inside the variable, we have an immediately  invoked function expression
//run the function with below arguments
var multiplied = (function(a,b) {
  var result =  ["my result:", a*b];
  return result;
})(4,5) // arguments are here

console.log(multiplied);

console output:

[ 'my result:', 20 ]

//result is NaN, why i'm in trouble?
//the browser runs the function(immediately invoked expressions) when it is encountered
//so the variables should be before the function
var multiplied = (function(a,b) {
  var result =  ["my result:", a*b];
  return result;
})(a,b) // arguments are here

var a = 3;
var b = 4;

console.log(multiplied);

variables:

***For scope control, you should always declare your variables using the var prefix.
There is a difference between var a = 1 and a = 1.
var a = 1 --> declares the variable in the current scope which can be local or global.
a = 1 --> if the variable couldn't be found anywhere in the scope chain, it becomes global.
This usage is very bad practice!!!

***With ES2015 two new types could be used:
const (cannot be changed once defined)
let (block scope variable. smaller scope then var)

const MYCONSTANT = 3;
console.log(MYCONSTANT);

MYCONSTANT = 4; // gets error

console output:

3
[stdin]:6
MYCONSTANT = 4;
           ^

TypeError: Assignment to constant variable.
    at [stdin]:6:12
    at Script.runInThisContext (vm.js:96:20)

function example() {
  var localVariable = 4;

  if(localVariable) {
    var localVariable = "different localVariable"; //changes local variable for entire scope, to resolve that problem we should use type of let
    console.log("nested localVariable: " + localVariable);
  }

  console.log("localVariable: " + localVariable);
}

example();

console output:

nested localVariable: different localVariable
localVariable: different localVariable

function example() {
  var localVariable = 4; // or let localVariable = 4;

  if(localVariable) {
    let localVariable = "different localVariable";
    console.log("nested localVariable: " + localVariable);
  }

  console.log("localVariable: " + localVariable);
}

example();

console output:

nested localVariable: different localVariable
localVariable: 4

objects:

var ltmc = new Object();

var ltmc = {
  description: "Less Talk More Code",
  year: "2018",
  //objects can also have function that uses or changes object's properties
  updateYears: function() {
    return ++ltmc.year;
  }
}

// or you can define as below:
// ltmc.description = "Less Talk More Code";
// ltmc.year = "2018";

console.log("all object: " + ltmc);
console.log("one property of object: " + ltmc.description);

ltmc.updateYears();
console.log("updated: " + ltmc.year);

console output:

all object: [object Object]
one property of object: Less Talk More Code
updated: 2019

//object constructor examples
function Ltmc(description, year) {
  this.description = description;
  this.year = year;
  this.updateYears = function() { //anonymous function
    return ++this.year;
  };
}

var ltmc01 = new Ltmc("Less Talk More Code", "2018");
var ltmc02 = new Ltmc("Less Talk More Code2", "2019");
console.log(ltmc01);
console.log("************");
console.log(ltmc02);

var ltmcList = [
  new Ltmc("Less Talk More Code3", "2020"),
  new Ltmc("Less Talk More Code4", "2021"),
];

console.log("************");
console.log(ltmcList);

console output:

Ltmc {
  description: 'Less Talk More Code',
  year: '2018',
  updateYears: [Function] }
************
Ltmc {
  description: 'Less Talk More Code2',
  year: '2019',
  updateYears: [Function] }
************
[ Ltmc {
    description: 'Less Talk More Code3',
    year: '2020',
    updateYears: [Function] },
  Ltmc {
    description: 'Less Talk More Code4',
    year: '2021',
    updateYears: [Function] } ]

// ltmc01["year"]  -->  bracket notation example
//  ltmc01.year    and    ltmc01["year"]  are same

function Ltmc(description, year) {
  this.description = description;
  this.year = year;
}

var ltmc01 = new Ltmc("Less Talk More Code", "2018");

console.log(ltmc01["year"]);

I'll mention about closures in an another post.
(much more examples: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures )

LESS TALK, MORE CODE

Sunday

Javascript - Functions and Objects