Posted on

EcmaScript 3 VS EcmaScript 5

When we speak of EcmaScript, not many people know what it is. But everyone is familiar with JavaScript. So what is EcmaScript and what’s the relationship between JavaScript and EcmaScript?

What is EcmaScript?

EcmaScript is the scripting language standardized by Ecma International in the ECMA-262 specification and ISO/IEC 16262. The language is widely used for client-side scripting on the web, in the form of several well-known implementations such as JavaScript, JScript and ActionScript.

Javascript = EcmaScript + DOM + BOM

EcmaScript is not the only part of JavaScript. Actually, a complete JavaScript is consist of three parts. The core is EcmaScript, it describes the grammar and objects. The remaining parts are DOM and BOM.

History of EcmaScript

The First edition of EcmaScript was published in June 1997. Then the second edition was published one year later and it changed to keep the specification fully aligned with international standard. In December 1999, the third edition, which added regular expressions, better string handling, new control statements, try/catch exception handling, tighter definition of errors, formatting for numeric output and other enhancements, has become the standard of JavaScript and has been supported widely by the browsers.

But, EcmaScript stuck at ES3 since 1999. Because Fourth Edition was abandoned, due to political differences concerning language complexity. Many features proposed for the Fourth Edition have been completely dropped.

In December 2009, the fifth edition was published. On the basis of ES3, ES5 assimilates some features of the popular frameworks.

EcmaScript 3 VS EcmaScript 5

There are 6 main differences between ES3 and ES5 – Implementation, properties and attributes, function, array, JSON and strict mode.
Implementation

This chart from EcmaScript Wikipedia shows the application implementation in ES3 and ES5.

implementation

Properties and Attributes

ES3 code can only create properties that are writable, enumerable, and deletable. There’re only 3 property attributes in ES3 – ReadOnly, DontEnum and DontDelete. Also, ES3 can’t create properties which compute on assignment or reading.

attributes

In ES5, attributes are changed into Writable(does assignment work?), Enumerable(does for-in see it?) and Configurable(can its shape change?) and they are controllable. Attribute values are programmatically settable and testable. Also, Accessor Properties (getter/setter) was added to ES5. Property attribute control and accessor properties means it is able to emulate DOM API in ES code now.

We can manipulate properties and attributes by using ES5 methods. For example, we can use Object.defineProperty(obj, propName, propDescriptor) to define a property as well as modify property attributes.

Define a property:

defineProperty

Modify property attributes:

modifyProperty

These are other object meta methods:
• Object.defineProperties(obj, propName, descriptorSet)
• Object.create(protoObj, descriptorSet)
• Object.getOwnPropertyNames(obj)
• Object.Prototype
• Object.getPrototypeOf(obj)
• Object.getOwnPropertyDescriptor
• Object.getOwnPropertyNames
• Object.preventExtensions
• Object.isExtensible(obj)
• Object.seal
• Object.isSealed(obj)
• Object.freeze
• Object.isFrozen(obj)
• Object.keys

Function

The function in ES5 has 4 features:
1. the value of ‘this’ will not be changed when calling ‘.call()’ or ‘.apply()’
2. ‘null’ and ‘undefined’ will not be returned to global
3. a non-object will not be switched to an object
4. new method Bind. This bind method allows the user to set up the value of this and apply the value to the function.

function

Array

In ES3, there’re not many methods can be used to manipulate the array. ES5 enhances this, now all these methods are all can be used directly.

These are array meta methods:
• Array.prototype.indexOf
• Array.prototype.lastIndexOf
• Array.prototype.every
• Array.prototype.some
• Array.prototype.forEach
• Array.prototype.map
• Array.prototype.filter
• Array.prototype.reduce
• Array.prototype.reduceRight

array

JSON

There is no normative technology of translating JSON data in ES3. In ES5, two main libraries were added to support for JSON. JSON.stringify() will return the value to JSON String, JSON.parse() will do the opposite.

JSON.stringify() → string

stringify

JSON.parse() → value

parse

Strict Mode

In ES3 or ES5-nonstrict, Failure is silent. Execution will proceed assuming success. And we can’t check after every assignment to see if it succeeded. In ES5, Failed assignments throw. A subset intended to provide more thorough error checking and avoid error-prone constructs.

This is how we use strict mode:

strict

Conclusions

On the basis of ES3, ES5 assimilates some features of the popular frameworks and enhances its capability. It’s better for real programs.

 

References:

EcmaScript From Wikipedia
http://en.wikipedia.org/wiki/EcmaScript

Intensive Study of EcmaScript 5
http://www.ibm.com/developerworks/cn/web/1305_chengfu_ecmascript5/#ibm-pcon

EcmaScript 3.1 Object model
http://ppt.tax5.net/e/ecmascript-31-object-model—secure-ecmascript-workshop-w11846-ppt.ppt

Changes to JavaScript, Part 1: EcmaScript 5
http://google-caja.googlecode.com/svn/trunk/doc/html/es5-talk/img0.html

One thought on “EcmaScript 3 VS EcmaScript 5

  1. Hi, this is a comment.
    To delete a comment, just log in and view the post's comments. There you will have the option to edit or delete them.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>