What is Js In a high level

-

 JavaScript is a high-level, prototype-based object-oriented, multiparadigm interpreted or just-in-time compiled dynamic, single-threaded garbage-collected programming language with first-class-functions clog it up 

just in time compiled language 

Our computer only understands 0s and 1s 

Human readable Js convert to the machine to JS 

Multi-paradigm Program 

An approach and mindset of structuring code, which will direct your coding style and technique 

1. Procedural Programming

2.Oriented programming

3. Structure 

Arrays are in 

Prototypal inheritance

Js is a language with first-class functions, functions are simply treated as variables. we can pass them into other functions, and return them from functions 

Javascript is a Dynamic language No data type definitions Types become known at runtimes

The data type of the variable is automatically changed.

Concurrency model How the javascript engine handles multiple tasks happening at the same time 

Javascript runs in one single thread so it can only do one at the same time 

Sounds like it would block the single thread. However, we want non-blocking behavior.

using an event loop takes a long time in the background 

The JavaScript ENGINE AND RUNTIME 

ENGINE

The program that executes Javascript CODE 

V8 Chrome, Node js 

call stack 

Execution context 

Where our code is executed

CALL STACK 

HEAP 

Object in memory 

Where objects are stored.

COMPUTER SCIENCE COMPILATION VS INTERPRETATION 

Compilation Entire code is converted into machine code at once and written to a binary file that can be executed by a computer



Interpretation Interpreter runs through the source code and executes it line by line 



Modern Javascript 

Dragging 1 second 

JavaScript now uses a mix between compilation and interpretation Just-In-Time (JIT)compilation Entire code is compiled and interpreted at the same time.

ENGINE 

Parsing AST 

The compilation is a just-in-time compilation

Execution      Happens in the call stack

Optimization   During execution 



RUNTIME IN THE BROWSER
Container including all the things
ENGINE 

                    HEAP                                               CALL STACK 


WEB APIS

DOM                  TIMES              CONSOLE            Fetch API  



CALL BACK QUEQUE

Click                                         timer                     data          example call function click 

HOW JS IS EXECUTED 

Compilation 
Creation of global execution context for top level 

EXECUTION CONTEXT 

The environment in which a piece of JavaScript is executed. Stores all the necessary information for some code to be executed 

EXACTLY ONE GLOBAL GLOBAL EXECUTION CONTEXT (EC)

Default context, created for code that is not inside any function (top-level)

ONE EXECUTION CONTEXT PER FUNCTION
For each function 

What's inside the execution context 

1 VARIABLE,  ENVIRONMENT 
let, const, and var declarations 
Functions 
Argument objects  not in arrow functions

2 SCOPE CHAIN 

3 THIS KEYBOARD
Generated during the creation phase right before execution 

GLOBAL 
NAME 
FIRST 
SECOND 
X 
FIRST PLACE 

SECOND PLACE 


The call stack 
The place where execution contexts get stacked on top of each other, to keep track of where we are in the execution 
EXECUTION CONTEXT
EXECUTION CONTEXT 
EXECUTION CONTEXT

GLOBAL 
IS EXECUTED 
FIRST()
Second()

SCOPE AND SCOPE CHAIN

SCOPING AND SCOPE:
Scoping: How our program's variables are organized and accessed "Where do variables live"? where can we access
Lexical scoping: Scoping is controlled by placed of functions and blocks in the code

scope: Space or environment in which a certain variable is declared (variables environment in case of functions) There is global space 
Scope variable: Region of our code  

GLOBAL SCOPE 
Top-level code outside of any function 
Variables declared in the global scope are accessible everywhere.


FUNCTION SCOPE 
Variables are accessible only inside a function, NOT Outside.

Also called local scope.

BLOCK SCOPE ES6
The variable is accessible only inside the block (block scope)
HOWEVER, This only applies to let and const variables 
Functions are also block scop (only strict mode).

THE SCOPE CHAIN
Variable lookup in the scope chain 
third () ESC
second() EC
first() Ec
Global EC
 
Scoping asks the question "Where do variables live?" or where can we access a certain variable and where not?

There are 3 types of scope in js: The global scope, scopes defined by functions, and scopes defined by blocks.
Only let and const variables are block-scoped. variables declared with var and up in the closest function scope; 
In JavaScript, we have lexical scoping, so the rules of where we can access variables are based on exactly where in the code functions and blocks are written 

Every scope always has access to all the variables from all its outer scopes. This is the scope chain 

When a variable is not in the current scope, the engine looks up in the scope chain until it finds the variable it's looking for. this is called variable lookup.

The scope chain is a one-way street; a scope will never, ever have access to the variable of an inner scope

The scope chain in a certain scope is equal to adding together all the variable environments of all parents.

The scope chain has nothing to do with the order in which functions were called. it does not affect the scope chain at all.

HOISTING IN JAVASCRIPT 
EXECUTION CONTEXT 
Variable environment 
Scope chain 
This keyboard

Makes some types of variables accessible/usable in the code before they are actually declared.
"Variables lifted to the top of their scope".
Before execution, the code is scanned for variable declarations, for each variable, a new property is created in the variable environment object 












Comments

Post a Comment

Popular posts from this blog

Arrays JavaScript Objects JavaScript

-
Image
  Arrays The Array object, as with arrays in other programming languages, enables storing a collection of multiple items under a single variable name and has members for performing common array operations. Description In JavaScript, arrays aren't primitives but are instead Array objects with the following core characteristics: JavaScript arrays are resizable and can contain a mix of different data types. (When those characteristics are undesirable, use typed arrays instead.) JavaScript arrays are not associative arrays and so, array elements cannot be accessed using arbitrary strings as indexes, but must be accessed using nonnegative integers (or their respective string form) as indexes. JavaScript arrays are zero-indexed: the first element of an array is at index 0, the second is at index 1, and so on — and the last element is at the value of the array's length property minus 1. JavaScript array-copy operations create shallow copies. (All standard built-in copy operations with...
Read more

ADVANCE FUNCTIONS JS

-
Image
 A function has access to the variable environment (VE) of excecution context it was created  Closure : VE attached to the function, exactly as it was at the time and place the function was created  A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function's scope from an inner function. In JavaScript, closures are created every time a function is created, at function creation time. A closure is the closed-over variable environment of the execution context in which a function wascreated, even after that execution context is gone. A closure gives a function access to all the variables of its parent function , even after that parent function has returned. The function keeps a reference to its outer scope, which preserves the scope chain throught time. A closure makes sure that a function doesn't loose connection to variable that...
Read more