JavaScript basics



ECMAScript is the specification used to implement the JavaScript language. JavaScript was developed by Brendan Eich at Netscape as the in-page scripting language for Navigator 2. Nearly every JavaScript environment runs at least ECMAScript 5 (ES5), the version of JavaScript introduced in 2009. Subsequent versions are ES6, ES2016 (ES7) and ES2017 (ES8). Babel is a transpiler, that transforms newer features into ES5 for cross-platform compatibility. Transpilation is a source to source compilation in which the newer versions of JavaScript are used in the user's source code and the transpiler rewrites them so that they are compliant with the current specification.


JavaScript is loosely typed. It also has a feature called prototypal inherintance, a class-free object system where objects inherit properties directly from other objects.

Simple types

The simple types of JavaScript are numbers, strings, booleans, null, and undefined. All other values are objects. Numbers, strings, and booleans are object-like in that they have methods, but they are immutable.


Objects are mutable keyed collections. An object is a container of properties, where a property has a name and a value. A property name can be any string, including the empty string. A property value can be any JavaScript value except for undefined.

Standard built-in objects include Array, Boolean, Date, Error, Function, JSON, Math, Number, Object, RegExp, String, Map, Set, WeakMap, and WeakSet.

Objects are class-free. Objects can contain other objects, so they can represent tree or graph structures. A prototype linkage feature allows one object to inherit the properties of another. This can reduce object initialization time and memory consumption.

Functions are objects, which are collections of name/value pairs having a hidden link to a prototype object. Objects produced from object literals are linked to Object.prototype. Function objects are linked to Function.prototype (which is itself linked to Object.prototype).

Compilation units

A compilation unit contains a set of executable statements. In web browsers, each 'script' tag delivers a compilation unit that is compiled and immediately executed. Lacking a linker, JavaScript throws them all together in a common global namespace.


There are four patterns of invocation in JavaScript: the method, function, constructor and the apply invocation pattern.

IDE, checking

IDE: Microsoft's Code VS.

In analogy to C/C++'s Lint, there's JSlint, a JavaScript syntax checker and verifier.

For TS there's Palantir's TSlint, which comes with basic rules. Popular rules include airbnb.

Jump points


Document Object Model (DOM)

The DOM is a cross-platform and language-independent interface that treats an XML or HTML document as a tree structure wherein each node is an object representing a part of the document. Each branch of the tree ends in a node, and each node contains objects. DOM methods allow programmatic access to the tree; with them one can change the structure, style or content of a document. Nodes can have event handlers attached to them. Once an event is triggered, the event handlers get executed.

DOM standards

The principal standardization of the DOM was handled by the World Wide Web Consortium, which last developed a recommendation in 2004. WHATWG took over development of the standard, publishing it as a living document. The W3C now publishes stable snapshots of the WHATWG standard.

DOM and JS


A document containing HTML is described using the Document interface, extended by the HTML specification to include HTML-specific features. In particular, the Element interface is enhanced to become HTMLElement and various subclasses, each representing one of (or a family of closely related) elements.

To use the DOM in an HTML page, you need to use the HTML module of the DOM, either by

The HTML DOM API provides access to various browser features such as tabs and windows, CSS styles and stylesheets, browser history, etc.

Different browsers have different implementations of the DOM, and these implementations exhibit varying degrees of conformance to the actual DOM standard.




Reactive Programming is a paradigm to express static (e.g., arrays) or dynamic (e.g., event emitters) data streams with ease, and also communicate that an inferred dependency within the associated execution model exists, which facilitates the automatic propagation of the changed data flow.

Reactive Extensions (also known as ReactiveX) is a set of tools allowing imperative programming languages to operate on sequences of data regardless of whether the data is synchronous or asynchronous. It provides a set of sequence operators that operate on each item in the sequence.


AJAX (short for "Asynchronous JavaScript + XML")combines web technologies on the client side to create asynchronous web applications. With Ajax, web applications can send and retrieve data from a server asynchronously (in the background) without interfering with the display and behavior of the existing page.

By decoupling the data interchange layer from the presentation layer, Ajax allows web pages and, by extension, web applications, to change content dynamically without the need to reload the entire page. In practice, modern implementations commonly utilize JSON instead of XML.

Ajax is not a single technology, but rather a group of technologies. HTML and CSS can be used in combination to mark up and style information. The webpage can then be modified by JavaScript to dynamically display—and allow the user to interact with—the new information. The built-in XMLHttpRequest object, or since 2017 the new "fetch()" function within JavaScript, is commonly used to execute Ajax on webpages allowing websites to load content onto the screen without refreshing the page. Ajax is not a new technology, or different language, just existing technologies used in new ways.


jQuery is a Document Object Model (DOM) manipulation library. It is a JS library to simplify HTML DOM tree traversal and manipulation, as well as event handling, CSS animation, and Ajax.


AngularJS is a JavaScript-based open-source front-end web framework mainly maintained by Google and by a community. A framework for client-side model–view–controller (MVC) and model–view–viewmodel (MVVM) architectures, along with components commonly used in rich Internet applications.

AngularJS is the frontend part of the MEAN stack, consisting of MongoDB database, Express.js web application server framework, Angular.js itself, and Node.js server runtime environment.


Web beacons/pixels

A web beacon (also called web bug, tracking bug, tag, web tag, page tag, tracking pixel, pixel tag, 1×1 GIF, or clear GIF) is one of various techniques used on web pages and email, to unobtrusively (usually invisibly) allow checking that a user has accessed some content.

Web beacons are typically used by third parties to monitor the activity of users at a website for the purpose of web analytics or page tagging. They can also be used for email tracking. When implemented using JavaScript, they may be called JavaScript tags.

Using such beacons, companies and organizations can track the online behavior of web users.

At first, the companies doing such tracking were mainly advertisers or web analytics companies; later social media sites also started to use such tracking techniques, for instance through the use of buttons which act as tracking beacons.


Google Analytics.

Google Tag Manager (GTM) allows to manage tags (such as measurement and marketing optimization JavaScript tags) on a site. Without editing the site code, the GTM user interface allows to add and update Google Ads, Google Analytics, Floodlight, and non-Google tags.


Hotjar is a behavior analytics service that helps online businesses understand the behavior of website users, providing feedback through tools such as heatmaps, session recordings, and surveys. It can be used alongside traditional web analytics tools such as Google Analytics to offer an insight into how people are navigating websites, and how their customer experience can be improved.

Facebook Pixel

The Facebook pixel is a snippet of JavaScript code that allows to track visitor activity on a website. It works by loading a small library of functions which you can use whenever a site visitor takes an action (called an event) that you want to track (called a conversion). Tracked conversions appear in the Facebook Ads Manager and in the Facebook Analytics dashboard, where they can be used to measure the effectiveness of ads, to define custom audiences for ad targeting, for dynamic ads campaigns, and to analyze the effectiveness of the website's conversion funnels.


Node.js, nvm, npm, yarn


IPC can be done in http or https: Documentation IDEs


Package manager for the Node.js server platform, installs Node.js programs from the npm registry, organizing the installation and management of third-party Node.js programs. All npm packages (should) contain a package.json, created by executing 'npm init' in its directory. The package.json file holds metadata as well as:





Nest (NestJS) is a Node.js server-side application framework. It uses progressive JavaScript, is built with and fully supports TypeScript and combines elements of OOP (Object Oriented Programming), FP (Functional Programming), and FRP (Functional Reactive Programming).

Under the hood, Nest makes use of HTTP Server frameworks like Express (the default) and optionally can be configured to use Fastify.

Nest provides a level of abstraction above these common Node.js frameworks (Express/Fastify), but also exposes their APIs directly to the developer.




Greasemonkey is a userscript manager made available as a Mozilla Firefox extension. It enables users to install scripts that make on-the-fly changes to web page content after or before the page is loaded in the browser (also known as augmented browsing).



Refer also to JWT, JOSE, etc.