JavaScript ES5 (2009)

The foundation of modern JavaScript - ECMAScript 5

🏛️ What is ES5?

ES5 (ECMAScript 5) was released in 2009 and became the foundation of modern JavaScript. It introduced strict mode, JSON support, and many useful array and object methods that are still widely used today. 


// ES5 introduced strict mode for better error handling
"use strict";
var message = "Welcome to ES5!";
console.log(message);

Output:

Welcome to ES5!

Key ES5 Features

⚠️

Strict Mode

Catches common coding mistakes 

"use strict";
// Prevents accidental globals
var name = "Alice";
📋

JSON Support

Built-in JSON parsing and stringifying 

var obj = {name: "John"};
var json = JSON.stringify(obj);
var parsed = JSON.parse(json);
🔄

Array Methods

forEach, map, filter, reduce methods 

var numbers = [1, 2, 3];
numbers.forEach(function(num) {
  console.log(num);
});
🔧

Object Methods

Object.create, Object.keys, Object.defineProperty 

var obj = {a: 1, b: 2};
var keys = Object.keys(obj);
console.log(keys); // ["a", "b"]

🔹 Strict Mode

Strict mode helps you write cleaner code by catching common mistakes: 

// Without strict mode (bad practice)
function badExample() {
    undeclaredVariable = "This creates a global variable!";
}

// With strict mode (good practice)
function goodExample() {
    "use strict";
    var declaredVariable = "This is properly declared";
    console.log(declaredVariable);
}

goodExample();

Output:

This is properly declared

🔹 Array Methods in ES5

ES5 introduced powerful array methods that made working with arrays much easier: 

var numbers = [1, 2, 3, 4, 5];

// forEach - execute function for each element
numbers.forEach(function(num) {
    console.log("Number: " + num);
});

// map - create new array with transformed elements
var doubled = numbers.map(function(num) {
    return num * 2;
});
console.log("Doubled:", doubled);

// filter - create new array with elements that pass test
var evenNumbers = numbers.filter(function(num) {
    return num % 2 === 0;
});
console.log("Even numbers:", evenNumbers);

// reduce - reduce array to single value
var sum = numbers.reduce(function(total, num) {
    return total + num;
}, 0);
console.log("Sum:", sum);

Output:

Number: 1
Number: 2
Number: 3
Number: 4
Number: 5
Doubled: [2, 4, 6, 8, 10]
Even numbers: [2, 4]
Sum: 15

🔹 JSON in ES5

ES5 introduced native JSON support, making data exchange much easier: 

// Creating an object
var person = {
    name: "Alice",
    age: 25,
    city: "New York"
};

// Convert object to JSON string
var jsonString = JSON.stringify(person);
console.log("JSON String:", jsonString);

// Convert JSON string back to object
var parsedObject = JSON.parse(jsonString);
console.log("Parsed Object:", parsedObject);
console.log("Name:", parsedObject.name);

Output:

JSON String: {"name":"Alice","age":25,"city":"New York"}
Parsed Object: {name: "Alice", age: 25, city: "New York"}
Name: Alice

🔹 Object Methods in ES5

ES5 added several useful methods for working with objects: 

var person = {
    firstName: "John",
    lastName: "Doe",
    age: 30
};

// Object.keys() - get array of object keys
var keys = Object.keys(person);
console.log("Keys:", keys);

// Object.create() - create object with specific prototype
var student = Object.create(person);
student.grade = "A";
console.log("Student name:", student.firstName);
console.log("Student grade:", student.grade);

// Object.defineProperty() - define property with specific attributes
Object.defineProperty(person, 'fullName', {
    get: function() {
        return this.firstName + ' ' + this.lastName;
    }
});
console.log("Full name:", person.fullName);

Output:

Keys: ["firstName", "lastName", "age"]
Student name: John
Student grade: A
Full name: John Doe

🧠 Test Your Knowledge

What does "use strict" do in ES5?