C
JavaScript//Lesson 01

JavaScript

30 min·theory

JavaScript

🎯 After reading this lesson

After finishing this lesson, you will be able to confidently do the following 3 things.

  • ✅ JS (JavaScript · the language that makes web pages dynamic) standard patterns
  • ✅ 3 pitfalls (this (the target a function points to when called) · event loop (the structure that manages the order of asynchronous processing) · closure (a function remembering variables from its outer scope)) + how to avoid them
  • ✅ The vocabulary of code that AI frequently produces

Keep the learning objectives as a checklist, and close the lesson once you can answer all of them.

👨‍💻 The People Who Made JavaScript — 4 Creators, 4 Panels

01
Brendan EichBrendan Eich
Creator of JavaScriptNetscape → Mozilla → Brave1961~Present

The language built in 10 days became the most widely used language in the world

  • 1995 Wrote Mocha (LiveScript → JavaScript) in 10 days after joining Netscape
  • 1997 ECMAScript 1 standardization — clarified that it has no relation to Java
  • 1998 Co-founded Mozilla, served as CTO
  • 2016 Launched Brave browser, became CEO — ad blocking + cryptocurrency BAT
JavaScript · SpiderMonkey · Brave — the entire dynamic behavior of 30 years of the webFATHER OF JS · Creator
02
Lars BakLars Bak
Creator of V8 EngineSun (HotSpot) → Google (V8) → Toitware1965~Present

The Danish VM genius who made JavaScript 100× faster — the heart of Chrome

  • 1990s Core engineer on Sun HotSpot JVM — designed the JIT compiler
  • 2006 Joined Google. Founded the V8 team in Aarhus, Denmark
  • 2008 Simultaneous release of V8 + Chrome — JS execution speed improved 100x
  • 2017 Founded IoT startup Toitware — taking on the next VM challenge
V8 — the shared engine powering Chrome · Node · Electron · DenoV8 ENGINE · JIT Genius
03
Ryan DahlRyan Dahl
Creator of Node.js & DenoJoyent → Google Brain → Deno Land1981~Present

The person who brought JS outside the browser — and then rebuilt his own invention

  • 2009 JSConf EU talk — V8 + libuv = Node.js unveiled
  • 2010 npm emerged. The era of JS full-stack development began
  • 2018 JSConf EU '10 Things I Regret About Node.js' talk — Deno unveiled
  • 2020 Deno 1.0 released — TypeScript, security, and standard library built in by default
Node.js · Deno — the beginning and evolution of server-side JavaScriptNODE & DENO · Father of Full-Stack JS
04
Anders HejlsbergAnders Hejlsberg
Creator of TypeScriptBorland → Microsoft1960~Present

Turbo Pascal · Delphi · C# and now TypeScript — four languages created by one person

  • 1983 Joined Borland, wrote Turbo Pascal — the fastest compiler of its time
  • 1996 Moved to Microsoft, led the design of the C# language
  • 2012 TypeScript 0.8 released — JS + gradual type system
  • 2024 TypeScript 5.x — the standard for new JS projects. #1 in npm adoption
TypeScript — the de facto standard for large-scale JS codebasesTYPESCRIPT · Designer of 4 Languages
👥
In one line
Eich (1995 origin) → Bak (2008 V8) → Dahl (2009 Node · 2020 Deno) → Hejlsberg (2012 TS). Four people drove 30 years of JavaScript.

JavaScript — *The Most Widely Used Language in the World*

Core takeaway

A language built in 10 days in 1995 became the most widely used language in the world 30 years later. The de facto only client-side language for the web — now extending to server, mobile, and desktop.

Where it's used

DomainTools
BrowserDynamic behavior of every web page — DOM (the object tree browsers use to handle HTML) manipulation
BackendNode.js · Deno · Bun (runtime environments that run JS outside the browser)
MobileReact Native · Expo (building iOS · Android apps with JS)
DesktopElectron (desktop apps built with JS — Slack · VS Code too)
Build toolsVite · esbuild · webpack (tools that bundle code for the browser)
Big data · AIPartial (visualization · interfaces)

With the same language for front-end, back-end, mobile, and desktop — that is JS's overwhelming strength.

In this category

From the basics through async (handling multiple tasks simultaneously without waiting) · DOM · events. Once you learn it, React · Vue will come naturally.

Why JavaScript Is the Standard Language of the Web

In one line: The only browser language → extended to server, mobile, and desktop. A language that's everywhere.


Tool mapping — the English in each cell is just the tool name; only read the description next to it

DomainJS standard
BrowserES2024 (the latest standard syntax of JS) · DOM · Web API
BackendNode.js · Deno · Bun (running JS outside the browser)
MobileReact Native · Expo (iOS · Android apps with JS)
DesktopElectron · Tauri (desktop apps with JS)
BuildVite · esbuild · Turbopack (tools that bundle code)
TypesTypeScript (a language that adds static types to JS)
Date standardTemporal (2024+ standard — successor to Date, timezone-safe)

5 Key Reasons

ReasonMeaning
Browser exclusivityWeb page behavior is only possible with JS. Zero alternatives
Single thread + event loop (task order manager)The standard model for async processing. Promise (a container holding a result that will arrive in the future) · async/await (syntax that lets you write async code like sync code) — intuitive
TypeScriptLarge-scale apps made possible by adding static types
npm ecosystem2 million+ packages — any feature via npm install (modules — bundles of code)
UniversalFront-end, back-end, mobile, and desktop with the same language

Core point: Understanding JS fundamentals (types · scope · this (the target pointed to when a function is called) · Promise) = the power to work with every front-end tool from first principles.

🤖 Try Asking AI Like This

Knowing the concepts in this lesson lets you give AI specific instructions. Not a vague "fix this" but a vocabulary-backed request — that is the starting point for saving tokens (the unit of text AI processes at once).

  • "Refactor this JS (JavaScript) code to the async/await (syntax that lets you write async code like sync code) pattern (same behavior, cleaner structure)"
  • "Clean up this callback hell into Promise (a container for a future result) chaining"
  • "Check this code for anti-patterns related to closure (a function remembering outer variables) · this (the target pointed to when called)"

Why does this save tokens

Without the concepts, after receiving AI's answer you still have to ask "What is that?" again. That follow-up question is what burns tokens. Learn the concepts once and the conversation ends in one go.

JavaScript Learning Guide - JavaScript