1.1 JavaScript Overview — History and Standardization

What is JavaScript?

JavaScript started as a programming language that runs in web browsers, and has now expanded its reach to servers, mobile, desktop, and IoT. It is the most widely used programming language in the world.

According to the Stack Overflow Developer Survey (2024), it has ranked #1 as the most commonly used language for 12 consecutive years.

---

Birth: A Language Built in 10 Days

1995, Brendan Eich

In 1995, Brendan Eich, a developer at Netscape, created the first version of JavaScript in just 10 days.

Background:

• The web only had static HTML documents
• There was a need to validate user input in the browser before sending it to the server
• Netscape wanted a scripting language to bring web pages to life

The initial name went through changes: Mocha → LiveScript → JavaScript. The name "JavaScript" was adopted for marketing purposes since Java was popular at the time, but Java and JavaScript are completely different languages.

// The spirit of the first JavaScript Brendan Eich created in 1995
// still lives in modern JavaScript
console.log("Hello, World!"); // Still works the same way!

---

Browser Wars and Fragmentation

Netscape vs Microsoft

As JavaScript gained popularity, Microsoft added JScript, a clone of JavaScript, to Internet Explorer (1996). The different name was due to Netscape's trademark.

Problems from the browser war:

• The same code worked in Netscape but not in IE
• Developers had to write different code for each browser
• Warning messages like "Best viewed in Netscape" appeared

// Code from the browser war era (don't write code like this!)
if (document.getElementById) {
  // Modern browsers
  var el = document.getElementById('myId');
} else if (document.all) {
  // IE 4 and below
  var el = document.all['myId'];
} else if (document.layers) {
  // Netscape 4
  var el = document.layers['myId'];
}

---

ECMAScript Standardization

ECMA International and TC39

In 1996, Netscape submitted JavaScript to a standards organization called ECMA International. The TC39 (Technical Committee 39) committee then took over managing the language specification.

The official name is ECMAScript, and JavaScript is the most famous implementation of ECMAScript.

ECMAScript Version History

Version	Year	Key Changes
ES1	1997	Initial standard
ES2	1998	Minor revisions
ES3	1999	Regular expressions, try/catch
ES4	Abandoned	Too ambitious, scrapped
ES5	2009	Strict mode, JSON, Array methods
ES6 (ES2015)	2015	let/const, arrow functions, classes, modules, Promise
ES2016	2016	** exponentiation operator, Array.includes
ES2017	2017	async/await, Object.entries/values
ES2018	2018	Object spread, Promise.finally
ES2019	2019	Array.flat, Object.fromEntries
ES2020	2020	Optional Chaining ?., Nullish ??, BigInt
ES2021	2021	String.replaceAll, Promise.any, WeakRef
ES2022	2022	Class private #, Array.at, Error.cause
ES2023	2023	Array.findLast, Array.toSorted/toReversed
ES2024	2024	Promise.withResolvers, ArrayBuffer.resize

Why ES6 (ES2015) Matters

ES6 was the biggest update in JavaScript history. Most modern JavaScript code uses ES6+ syntax.

// ES5 style (old)
var add = function(a, b) {
  return a + b;
};
var greet = function(name) {
  return 'Hello, ' + name + '!';
};

// ES6+ style (modern)
const add = (a, b) => a + b;
const greet = (name) => `Hello, ${name}!`;

console.log(add(2, 3));      // 5
console.log(greet('World')); // Hello, World!

---

Current Scope of JavaScript

JavaScript is no longer limited to browsers.

1. Frontend (Browser)

// DOM manipulation
document.querySelector('#btn').addEventListener('click', () => {
  document.querySelector('#result').textContent = 'Clicked!';
});

// Data requests with Fetch API
const response = await fetch('https://api.example.com/data');
const data = await response.json();

2. Backend (Node.js)

// Express.js server
import express from 'express';
const app = express();

app.get('/api/hello', (req, res) => {
  res.json({ message: 'Hello from Node.js!' });
});

app.listen(3000);

3. Mobile Apps (React Native)

// React Native component
import { View, Text, TouchableOpacity } from 'react-native';

export default function App() {
  return (
    <View>
      <Text>Hello Mobile!</Text>
    </View>
  );
}

4. Desktop Apps (Electron)

// Electron main process
const { app, BrowserWindow } = require('electron');

app.whenReady().then(() => {
  const win = new BrowserWindow({ width: 800, height: 600 });
  win.loadFile('index.html');
});

5. Serverless Functions (Cloudflare Workers, Vercel Functions)

// Cloudflare Worker
export default {
  async fetch(request) {
    return new Response('Hello from the Edge!', {
      headers: { 'Content-Type': 'text/plain' }
    });
  }
};

---

JavaScript vs Java: Similar Names, Completely Different Languages

Comparison	JavaScript	Java
Creator	Brendan Eich (Netscape)	James Gosling (Sun Microsystems)
Year	1995	1995
Type System	Dynamic typing	Static typing
Runtime	Browser, Node.js	JVM
Paradigm	Multi-paradigm (functional, OOP)	Primarily OOP
Execution	Interpreter (JIT)	Compiled → JVM bytecode

The name similarity was purely for marketing purposes.

---

TypeScript: The Evolution of JavaScript

In 2012, Microsoft announced TypeScript. TypeScript is a superset of JavaScript that adds static typing.

// TypeScript - explicit types
function add(a: number, b: number): number {
  return a + b;
}

// Type errors caught at compile time
add("2", 3); // Error: string is not assignable to number

TypeScript compiles to JavaScript for execution. TypeScript usage is becoming standard in large-scale projects.

---

Pro Tips

Understanding the TC39 Proposal Process

The process for new JavaScript features to be added to the language:

• Stage 0 (Strawperson): Idea proposal
• Stage 1 (Proposal): Official proposal with motivation and API draft
• Stage 2 (Draft): Specification draft written
• Stage 3 (Candidate): Specification complete, browsers start implementing
• Stage 4 (Finished): Included in next ECMAScript

Stage 3+ proposals can be used early with Babel, and most are included in the next standard.

// Features that reached Stage 4 (already available)
// Promise.withResolvers (ES2024)
const { promise, resolve, reject } = Promise.withResolvers();

setTimeout(() => resolve('Done!'), 1000);
console.log(await promise); // 'Done!'

Why New Versions Release Every Year

After ES6, TC39 switched to releasing a new version every June. This approach:

• Allows for small incremental improvements rather than big changes
• Lets developers use new features quickly
• Prevents failures like ES4 where too many changes were attempted

The current version is ECMAScript 2024 (ES15), and this curriculum is based on the latest standard.