Skip to content

JavaScript

Scope Chain

While running a line of any execution context, if it can’t find a variable, it will look at OUTER ENVIRONMENT to look for that variable, somewhere down below in the execution stack. Which outer environment to look is depend on where this function sit LEXICALLY.

 

 

Function Invocation and Execution Stack

In the execution phase of global execution context, functions already setup in memory, when it execute function invocation command , such as someFunction(), a new execution context created and put to execution stacks (top of the stack). when function invocation finished, will popped of the stack

Hoisting

variable hoisting

function hoisting

How hoisting work?

WRONG the variable or function are moving to the top

WRONG the variable or function are declared first and assign value later

CORRECT execution context was created in two phases:

  1. the create phase: create global object and outer environments, as the parser runs through, it set up the variables and the functions in memory(recognize where they placed, existed in memory), it’s available to access them, BUT variable is not like functions which are placed entirely in memory,  context knows the value only when it end up executing the code, when it access that variable, it got a placeholder undefined.
  2. the execution phase

The Global Environment and Global Object

Global EXECUTION CONTEXT create two things by JavaScript engine:

1. global object, in the browser named “window”

2. variable called “this”, in global execution context, this == window

JavaScript Conceptual Aside

Syntax Parser

A PROGRAM read your code and determines what it does and if it grammar/syntax is valid

Lexical Enviroment

WHERE something sits physically in the code you write

Execution Context

A wrapper to help manage the code that is RUNNING

Name / Value Pair

A NAME which maps to a unique value, the name could defined multiply, but only can have one value in any given CONTEXT; A value can be more multiple name/value pairs

Object

A collection of many name/value pairs

Global

Not inside a function, sitting inside global object

undefined

A special VALUE in JavaScript, means that the variable hasn’t been set, but variable has been set in memory

Single Threaded

One command is executed at a time. JavaScript behaves in a single thread manner

Sync Execution

One line of code executed at a time, in order. JavaScript is sync execution in its behavior

Invocation

Running a function, in JavaScript by using ()

Variable Environment

WHERE variables live and how they relate to each other in memory. Every execution context has its own variable environment

Scope

WHERE a variable is available in your code

Async

More than one at a time

Dynamic typing

DON’T tell JavaScript engine what type of data a variable holds, it figures it out while code is running

<==> static typing

Primitive type

a data type, not an object

Operator

A special FUNCTION that is syntactically(written) differently, generally operator take two parameters and return one result.

prefix notation: +3 4

infix notation: 3 + 4

postfix notation: 3 4+

Operator precedence

Functions are called in order of precedence

Operator associativity ref

What order when functions have same precedence

Coercion

Convert a value from one type to another

Name Space

A container to keep variables and functions with the same name separate

JavaScript Object Notation(json)

inspired from JavaScript object literial

First Class Fuction

Everything you can do with other types you can do with functions, assign them to variables, pass then around create them on the fly

Expression

A unit of code that results in a value and doesn’t have to save to a variable

Statement

A unit of code doesn’t results in a value (e.g. if statement, function statement)

Mutate

to change something; mutable, means one thing can be changed

Argument

the parameters passed to a function

White Space

invisible characters that create literal ‘space’ in your code

Callback Function

A function you give to another function, to be run when the other function is finished

Function Currying

Create a copy of a function but with some preset parameters, very useful in mathematical

Inheritance

classical vs prototypal

To put it another way, “OO” means “object oriented” (which really means class oriented), so to contrast that, I came up with “OLOO”, which means “objects linked to other objects”. At the end of the day, no matter what syntax hoops you jump through in JS to try to convince yourself you’re doing classes, what you end up with is just a bunch of objects that are each linked to another object: behavior delegation.

Reflection

An object can look at itself,  listing and changing its properties and methods

Function Constructor

A normal function that is used to construct objects via “new” operator

Polyfill

Code that adds a feature which the engine may lack

Syntactic Sugar

A different way to type something that doesn’t change how it work under the hood

Method Chaining

Calling one method after another, and each method affects the parent object

Transpile Language

Convert the syntax of one programming language to another.

E.g. TypeScript, Traceur