Scope Dan Object

Scope

• Global Scope
• Local Scope

tapi sebelumnya mari kita ke konsep...

Cara kerja Javascript Engine?

Syntax Parser

Sebuah program untuk membaca kode kita dan mengerti apa yang diperintahkan dan membedakan grammar tersebut valid atau tidak

Kode yang kita tulis bukanlah magic tapi ada pihak yang menulis program untuk menerjemahkannya  ke komputer

Ilustration

extra stuff

function

variable

Lexical Environment

Dimana kode secara fisik berada / ditulis

Maksud `Lexical environment` pada bahasa pemograman adalah bagian mana kode itu berada yang terpenting.

Execution Context

Sebuah wadah (wrapper) yang membantu mengatur / mengelola kode yang sedang berjalan

Ada banyak lexical environments, yang sedang berjalan dan dikelola pada execution context.

Itu bisa berisi hal-hal di luar apa yang telah di tulis dalam kode itu sendiri.

Ingat, Konsep ini penting!

Execution Context(Global)

• Global (Object)
• `this` keyword

Apa itu Object?

Refresh materi yang lalu.

A Collection of name value pairs

The simplest definition when talking about JavaScript

Ilustrasi

Name

Nested

Name

Name

Name / Value

Name / Value

Name / Value

Name / Value

Name / Value

Name / Value

Execution Context(Global)

Execution Context(Global)

Global Object

`this`

Lihat Developer Console

Execution Context(Global)

Execution Context(Global)

Global Object

`this`

(window)

=

GLOBAL OBJECT adalah Window

GLOBAL OBJECT sama dengan `this`

Global:

• Tidak di dalam `function`

Execution Context

Execution Context

Global Object

`this`

Outer Environment

Kode yang kita tulis

Let's code

Kembali ke Scope

Execution Stack

Stack

• Tumpukan

Tumpukan kode yang dijalankan dan berada di memori. ilustrasinya itu seperti kue lapis atau burger

Execution Stack

Global Execution Context

a()

Execution Context

b()

Execution Context

function

()

{

}

b

function

a

()

{

}

b

()

a

()

Scope Chain

function b () {

   console.log(myVar)

}

function a () {

   var myVar = 2

   b()

}

var myVar = 1

a()

berapa nilai myVar yang di tampilkan di function b?

Text

Scope Chain

Global Execution Context

a()

Execution Context

b()

Execution Context

myVar

1

myVar

2

myVar

?

reference ke outer environment

1

Penjelasan:

• function a, function b dan variable myVar dengan nilai 1 berada di global environment / context. Kemudian tercipta Global execution context di memori

• baris paling terakhir, kita memanggil function a (invocation) maka execution context tercipta lagi dalam hal ini local execution context pada function a

• didalam function a ada variable myVar yang diberi nilai 2 (ini disebut local variable) maka JavaScript menganggap myVar yang ada di function a adalah 2. dan menghiraukan global myVar. Kemudian memanggil function b

• didalam function b, kita print myVar via console.log. namun, myVar tidak ada di function b, maka JavaScript mencari di outer / global environment dan mendapatkan nilai 1 dari myVar

Scope Chain

function b () {

   console.log(myVar)

}

function a () {

   var myVar = 2

   b()

}

// var myVar = 1 

a()

berapa nilai myVar yang di tampilkan di function b?

apabila myVar di global environment tidak ada?

Error!

Scope Chain

function b () {

   console.log(myVar)

}

function a () {

   var myVar = 2

   b()

}

var myVar = 1 

a()

berapa nilai myVar yang di tampilkan di function b?

apabila myVar di global environment tidak ada?

Ada yang bisa jelaskan?

DOM

Document Object Model

DOM

• Mendefinisi ulang HTML dan XML menjadi kumpulan object dan nodes

Event