In this article we’ll introduce some of the most useful changes and additions. For a full list, consult Appendices D and E of the official ECMAScript language specification (PDF download, 3MB), available from http://www.ecmascript.org/; you can also see this content in HTML form, at Michael[tm] Smith’s unofficial annotated HTML version.
With the release of Opera 11.60, all of the five major browsers now support ES5, save for implementation bugs. Unless otherwise stated, everything mentioned in this article can be used in the following browser versions (or higher):
- Opera 11.60
- Internet Explorer 9*
- Firefox 4
- Safari 5.1**
IE9 does not include support for strict mode.aspx) – this is added in IE10. ** Safari 5.1 still lacks support for
Function.prototype.bindsupport has recently been added to Webkit.
For information on support in older browsers, see Juriy Zaytsev’s excellent ECMAScript 5 compatibility table.
Strict mode is a way for authors to opt-in a more restrictive variant of the language – providing additional reliability for authors and safety for users. Enabling strict mode is done by adding the
use strict directive is just a string, it will be safely ignored by older browsers.
Many things that cause surprising or buggy behavior at runtime in a script will throw errors in strict mode, for example:
- Assignment to an undeclared variable throws a
ReferenceError, rather than creating a global variable.
- Assigning an identical property more than once in an object literal throws a
- Use of the
withstatement throws a
MDSN’s strict mode article.aspx) has a useful table summarising all of these differences.
ES5 specifies a global
JSON object for serializing (
JSON.stringify) and deserializing (
JSON.parse) objects into the JSON format.
For older browsers, consider using Douglas Crockford’s json2.js, which implements the same functionality in older browsers (after feature-testing for native support).
JSON.parse takes text (formatted as JSON) and returns an ECMAScript value. The optional reviver argument is a function with two arguments,
value, that operates on the results – making it possible to filter or transform what gets returned.
If we want to ensure that the value is an integer upon parsing, we can use the reviver function for that.
JSON.stringify allows authors to take an ECMAScript value and convert it to a JSON-formatted string. In its simplest form,
JSON.stringify takes a value and returns a string.
If we need to to alter the way that the value is stringified, or provide a filter for what gets selected, we can pass it a replacer function. For example, if we want to filter out properties with the value of 13 from our object to be stringified,
If the replacer function returns
undefined, the key/value pair will not be included in the resulting JSON. We can also pass in a space argument to aid in the readability of what gets returned. Possible values can be a number indicating the number of spaces to indent at each level of the JSON string or a string to serve as the indentation. A number over 10, or a string with more than 10 characters will result in a spacer that is truncated to 10 or the first 10 characters.
The following methods are added to the
One of the benefits of these additions is more control over an object’s properties, e.g., what is allowed to be modified, enumerated over, deleted, etc. This is done via programmatic access to an object’s property descriptors. For example:
cat object, its
name cannot be changed, but will appear in a
for-in loop. Among other things, Maru is good at exploring boxes, but that could change in the future so the
skill property is left
In a future article we’ll explore all of the Object additions in more detail.
The following methods are additions to the Array
Dmitry Soshnikov has written an in-depth reference article on the ES5 array “extras”.
One thing not mentioned in Dmitry’s article is
Array.isArray, which as you can see sits directly on the
Array constructor — not the
Array.isArray does pretty much what you would expect it to do — it’s a method that returns
false depending on if the argument’s
[[Class]] internal property is
In ES3, the only reliable way to determine if a value is an array was by using “the Miller Device”, i.e., comparing the internal
[[Class]] property to that of an array.
Function.prototype.bind returns a new function object with its this value bound to the
thisArg argument. Essentially, this allows you to execute a function within the scope of some other object.
In this example, we can call the
location function within the context of the Maru object. As
locate is a property of the global object, its
this value is the global object (
window). In this case, we’re looking for a cat, not a
Location object, so we can create a new method
locateMaru with the
this value bound to always be
- ECMAScript 5 Objects and Properties by John Resig
- ECMA-262-5 in detail: Introduction by Dmitry Soshnikov
- ECMAScript 5 compatibility table by Juriy Zaytsev