The JavaScript language
JavaScript often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm. It has curly-bracket syntax, dynamic typing, prototype-based object-orientation, and first-class functions.
Alongside HTML and CSS, JavaScript is one of the core technologies of the World Wide Web. JavaScript enables interactive web pages and is an essential part of web applications. The vast majority of websites use it for client-side page behavior, and all major web browsers have a dedicated JavaScript engine to execute it.
As a multi-paradigm language, JavaScript supports event-driven, functional, and imperative programming styles. It has application programming interfaces (APIs) for working with text, dates, regular expressions, standard data structures, and the Document Object Model (DOM). However, the language itself does not include any input/output (I/O), such as networking, storage, or graphics facilities, as the host environment (usually a web browser) provides those APIs.
JavaScript engines were originally used only in web browsers, but they are now embedded in server-side website deployments, usually via Node.js. They are also embedded in a variety of applications created with frameworks such as Electron and Cordova.
Although there are similarities between JavaScript and Java, including language name, syntax, and respective standard libraries, the two languages are distinct and differ greatly in design.
Here we learn JavaScript, starting from scratch and go on to advanced concepts like OOP.
We concentrate on the language itself here, with the minimum of environment-specific notes.An introduction
- Hello, world!
- Code structure
- The modern mode, “use strict”
- Variables
- Data types
- Type Conversions
- Operators
- Comparisons
- Interaction: alert, prompt, confirm
- Conditional operators: if, ‘?’
- Logical operators
- Loops: while and for
- The “switch” statement
- Functions
- Function expressions
- Arrow functions, the basics
- JavaScript specials
- Objects
- Garbage collection
- Symbol type
- Object methods, “this”
- Object to primitive conversion
- Constructor, operator “new”
- Methods of primitives
- Numbers
- Strings
- Arrays
- Array methods
- Iterables
- Map and Set
- WeakMap and WeakSet
- Object.keys, values, entries
- Destructuring assignment
- Date and time
- JSON methods, toJSON
Advanced working with functions
- Recursion and stack
- Rest parameters and spread syntax
- Variable scope
- The old “var”
- Global object
- Function object, NFE
- The “new Function” syntax
- Scheduling: setTimeout and setInterval
- Decorators and forwarding, call/apply
- Function binding
- Arrow functions revisited
Object properties configuration
- Class basic syntax
- Class inheritance
- Static properties and methods
- Private and protected properties and methods
- Extending built-in classes
- Class checking: “instanceof”
- Mixins
- Introduction: callbacks
- Promise
- Promises chaining
- Error handling with promises
- Promise API
- Promisification
- Microtasks
- Async/await
Generators, advanced iteration
PART 2
Browser: Document, Events, Interfaces
Learning how to manage the browser page: add elements, manipulate their size and position, dynamically create interfaces and interact with the visitor.Document
- Browser environment, specs
- DOM tree
- Walking the DOM
- Searching: getElement*, querySelector*
- Node properties: type, tag and contents
- Attributes and properties
- Modifying the document
- Styles and classes
- Element size and scrolling
- Window sizes and scrolling
- Coordinates
- Introduction to browser events
- Bubbling and capturing
- Event delegation
- Browser default actions
- Dispatching custom events
- Mouse events basics
- Moving the mouse: mouseover/out, mouseenter/leave
- Drag’n’Drop with mouse events
- Keyboard: keydown and keyup
- Scrolling
- Form properties and methods
- Focusing: focus/blur
- Events: change, input, cut, copy, paste
- Forms: event and method submit
- Page: DOMContentLoaded, load, beforeunload, unload
- Scripts: async, defer
- Resource loading: onload and onerror
PART 3
Additional articles
List of extra topics that assume you’ve covered the first two parts of tutorial. There is no clear hierarchy here, you can read articles in the order you want.Frames and windows
- Fetch
- FormData
- Fetch: Download progress
- Fetch: Abort
- Fetch: Cross-Origin Requests
- Fetch API
- URL objects
- XMLHttpRequest
- Resumable file upload
- Long polling
- WebSocket
- Server Sent Events
- From the orbital height
- Custom elements
- Shadow DOM
- Template element
- Shadow DOM slots, composition
- Shadow DOM styling
- Shadow DOM and events
- Patterns and flags
- Character classes
- Unicode: flag “u” and class \p{…}
- Anchors: string start ^ and end $
- Multiline mode of anchors ^ $, flag “m”
- Word boundary: \b
- Escaping, special characters
- Sets and ranges […]
- Quantifiers +, *, ? and {n}
- Greedy and lazy quantifiers
- Capturing groups
- Backreferences in pattern: \N and \k<name>