JS Story

JS Story Prologue

starting, story content, references

0.0 Prologue

JavaScript is the language of the web browser. It gives web pages behavior - responding to user input, fetching data, animating elements, and building complete applications that run without a page reload. Every modern browser embeds a JavaScript engine; no installation is required.
Why JavaScript?
  1. JavaScript runs directly in the browser - no compilation step, no plugins. Open DevTools (F12), type in the console, see the result immediately.
  2. The language is dynamically typed and prototype-based. Objects are collections of key-value pairs; functions are first-class values that can be stored, passed, and returned like any other data.
  3. An event-driven, non-blocking execution model keeps the page responsive while waiting for network responses, timers, or user input - without threads or locks.
  4. The same language runs on the server (Node.js), in build tools, and in browser extensions, making JavaScript knowledge broadly transferable.
  5. A large, mature ecosystem of libraries and frameworks (React, Vue, Svelte, Express, Vite) is built on the same core language covered in this story.
This story covers JavaScript from its object model and syntax through the execution engine, DOM manipulation, CSS style control, and asynchronous programming with Promises and async/await.

0.1 Getting Started

A browser and a text editor are all you need. Create an HTML file, add a <script> tag, and open the file in a browser.
<!-- minimal page with inline script -->
<!DOCTYPE html>
<html>
<body>
  <p id="out"></p>
  <script>
    document.getElementById('out').textContent = 'Hello, world!';
  </script>
</body>
</html>
Use F12 to open browser DevTools. The Console tab lets you run any JavaScript expression and inspect results in real time.

0.2 Story Content

Each chapter covers one area of JavaScript. Pages are accessible from the Pages list at the lower right. Chapters:
  1. Prologue

    Motivation, story layout, and getting started.
  2. JavaScript Summary

    What JavaScript is, syntax quick-reference, and usage patterns.
  3. Execution Engine

    Call stack, heap, task queue, microtask queue, event loop, and Web Workers.
  4. Objects and Classes

    The prototype model, the Object API, and ES2015+ class syntax.
  5. DOM and Styles

    DOM manipulation, CSS style properties via JavaScript, and the Window API.
  6. Async Programming

    Callbacks, Promises, async/await, the Fetch API, and common async patterns.

0.3 References

Reference Description
MDN JavaScript Reference Authoritative property-by-property reference with examples and browser compatibility.
ECMAScript Living Draft (tc39) Continuously updated specification reflecting approved and in-flight language changes.
javascript.info Modern, structured JavaScript tutorial covering the full language with runnable examples.
MDN JavaScript Guide Big-picture language guide with how-tos and best practices.
WHATWG: Event Loops Authoritative specification of the event loop, task queues, and microtask checkpoint.