[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-465":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":25,"hasPages":23,"topics":26,"createdAt":10,"pushedAt":10,"updatedAt":40,"readmeContent":41,"aiSummary":42,"trendingCount":16,"starSnapshotCount":16,"syncStatus":43,"lastSyncTime":44,"discoverSource":45},465,"33-js-concepts","leonardomso\u002F33-js-concepts","leonardomso","📜 33 JavaScript concepts every developer should know.","https:\u002F\u002F33jsconcepts.com\u002F",null,"JavaScript",66462,9165,1185,1,0,4,10,103,13,45,"MIT License",false,"master",true,[27,28,29,30,31,32,33,34,35,36,37,38,39],"angular","concepts","es6","es6-javascript","hacktoberfest","javascript","javascript-closures","javascript-engines","javascript-programming","nodejs","primitive-types","programming","react","2026-06-12 02:00:14","\u003Ch1 align=\"center\">\n\u003Cbr>\n  \u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fleonardomso\u002F33-js-concepts\">\u003Cimg src=\"github-image.png\" alt=\"33 Concepts Every JS Developer Should Know\">\u003C\u002Fa>\n  \u003Cbr>\n    \u003Cbr>\n  \u003Cstrong>33 Concepts Every JavaScript Developer Should Know\u003C\u002Fstrong>\n  \u003Cbr>\u003Cbr>\n\u003C\u002Fh1>\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002F33jsconcepts.com\">Read the Full Guide\u003C\u002Fa> •\n  \u003Ca href=\"#concepts\">Concepts\u003C\u002Fa> •\n  \u003Ca href=\"TRANSLATIONS.md\">Translations\u003C\u002Fa> •\n  \u003Ca href=\"CONTRIBUTING.md\">Contributing\u003C\u002Fa>\n\u003C\u002Fp>\n\n\u003Cdiv align=\"center\">\n  \u003Cstrong>Recognized by GitHub as one of the \u003Ca href=\"https:\u002F\u002Fgithub.blog\u002Fnews-insights\u002Foctoverse\u002Fnew-open-source-projects\u002F#top-projects-of-2018\">top open source projects of 2018!\u003C\u002Fa>\u003C\u002Fstrong>\n\u003C\u002Fdiv>\n\n---\n\n## About\n\nThis repository helps developers master core JavaScript concepts. Each concept includes clear explanations, practical code examples, and curated resources.\n\n**[Start learning at 33jsconcepts.com →](https:\u002F\u002F33jsconcepts.com)**\n\n---\n\n## Concepts\n\n### Fundamentals\n\n- **[Primitive Types](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fprimitive-types)**  \n  Learn JavaScript's 7 primitive types: string, number, bigint, boolean, undefined, null, and symbol. Understand immutability, typeof quirks, and autoboxing.\n\n- **[Primitives vs Objects](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fprimitives-objects)**  \n  Learn how JavaScript primitives and objects differ in behavior. Understand immutability, call-by-sharing semantics, why mutation works but reassignment doesn't, and how V8 actually stores values.\n\n- **[Type Coercion](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Ftype-coercion)**  \n  Learn JavaScript type coercion and implicit conversion. Understand how values convert to strings, numbers, and booleans, the 8 falsy values, and how to avoid common coercion bugs.\n\n- **[Equality Operators](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fequality-operators)**  \n  Learn JavaScript equality operators == vs ===, typeof quirks, and Object.is(). Understand type coercion, why NaN !== NaN, and why typeof null returns 'object'.\n\n- **[Scope and Closures](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fscope-and-closures)**  \n  Learn JavaScript scope and closures. Understand the three types of scope, var vs let vs const, lexical scoping, the scope chain, and closure patterns for data privacy.\n\n- **[Call Stack](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fcall-stack)**  \n  Learn how the JavaScript call stack tracks function execution. Understand stack frames, LIFO ordering, execution contexts, stack overflow errors, and debugging with stack traces.\n\n### Functions & Execution\n\n- **[Event Loop](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fevent-loop)**  \n  Learn how the JavaScript event loop handles async code. Understand the call stack, task queue, microtasks, and why Promises always run before setTimeout().\n\n- **[IIFE, Modules & Namespaces](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fiife-modules)**  \n  Learn how to organize JavaScript code with IIFEs, namespaces, and ES6 modules. Understand private scope, exports, dynamic imports, and common module mistakes.\n\n### Web Platform\n\n- **[DOM](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fdom)**  \n  Learn how the DOM works in JavaScript. Understand how browsers represent HTML as a tree, select and manipulate elements, traverse nodes, and optimize rendering performance.\n\n- **[Fetch API](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fhttp-fetch)**  \n  Learn how to make HTTP requests with the JavaScript Fetch API. Understand GET, POST, response handling, JSON parsing, error patterns, and AbortController for cancellation.\n\n- **[Web Workers](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fweb-workers)**  \n  Learn Web Workers in JavaScript for running code in background threads. Understand postMessage, Dedicated and Shared Workers, and transferable objects.\n\n### Object-Oriented JavaScript\n\n- **[Factories and Classes](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Ffactories-classes)**  \n  Learn JavaScript factory functions and ES6 classes. Understand constructors, prototypes, private fields, inheritance, and when to use each pattern.\n\n- **[this, call, apply, bind](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fthis-call-apply-bind)**  \n  Learn how JavaScript's 'this' keyword works and how to control context binding. Understand the 5 binding rules, call\u002Fapply\u002Fbind methods, arrow functions, and common pitfalls.\n\n- **[Object Creation & Prototypes](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fobject-creation-prototypes)**  \n  Learn JavaScript's prototype chain and object creation. Understand how inheritance works, the new operator's 4 steps, Object.create(), Object.assign(), and prototype methods.\n\n- **[Inheritance & Polymorphism](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Finheritance-polymorphism)**  \n  Learn inheritance and polymorphism in JavaScript — extending classes, prototype chains, method overriding, and code reuse patterns.\n\n### Async JavaScript\n\n- **[Callbacks](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fcallbacks)**  \n  Learn JavaScript callbacks, functions passed to other functions to be called later. Understand sync vs async callbacks, error-first patterns, callback hell, and why Promises were invented.\n\n- **[Promises](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fpromises)**  \n  Learn JavaScript Promises for handling async operations. Understand how to create, chain, and combine Promises, handle errors properly, and avoid common pitfalls.\n\n- **[async\u002Fawait](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fasync-await)**  \n  Learn async\u002Fawait in JavaScript. Syntactic sugar over Promises that makes async code readable. Covers error handling with try\u002Fcatch, parallel execution with Promise.all, and common pitfalls.\n\n- **[Generators & Iterators](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fgenerators-iterators)**  \n  Learn JavaScript generators and iterators. Understand yield, the iteration protocol, lazy evaluation, infinite sequences, and async generators with for await...of.\n\n### Functional Programming\n\n- **[Higher-Order Functions](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fhigher-order-functions)**  \n  Learn higher-order functions in JavaScript. Understand functions that accept or return other functions, create reusable abstractions, and write cleaner code.\n\n- **[Pure Functions](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fpure-functions)**  \n  Learn pure functions in JavaScript. Understand the two rules of purity, avoid side effects, and write testable, predictable code with immutable patterns.\n\n- **[map, reduce, filter](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fmap-reduce-filter)**  \n  Learn map, reduce, and filter in JavaScript. Transform, filter, and combine arrays without mutation. Includes method chaining and common pitfalls.\n\n- **[Recursion](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Frecursion)**  \n  Learn recursion in JavaScript. Understand base cases, recursive calls, the call stack, and patterns like factorial, tree traversal, and memoization.\n\n- **[Currying & Composition](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fcurrying-composition)**  \n  Learn currying and function composition in JavaScript. Build reusable functions from simple pieces using curry, compose, and pipe for cleaner, modular code.\n\n### Advanced Topics\n\n- **[JavaScript Engines](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fjavascript-engines)**  \n  Learn how JavaScript engines work. Understand V8's architecture, parsing, compilation, JIT optimization, hidden classes, inline caching, and garbage collection.\n\n- **[Error Handling](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Ferror-handling)**  \n  Learn JavaScript error handling with try\u002Fcatch\u002Ffinally. Understand Error types, custom errors, async error patterns, and best practices for robust code.\n\n- **[Regular Expressions](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fregular-expressions)**  \n  Learn regular expressions in JavaScript. Covers pattern syntax, character classes, quantifiers, flags, capturing groups, and methods like test, match, and replace.\n\n- **[Modern JS Syntax](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fmodern-js-syntax)**  \n  Learn modern JavaScript ES6+ syntax. Covers destructuring, spread\u002Frest operators, arrow functions, optional chaining, nullish coalescing, and template literals.\n\n- **[ES Modules](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fes-modules)**  \n  Learn ES Modules in JavaScript. Understand import\u002Fexport syntax, why ESM beats CommonJS, live bindings, dynamic imports, top-level await, and how modules enable tree-shaking.\n\n- **[Data Structures](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fdata-structures)**  \n  Learn JavaScript data structures from built-in Arrays, Objects, Maps, and Sets to implementing Stacks, Queues, and Linked Lists. Understand when to use each structure.\n\n- **[Algorithms & Big O](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Falgorithms-big-o)**  \n  Learn Big O notation and algorithms in JavaScript. Understand time complexity, implement searching and sorting algorithms, and recognize common interview patterns.\n\n- **[Design Patterns](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fdesign-patterns)**  \n  Learn JavaScript design patterns like Module, Singleton, Observer, Factory, Proxy, and Decorator. Understand when to use each pattern and avoid common pitfalls.\n\n- **[Clean Code](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fclean-code)**  \n  Learn clean code principles for JavaScript. Covers meaningful naming, small functions, DRY, avoiding side effects, and best practices to write maintainable code.\n\n---\n\n## Beyond 33: Extended Concepts\n\nReady to go deeper? These advanced topics build on the fundamentals above.\n\n### Language Mechanics\n\n- **[Hoisting](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fhoisting)**  \n  Learn how JavaScript hoists variable and function declarations. Understand why `var` behaves differently from `let` and `const`, function hoisting order, and how to avoid common bugs.\n\n- **[Temporal Dead Zone](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Ftemporal-dead-zone)**  \n  Learn the Temporal Dead Zone (TDZ) in JavaScript. Understand why accessing `let` and `const` before declaration throws errors, and how TDZ differs from `var` hoisting.\n\n- **[Strict Mode](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fstrict-mode)**  \n  Learn JavaScript strict mode and how `'use strict'` catches common mistakes. Understand silent errors it prevents, forbidden syntax, and when to use it.\n\n### Type System\n\n- **[JavaScript Type Nuances](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fjavascript-type-nuances)**  \n  Learn advanced JavaScript type behavior. Understand null vs undefined, short-circuit evaluation, typeof quirks, instanceof and Symbol.hasInstance, Symbols, and BigInt for large numbers.\n\n### Objects & Properties\n\n- **[Property Descriptors](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fproperty-descriptors)**  \n  Learn JavaScript property descriptors. Understand writable, enumerable, and configurable attributes, Object.defineProperty(), and how to create immutable object properties.\n\n- **[Getters & Setters](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fgetters-setters)**  \n  Learn JavaScript getters and setters. Understand how to define computed properties with `get` and `set`, validate data on assignment, and create reactive object behavior.\n\n- **[Object Methods](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fobject-methods)**  \n  Learn essential JavaScript Object methods. Master Object.keys(), Object.values(), Object.entries(), Object.fromEntries(), Object.freeze(), Object.seal(), and object cloning patterns.\n\n- **[Proxy & Reflect](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fproxy-reflect)**  \n  Learn JavaScript Proxy and Reflect APIs. Understand how to intercept object operations, create reactive systems, implement validation, and build powerful metaprogramming patterns.\n\n- **[WeakMap & WeakSet](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fweakmap-weakset)**  \n  Learn JavaScript WeakMap and WeakSet. Understand weak references, automatic garbage collection, private data patterns, and when to use them over Map and Set.\n\n### Memory & Performance\n\n- **[Memory Management](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fmemory-management)**  \n  Learn JavaScript memory management. Understand the memory lifecycle, stack vs heap allocation, memory leaks, and how to profile memory usage in DevTools.\n\n- **[Garbage Collection](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fgarbage-collection)**  \n  Learn how JavaScript garbage collection works. Understand mark-and-sweep, reference counting, generational GC, and how to write memory-efficient code.\n\n- **[Debouncing & Throttling](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fdebouncing-throttling)**  \n  Learn debouncing and throttling in JavaScript. Understand how to optimize event handlers, reduce API calls, improve scroll performance, and implement both patterns from scratch.\n\n- **[Memoization](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fmemoization)**  \n  Learn memoization in JavaScript. Understand how to cache function results, optimize expensive computations, implement memoization patterns, and when caching hurts performance.\n\n### Modern Syntax & Operators\n\n- **[Tagged Template Literals](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Ftagged-template-literals)**  \n  Learn JavaScript tagged template literals. Understand how to create custom string processing functions, build DSLs, sanitize HTML, and use popular libraries like styled-components.\n\n- **[Computed Property Names](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fcomputed-property-names)**  \n  Learn JavaScript computed property names. Understand how to use dynamic keys in object literals, create objects from variables, and leverage Symbol keys.\n\n### Browser Storage\n\n- **[localStorage & sessionStorage](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Flocalstorage-sessionstorage)**  \n  Learn Web Storage APIs in JavaScript. Understand localStorage vs sessionStorage, storage limits, JSON serialization, storage events, and security considerations.\n\n- **[IndexedDB](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Findexeddb)**  \n  Learn IndexedDB for client-side storage in JavaScript. Understand how to store large amounts of structured data, create indexes, perform transactions, and handle versioning.\n\n- **[Cookies](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fcookies)**  \n  Learn JavaScript cookies. Understand how to read, write, and delete cookies, cookie attributes like HttpOnly and SameSite, security best practices, and when to use cookies vs Web Storage.\n\n### Events\n\n- **[Event Bubbling & Capturing](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fevent-bubbling-capturing)**  \n  Learn JavaScript event bubbling and capturing. Understand the three phases of event propagation, stopPropagation(), event flow direction, and when to use each phase.\n\n- **[Event Delegation](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fevent-delegation)**  \n  Learn event delegation in JavaScript. Understand how to handle events efficiently using bubbling, manage dynamic elements, reduce memory usage, and implement common delegation patterns.\n\n- **[Custom Events](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fcustom-events)**  \n  Learn JavaScript custom events. Understand how to create, dispatch, and listen for CustomEvent, pass data between components, and build decoupled event-driven architectures.\n\n### Observer APIs\n\n- **[Intersection Observer](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fintersection-observer)**  \n  Learn the Intersection Observer API. Understand how to detect element visibility, implement lazy loading, infinite scroll, and animate elements on scroll efficiently.\n\n- **[Mutation Observer](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fmutation-observer)**  \n  Learn the Mutation Observer API. Understand how to watch DOM changes, detect attribute modifications, observe child elements, and replace deprecated mutation events.\n\n- **[Resize Observer](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fresize-observer)**  \n  Learn the Resize Observer API. Understand how to respond to element size changes, build responsive components, and replace inefficient window resize listeners.\n\n- **[Performance Observer](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fperformance-observer)**  \n  Learn the Performance Observer API. Understand how to measure page performance, track Long Tasks, monitor layout shifts, and collect Core Web Vitals metrics.\n\n### Data Handling\n\n- **[JSON Deep Dive](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fjson-deep-dive)**  \n  Learn advanced JSON in JavaScript. Understand JSON.stringify() replacers, JSON.parse() revivers, handling circular references, BigInt serialization, and custom toJSON methods.\n\n- **[Typed Arrays & ArrayBuffers](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Ftyped-arrays-arraybuffers)**  \n  Learn JavaScript Typed Arrays and ArrayBuffers. Understand binary data handling, DataView, working with WebGL, file processing, and network protocol implementation.\n\n- **[Blob & File API](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Fblob-file-api)**  \n  Learn JavaScript Blob and File APIs. Understand how to create, read, and manipulate binary data, handle file uploads, generate downloads, and work with FileReader.\n\n- **[requestAnimationFrame](https:\u002F\u002F33jsconcepts.com\u002Fconcepts\u002Frequestanimationframe)**  \n  Learn requestAnimationFrame in JavaScript. Understand how to create smooth 60fps animations, sync with browser repaint cycles, and optimize animation performance.\n\n---\n\n## Translations\n\nThis project has been translated into 40+ languages by our amazing community!\n\n**[View all translations →](TRANSLATIONS.md)**\n\n---\n\n## Contributing\n\nWe welcome contributions! See our [Contributing Guidelines](CONTRIBUTING.md) for details.\n\n---\n\n## License\n\nMIT © [Leonardo Maldonado](https:\u002F\u002Fgithub.com\u002Fleonardomso)\n\n---\n\n\u003Cdiv align=\"center\">\n  \u003Cstrong>If you find this helpful, please star the repo!\u003C\u002Fstrong>\n\u003C\u002Fdiv>\n","该项目旨在帮助开发者掌握33个核心JavaScript概念。每个概念都提供了清晰的解释、实用的代码示例和精选资源，涵盖了从基础类型到事件循环等广泛主题。项目使用现代JavaScript（ES6+）编写，并通过实际案例深入探讨了闭包、作用域链、类型转换等关键技术点。它适合于任何希望提高自己JavaScript技能水平的前端或后端开发人员，无论是初学者还是有一定经验者都能从中受益。",2,"2026-06-11 02:36:13","top_all"]