JS Internship 1.2

JavaScript

10 days

Netscape

LiveScript

*Java

1995

  • Scripting language
  • Dynamic language
  • Client side
  • Server side
  • Native IOS/Android

About JavaScript

  • Big community
  • NPM, biggest package manager in the world
  • ​Reusable, multi-platform
  • Easy to start Learn, Debug, Test
  • *The most cool advantage for me

Advantages

JavaScript Standard Moves to Yearly Release Schedule

EcmaScript

ECMA-262

  • Undefined - undefined
  • Number - number
  • String - string
  • Boolean - boolean
  • Function - function
  • Any other object - object
  • *Null - object
  • *Symbol - symbol

Data types

The typeof operator returns a string indicating the type of the unevaluated operand.

  • var - function scope
  • let - block scope
  • const - read-only *let

Variable Declaration

Operator - var

/* Example 1 */
var num = 15;

num = 64;

var text = 'Hello World';

var text = false;
/* Example 2 */
if (true) {
    var num = 12;
}

console.log(num); // 12

Operator - let

/* Example 1 */
let num = 15;

num = 64;

let text = 'Hello World';

let text = false; // Identifier 'text' has already been declared
/* Example 2 */
if (true) {
    let num = 12;
}

console.log(num); // ReferenceError: num is not defined

Operator - const

const num = 15;

num = 64; // TypeError: Assignment to constant variable.

const obj = {
  name: 'Narek'
};

obj.name = 'Armen';
obj.age = 20;

v1

{...}

v2

Function declaration

console.log(sum(1, 2)); // 2

function sum(a, b) {
  return a * b;
}

console.log(sum(6, 5)); // 30

Function expression

console.log(sum(1, 2)); // ReferenceError: sum is not defined

const sum = function(a, b) {
  return a * b;
}

console.log(sum(6, 5)); // 30

Hoisting variables

/* Example 1 */
sayHi(); // hi!

function sayHi() {
  console.log('hi!')
}

sayHi(); // hi!
/* Example 2 */
sayHi(); // TypeError: sayHi is not a function

var sayHi = function() {
  console.log('hi!')
};

sayHi(); // hi!

Engine stages

  • Compilation
  • Execution

Closures

const num = 15;

function getNewFunction() {
  const num = 56
  return function() {
    return num
  }
}

const newF = getNewFunction()

newF() // ?

Callback

/* Example 1 */
setTimeout(function() {
    console.log('Hello');
}, 2000);
/* Example 2 */

function sum(a, b, cb) {
    setTimeout(function() {
        cb(a + b);
    }, 2000);
}

sum(1, 3, function(v) {
    console.log(v);
});

Question

for (var a = 1; a <= 5; a++) {
    setTimeout(function() {
	console.log(a)
    }, 0);
}
// 6, 6, 6, 6, 6
for (var a = 1; a <= 5; a++) {
    (function() {
        var t = a
	setTimeout(function() {
            console.log(t);
	}, 0);
    })();
}

// 1, 2, 3, 4, 5
for (let a = 1; a <= 5; a++) {
    setTimeout(function() {
        console.log(a);
    }, 0);
}

// 1, 2, 3, 4, 5

Let's start coding

Finalise tic-tac-toe game

Homework

Thank you!

nairi.harutyunyan@optym.com

nairihar99@gmail.com

@nairihar

Optym Internship 1.2

By Nairi Harutyunyan

Made with Slides.com

Optym Internship 1.2

JavaScript

  • 350

More from Nairi Harutyunyan