DOCSEARCHbyAlgolia
Submit Docs

JavaScript Documentation

website·Indexed 30 days ago

https://nonfan.github.io/javascript-docs/

Comprehensive guides on JavaScript language fundamentals, ECMAScript specifications (including ES6, ES7, ES8, and ES9), and the Browser Object Model (BOM). Covers core concepts such as Promises/A+, async/await, Proxy and Reflect, Worker threads, and event flows, as well as integration with web APIs like XMLHttpRequest, Web Socket, and the File API. Includes practical implementation details for frameworks and libraries such as React and Express.js, including database integration with SQLite.

Tokens
123.4K
Snippets
658
Records
773
Agent score
75%

What's inside JavaScript

  3. Overview of the JavaScript Streams API

    The Streams API allows web applications to process ordered chunks of data instead of large, monolithic blocks. This is particularly useful for network responses (where data arrives in packets) or processing large files (video, compression, JSON) without loading the entire dataset into memory.

    There are three primary types of streams:

    1. ReadableStream: A stream from which data chunks can be read via a public interface. Data enters from an underlying source and is processed by a consumer.
    2. WritableStream: A stream to which data chunks can be written. A producer writes data into the stream, which then flows into an underlying sink.
    3. TransformStream: A hybrid stream consisting of a WritableStream (input) and a ReadableStream (output), with a transformer in between to modify the data.

  4. Overview of JavaScript Worker Threads

    Worker threads allow developers to offload intensive tasks from the main JavaScript execution thread to independent entities, preventing the UI from becoming unresponsive. While each worker environment is single-threaded, multiple workers can execute in parallel.

    Key characteristics include:

    • Parallel Execution: Workers run in a separate environment with their own event loop and memory.
    • Limited DOM Access: Workers cannot interact with APIs that depend on single-threaded interaction, such as the DOM.
    • Memory Sharing: Most data passed between the main thread and workers is copied or transferred, though SharedArrayBuffer can be used for shared memory (managed via the Atomics interface).
    • Resource Overhead: Creating workers is relatively expensive due to the need for a new event loop and global object; they are intended for long-running tasks rather than short, high-frequency operations.

  5. Overview of React Core Concepts

    React is a JavaScript library for building user interfaces, primarily used for Single Page Applications (SPAs). Its core architecture is based on:

    • Component-Based Architecture: UIs are broken down into independent, reusable components.
    • Declarative Programming: Developers describe what the UI should look like for a given state, and React handles the DOM updates.
    • Virtual DOM: A lightweight in-memory representation of the DOM. React uses a 'diffing' algorithm to compare the Virtual DOM with the real DOM and updates only the changed parts to optimize performance.
    • Unidirectional Data Flow: Data flows one way (from parent to child), making state management more predictable.

  6. Use TypedArrays for high-performance graphics and binary data

    TypedArrays (such as Float32Array) provide a JavaScript interface to C-style arrays of numeric types. They are used to solve performance issues when passing data to low-level APIs (like WebGL) because they avoid the overhead of converting JavaScript's default double-precision floats into the specific formats required by graphics drivers. A TypedArray acts as a 'view' that allows the JavaScript runtime to access a pre-allocated ArrayBuffer.

  7. Understand the DOM Event Flow

    The DOM2 Events specification defines a three-phase event flow:

    1. Event Capturing: The event moves from the root down to the target.
    2. Target Phase: The event reaches the actual target element.
    3. Event Bubbling: The event propagates back up from the target to the root.

    Modern browsers typically trigger the event on the target element during both the capturing and bubbling phases, providing two opportunities to handle the event on the target.

  8. Access and analyze URL information with the location object

    The location object (accessible via window.location or document.location) provides information about the current URL and navigation capabilities. It breaks the URL into discrete components:
    PropertyDescription
    location.hashURL hash (fragment identifier), including the #
    location.hostServer name and port number
    location.hostnameServer name
    location.hrefThe full URL of the current page
    location.pathnamePath and/or filename from the URL
    location.portRequest port (empty string if not specified)
    location.protocolProtocol used (e.g., 'http:' or 'https:')
    location.searchQuery string starting with '?'
    location.usernameUsername specified before the domain
    location.passwordPassword specified before the domain
    location.originThe origin of the URL (Read-only)

  9. Identify JavaScript Execution Context types

    An Execution Context is an abstract environment where JavaScript code is executed. There are three types:

    1. Global Execution Context: The default, outermost context created before code execution. There is only one per program. Variables/functions here are in the global scope.
    2. Function Execution Context: Created every time a function is called. Each function has its own context containing local variables, arguments, and its position in the call stack.
    3. Eval Execution Context: Created for code executed via the eval() function.

  10. Understand Primitive Wrapper Objects (Boxing)

    JavaScript uses 'boxing' or 'wrapping' to allow primitive values (strings, numbers, booleans) to behave like objects. When a method is called on a primitive, the engine temporarily creates a wrapper object (e.g., String, Number, or Boolean), executes the method, and then destroys the object. Because these wrapper objects are temporary, properties added to a primitive are lost immediately after the line of code executes.
    // Automatic boxing
let s1 = 'some text';
let s2 = s1.substring(2); // Temporary String object created and destroyed

// Attempting to add a property to a primitive fails
let s1_fail = 'some text';
s1_fail.color = 'red';
console.log(s1_fail.color); // undefined

// Explicit wrapping (not recommended)
let explicitStr = new String('some text');
console.log(typeof explicitStr); // 'object'

// Using Object constructor as a factory
let bol = new Object(true); // returns Boolean object
let num = new Object(18);   // returns Number object

  11. Understand synchronous vs asynchronous behavior in JavaScript

    In JavaScript's single-threaded event loop model, synchronous behavior refers to processor instructions executed sequentially in memory. Each instruction is executed in order, and the state (e.g., variable values) is predictable at any point. Asynchronous behavior allows the system to initiate an operation (like a network request or timer) and continue executing other instructions without blocking the thread, with the result being handled later via a mechanism like a callback.
    // Synchronous: execution is sequential
let age = 18;
age = age + 1;

// Asynchronous: execution is deferred, non-blocking
let ageAsync = 18;
setTimeout(() => ageAsync = ageAsync + 1, 1000);

  12. Understand the Promise state machine

    A Promise is a stateful object that can be in one of three mutually exclusive states. Once a Promise transitions from pending to either fulfilled or rejected, the state becomes immutable and cannot be changed again.

    • pending: The initial state; the asynchronous operation is still in progress.
    • fulfilled: The operation completed successfully (also referred to as resolved).
    • rejected: The operation failed.