ECMAScript 5 (ES5), released in 2009, significantly enhanced the JavaScript language, introducing features that addressed common pain points and enabling more robust, maintainable, and performant web applications. ES5's improvements laid the groundwork for modern JavaScript development practices. Here are some of the key features introduced in ES5, along with examples:
1. Strict Mode
Strict Mode is a way to opt in to a restricted variant of JavaScript, thereby implicitly opting-out of "sloppy mode". Strict mode makes it easier to write "secure" JavaScript by converting mistakes into errors.
'use strict';
x = 3.14; // This will cause an error because x is not declared
2. JSON Support
ES5 provided built-in support for parsing and stringify-ing JSON (JavaScript Object Notation), facilitating easier data interchange between clients and servers.
var jsonText = '{"name": "John", "age": 30}';
var obj = JSON.parse(jsonText);
console.log(obj.name); // Outputs: John
var str = JSON.stringify(obj);
console.log(str); // Outputs: {"name":"John","age":30}
3. Array Methods
ES5 introduced several new methods for arrays, making it easier to manipulate and query array data.
var fruits = ['apple', 'banana', 'cherry'];
fruits.forEach(function(item, index) {
console.log(index, item);
});
var found = fruits.filter(function(item) {
return item.startsWith('b');
});
console.log(found); // Outputs: ["banana"]
4. Function.bind
The bind()
method creates a new function that, when called, has its this
keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.
function greet() {
console.log('Hello, ' + this.name);
}
var person = { name: 'John' };
var greetPerson = greet.bind(person);
greetPerson(); // Outputs: Hello, John
5. Object Methods
ES5 introduced methods for object manipulation, which were especially useful for object property enumeration and manipulation.
var person = { name: 'John' };
// Define a new property with specific property descriptors
Object.defineProperty(person, 'age', {
value: 30,
writable: true
});
console.log(person.age); // Outputs: 30
// Getting property names
var properties = Object.keys(person);
console.log(properties); // Outputs: ["name", "age"]
6. Accessor Properties (Getters and Setters)
ES5 formalized getter and setter functions, allowing you to define object properties that call a function when they are accessed or modified.
var person = {
firstName: 'John',
lastName: 'Doe',
get fullName() {
return this.firstName + ' ' + this.lastName;
},
set fullName(name) {
var words = name.toString().split(' ');
this.firstName = words[0] || '';
this.lastName = words[1] || '';
}
};
console.log(person.fullName); // Outputs: John Doe
person.fullName = 'Jane Doe';
console.log(person.firstName); // Outputs: Jane
7. Property Descriptors
ES5 allowed for more control over properties through descriptors, enabling developers to precisely define properties as writable, enumerable, and configurable.
var obj = {};
Object.defineProperty(obj, 'readOnly', {
value: 42,
writable: false
});
obj.readOnly = 12;
console.log(obj.readOnly); // Outputs: 42 (because the property is not writable)
ECMAScript 5 was a milestone in the evolution of JavaScript, addressing many of the language's shortcomings and laying down the foundation for future enhancements. Its introduction of strict mode, enhanced object manipulation capabilities, and new array methods significantly improved the language's robustness and developer experience.