javascript-mastery

JavaScript Mastery - Master 33+ Core JavaScript Concepts

Skill Overview

A comprehensive reference guide covering 33+ core JavaScript concepts, from basic types and closures to asynchronous programming and functional programming—helping developers deeply understand the language’s features.

Use Cases

1. Explain JavaScript Concepts

When you need to explain a JavaScript concept to others (or to yourself), this skill provides clear and accurate definitions and code examples covering a wide range of topics—from primitive types to the prototype chain.

2. Debug JavaScript Issues

When you run into strange JavaScript behavior or bugs, you can quickly look up related concepts (such as type coercion, scope, and this binding) to understand the root cause.

3. Prepare for Technical Interviews

Covers the most common JavaScript knowledge points in frontend interviews, including high-frequency questions such as closures, the Event Loop, asynchronous programming, and prototype inheritance.

Core Features

1. 7 Knowledge System Categories

Basics: Primitive types, type conversion, equality operators

Scope: Scope types, closures, variable declarations

Functions: Call stack, hoisting, the this keyword

Asynchronous: Event Loop, callbacks, Promises, async/await

Functional Programming: Higher-order functions, pure functions, currying, composition

Objects: Prototype inheritance, object methods

Modern JS: Destructuring, spread operators, modules, optional chaining

2. Rich Code Examples

Each concept comes with practical code examples, including side-by-side comparisons of correct approaches and common pitfalls to help you understand quickly and avoid stepping into traps.

3. Quick Reference Cards

Provides clear comparison tables of core concepts, including common confusions like == vs ===, var vs let, and ?? vs ||.

Common Questions

What’s the difference between == and === in JavaScript?

== is loose equality: it performs type conversion before comparing; === is strict equality: it does not perform type conversion. For example, "5" == 5 returns true, while "5" === 5 returns false. It’s recommended to always use === unless you have a specific reason to do type conversion.

What is a closure? When should you use it?

A closure is a combination of a function and its lexical scope. Even if the function runs outside its definition scope, it can still access external variables. Common use cases include data privacy (module pattern), function factories, partial application, and memoization. For example:

function createCounter() {
  let count = 0;
  return {
    increment() { return ++count; },
    getCount() { return count; }
  };
}

How does the Event Loop work?

JavaScript’s Event Loop coordinates code execution, event handling, and callback functions. The order is: 1) synchronous code (call stack); 2) microtasks (Promise callbacks); 3) macrotasks (setTimeout, I/O). This is why code inside Promise.resolve().then() runs before code in setTimeout(..., 0).