JavaScript Tutorial
indexjavascript history javascript versions environment setup variables and data typesOperatorsstrings and numbers programming constructs arrays built in objects functions objects call apply bind closures error handling debugging CallbacksJS in Browser
BOM and DOMBrowser EventsWeb APIAjaxJQueryMost popular librariesAdvanced
prototypes Object Oriented ProgrammingModulesAsynchronous programmingBinary DataInternationalizationreactangularjsProjectsMiscellaneous
typescriptJS ecosystemChrome dev toolstesting frameworksInterview questions and AnswersJavascript History
Brendan Eich (who was working for netscape) created first JS engine. Ecmascript standaradized JS. JavaScript was first released in 1995 and confirms to ECMAScript (ES) specification.There was a big fight between Microsoft Internet explorer and Netscape browsers to gain market share. So Microsoft reverse engineered JavaScript and created own implementation called as JScript. Netscape browser was later redesigned and renamed to Mozilla Firefox.
Here is the timeline of JavaScript.- 1995 - First released
- 2009 - ES5 released
- 2015 - ES6 released
- 2016 - ES7 released
- 2017 - ES8 released
- 2018 - ES9 released
- 2019 - ES10 released
- Chrome - V8 - fastest JS engine - born in 2008
- IE/Edge - Chakra was being used in the beginning but In 2020, edge started using Blink and V8 engines
- Firefox - Spidermonkey
- opera - carakan
- Safari - JavaScript Core - webkit
- JDK - Nashom JS runtime
- NodeJS/Deno - It uses V8 JS runtime
- Bun - It uses JavaScript core - webkit runtime
JavaScript compilation process
Js was interpreted language and had no optimization. Modern JS engine comes with Compiler that can do optimization. e.g. V8 uses JIT - just in time compilation. here are the steps of compilation for Chrome 59+.- Parser will parse the JS source code
- AST - Abstract Syntax Tree is created
- Ignition Interpreter will interpret the AST and create a byte code
- Turbofan compiler will compile the bytecode and create optimized machine code which is then executed by CPU.
JS runtime architecture
JS runtime environment consists of 3 parts - engine, web API, event loop polling message queue.- Javascript engine contains stack and heap. Objects and closures are stored on heap. JS engine contains single call stack because JS is single threaded language. Recursive function that do not retun will cause call stack overflow error.
- Web api include dom manipulation, XMLHttpRequest, setTimeout, setInterval etc. Whenever JS engine encounters these web apis, task is delegated to separate threads. When the event is triggered, callbacks are pushed to macro queue (e.g. setTimeout, onClick event) or microtask queue (e.g. fetch promise).
- Event loop is constantly polling message queue(callback queue) and microtask queue and as soon as JS engine is free, it will ask JS engine to execute these tasks in FIFO order. MicroTask Queue has higher priority than Macro Task Queue.
Web development and Automation testing
solutions delivered!!