修远的小屋 (Xiuyuan's House)

website·Indexed 31 days ago

https://house.coderxst.top/

A technical blog featuring tutorials and notes on programming languages and tools. Content includes deep dives into JavaScript (V8 engine, Promises/A+, this keyword, Proxy/Reflect), TypeScript (types, union types), Java (JDBC, I/O streams, Swing, Collections), Linux basics, and webpack configuration.

Tokens
92.6K
Snippets
497
Records
623
Agent score
51%

What's inside 修远的小屋

  1. Overview of Java Time API classes (java.time)

    The Java Time API provides a set of classes for handling dates, times, durations, and time zones. Key classes include:

    • Clock: Accesses the current date and time for a specific time zone.
    • DayOfWeek: Enum representing the seven days of the week.
    • Duration: Represents a time amount (hours, minutes, seconds).
    • Instant: A specific moment in time, precise to nanoseconds. Supports now(), plusXxx(), and minusXxx() methods.
    • LocalDate: A date without a time zone (e.g., 2018-01-27). Supports now(), plusXxx(), and minusXxx().
    • LocalTime: A time without a date or time zone (e.g., 14:49:20). Supports now(), plusXxx(), and minusXxx().
    • LocalDateTime: A combined date and time without a time zone. Supports now(), plusXxx(), and minusXxx().
    • Month: Enum representing the twelve months of the year.
    • MonthDay: A month-of-year and day-of-month (e.g., 01-27).
    • Year: Represents a year (e.g., 2018). Supports now(), plusYears(), and minusYears().
    • YearMonth: A combination of year and month (e.g., 2018-01).
    • ZoneId: An identifier for a time zone.
    • ZonedDateTime: A date-time with a time zone.
  2. Overview of Java Collection Framework Classifications

    Java collections are divided into two main categories: Single-column collections (Collection) and Double-column collections (Map).

    • Collection (Single-column): Stores a series of elements following specific rules. It has two primary sub-interfaces:
      • List: Ordered and allows duplicate elements. Common implementations: ArrayList, LinkedList.
      • Set: Unordered and does not allow duplicate elements. Common implementations: HashSet, TreeSet.
    • Map (Double-column): Stores elements as Key-Value pairs. Keys must be unique. Common implementations: HashMap, TreeMap.
  3. Overview of the browser page rendering pipeline

    The process of transforming a URL into a visible webpage involves several sequential steps managed by the browser's rendering engine:

    1. HTML Parsing: The browser downloads the HTML file and parses it to build the DOM (Document Object Model) tree.
    2. CSS Parsing: The browser downloads CSS files and parses them to build the CSSOM (CSS Object Model) tree.
    3. Render Tree Construction: The DOM and CSSOM trees are combined into a Render Tree. Note that elements with display: none are excluded from the Render Tree.
    4. Layout (Reflow): The browser calculates the exact geometry (width, height, and position) of each node in the Render Tree.
    5. Painting: The calculated layout is converted into actual pixels on the screen (text, colors, borders, etc.).
    6. Compositing: Multiple layers are merged and processed by the GPU to form the final image.

    If changes occur (e.g., modifying element size or color), the browser may trigger a Reflow (re-calculating layout) or Repaint (re-drawing pixels), which can impact performance.

  4. Implement Pure Functions in JavaScript

    A pure function is a core concept in functional programming (heavily used in React components and Redux reducers). A function is considered pure if it meets two criteria:

    1. Deterministic Output: Given the same input, it always produces the same output.
    2. No Side Effects: It does not modify any external state, global variables, or the input arguments, and does not perform I/O operations (like triggering events or printing to a device) that affect the environment outside the function.

    Using pure functions makes code more predictable and easier to test because the developer does not need to worry about external state changes or unexpected mutations of input data.

    // PURE: Deterministic and no side effects
    function sum(num1, num2) {
      return num1 + num2;
    }
    
    // IMPURE: Depends on external variable 'foo'
    let foo = 5;
    function add(num) {
      return foo + num;
    }
    
    // IMPURE: Produces a side effect by mutating the input object
    function printInfo(info) {
      console.log(info.name, info.age);
      info.name = "changed";
    }
    
    // Example of built-in pure vs impure array methods:
    const names = ["abc", "cba", "nba", "dna"];
    
    // slice is pure: returns a new array, original remains unchanged
    const newNames = names.slice(0, 2);
    
    // splice is impure: returns a new array AND modifies the original array
    const newNames2 = names.splice(0, 2);
  5. Understand Java NIO Core Components

    Java NIO is built around three core concepts:

    1. Buffer: An array-based container for data being read from or written to a channel.
    2. Channel: A simulation of traditional I/O streams; all data in NIO must be transported via channels.
    3. Selector: A mechanism to monitor multiple channels for events (e.g., connection open, data arrival), enabling efficient multi-threaded processing.
  6. Understand the V8 engine code transformation pipeline

    The V8 engine transforms JavaScript source code into executable machine code through a multi-stage pipeline:

    1. Lexical Analysis: Source code is broken down into a stream of tokens.
    2. Syntax Analysis (Parsing): Tokens are converted into an Abstract Syntax Tree (AST). This involves a Pre-parsing phase (scanning for declarations to populate symbol tables) and a Parsing phase (generating the actual AST structure).
    3. Bytecode Generation: The AST is converted into bytecode, a platform-independent intermediate representation consisting of instructions like Constant, SetLocal, and Call.
    4. JIT Compilation: Bytecode is converted into native machine code using Just-In-Time (JIT) compilation. This happens in two stages: Pre-compilation (fast, simple machine code) and Optimization (using the TurboFan compiler to generate high-performance code based on runtime profiling).
  7. Use Throwable class methods for debugging

    The Throwable class provides methods to extract information about an exception for logging and debugging purposes.
    String message = e.getMessage(); // Returns the detailed message string
    e.printStackTrace(); // Prints the stack trace to standard error
    e.printStackTrace(printStream); // Prints the stack trace to a specific output stream
  8. Intercept object operations using Proxy

    The Proxy object allows you to create a wrapper for another object (the target), enabling you to intercept and redefine fundamental operations such as property lookup, assignment, enumeration, and function invocation. This is more flexible than Object.defineProperty because it can listen to the addition or deletion of properties and does not require pre-defining every property to be monitored.
    const obj = { name: "why", age: 18 };
    
    const objProxy = new Proxy(obj, {
      get: function (target, key, receiver) {
        console.log(`Intercepted get for ${key}`);
        return target[key];
      },
      set: function (target, key, value, receiver) {
        console.log(`Intercepted set for ${key} to ${value}`);
        target[key] = value;
        return true; // Indicate success
      }
    });
    
    objProxy.name = "kobe"; // Triggers set trap
    console.log(objProxy.name); // Triggers get trap
  9. Understand the Java Map interface characteristics

    The Map interface represents a double-column collection where each element consists of a unique Key and a corresponding Value (a mapping).

    • One-to-One Mapping: Each key maps to exactly one value.
    • Key Uniqueness: Keys must be unique; duplicate keys are not allowed.
    • Flexibility: Both keys and values can be of any data type.
  10. Understand Java I/O Stream Hierarchy

    Java I/O streams are categorized into two main types based on the data they handle: byte streams and character streams. All four top-level classes are abstract and serve as parent classes for specific stream implementations.

    • Byte Streams: Use InputStream (input) and OutputStream (output).
    • Character Streams: Use Reader (input) and Writer (output).
  11. Understand the JavaScript Global Execution Process

    When JavaScript executes code, it follows a specific initialization and execution sequence:

    1. Global Object (GO) Initialization: Before code execution, the engine creates a Global Object in heap memory. This object contains built-in globals (e.g., Date, Array, String, setTimeout) and a window property that points to itself.
    2. Global Execution Context (GEC) Creation: A GEC is created and pushed onto the Execution Context Stack (ECS).
    3. Hoisting (Pre-execution): The engine scans the global scope for variable and function declarations. These are added to the Global Object (which acts as the Variable Object/VO for the global context) and memory is allocated, but values are not yet assigned.
    4. Execution: The engine executes the code line-by-line, performing assignments and invoking functions.