THE WORLD'S LARGEST WEB DEVELOPER SITE
×

JS Tutorial

JS HOME JS Introduction JS Where To JS Output JS Statements JS Syntax JS Comments JS Variables JS Operators JS Arithmetic JS Assignment JS Data Types JS Functions JS Objects JS Events JS Strings JS String Methods JS Numbers JS Number Methods JS Arrays JS Array Methods JS Array Sort JS Array Iteration JS Dates JS Date Formats JS Date Get Methods JS Date Set Methods JS Math JS Random JS Booleans JS Comparisons JS Conditions JS Switch JS Loop For JS Loop While JS Break JS Scope JS Let JS Const JS Type Conversion JS Bitwise JS RegExp JS Errors JS Debugging JS Hoisting JS Strict Mode JS this Keyword JS Style Guide JS Best Practices JS Mistakes JS Performance JS Reserved Words JS Versions JS Version ES5 JS Version ES6 JS JSON

JS Forms

JS Forms Forms API

JS Objects

Object Definitions Object Properties Object Methods Object Constructors Object Prototypes

JS Functions

Function Definitions Function Parameters Function Invocation Function Call Function Apply Function Closures

JS HTML DOM

DOM Intro DOM Methods DOM Document DOM Elements DOM HTML DOM CSS DOM Animations DOM Events DOM Event Listener DOM Navigation DOM Nodes DOM Collections DOM Node Lists

JS Browser BOM

JS Window JS Screen JS Location JS History JS Navigator JS Popup Alert JS Timing JS Cookies

JS AJAX

AJAX Intro AJAX XMLHttp AJAX Request AJAX Response AJAX XML File AJAX PHP AJAX ASP AJAX Database AJAX Applications AJAX Examples

JS JSON

JSON Intro JSON Syntax JSON vs XML JSON Data Types JSON Objects JSON Arrays JSON Parse JSON Stringify JSON PHP JSON HTML JSON JSONP

JS Examples

JS Examples JS HTML DOM JS HTML Input JS HTML Objects JS HTML Events JS Browser JS Quiz JS Certificate

JS References

JavaScript Objects HTML DOM Objects


ECMAScript 5 - JavaScript 5


What is ECMAScript 5?

ECMAScript 5 is also known as ES5 and ECMAScript 2009

It is actually JavaScript version 1.8.5, but it is also called JavaScript 5.

This chapter introduces some of the most important features of ES5.


ECMAScript 5 New Features

  • The "use strict" Directive
  • String.trim()
  • Array.isArray()
  • Array.forEach()
  • Array.map()
  • Array.filter()
  • Array.reduce()
  • Array.every()
  • Array.indexOf()
  • Array.lastIndexOf()
  • JSON.parse()
  • JSON.stringify()

ECMAScript 5 Syntactical Changes

  • Trailing commas in array and object litterals
  • Multiline string litterals
  • Reserved words as propery names

The "use strict" Directive

"use strict" defines that the JavaScript code should be executed in "strict mode".

With strict mode you can, for example, not use undeclared variables.

You can use strict mode in all your programs. It helps you to write cleaner code, like preventing you from using undeclared variables.

"use strict" is just a string expression. Old browsers will not throw an error if they don't understand it.

Read more in JS Strict Mode.


String.trim()

String.trim() removes whitespace from both sides of a string.

Example

var str = "       Hello World!        ";
alert(str.trim());
Try it Yourself »

Read more in JS String Methods.



Array.isArray()

Checks whether an object is an array.

Example

function myFunction() {
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var x = document.getElementById("demo");
    x.innerHTML = Array.isArray(fruits);
}
Try it Yourself »

Read more in JS Arrays.


Array.forEach()

The forEach() method calls a function once for each array element.

Example

var txt = "";
var numbers = [4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value, index, array) {
    txt = txt + value + "<br>";
}
Try it Yourself »

Learn more in JS Array Iteration Methods.


Array.map()

The map() method creates a new array by performing a function on each array element.

This example multiplies each array value by 2:

Example

var numbers1 = [4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value, index, array) {
    return value * 2;
}
Try it Yourself »


Array.filter()

The filter() method creates a new array with all array elements that passes a test.

This example creates a new array from elements with a value equal to or larger than 18:

Example

var numbers = [4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value, index, array) {
    return value > 18;
}
Try it Yourself »

Array.reduce()

The reduce() method reduces an array to a single variable.

This example finds the sum of all numbers in an array:

Example

var numbers1 = [4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value, index, array) {
    return total + value;
}
Try it Yourself »

Array.every()

The every() method checks if all array values pass a test.

This example checks if all values are over 18:

Example

var numbers = [4, 9, 16, 25, 29];
var allOver18 = numbers.every(myFunction);

function myFunction(value, index, array) {
    return value > 18;
}
Try it Yourself »

Array.some()

The some() method checks if some array values pass a test.

This example checks if some values are over 18:

Example

var numbers = [4, 9, 16, 25, 29];
var allOver18 = numbers.some(myFunction);

function myFunction(value, index, array) {
    return value > 18;
}
Try it Yourself »

Array.indexOf()

Search an array for an element value and returns its position.

Example

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");
Try it Yourself »

Learn more in JS Array Iteration Methods.


Array.lastIndexOf()

Array.lastIndexOf() is the same as Array.indexOf(), but searches from the end of the array.

Example

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");
Try it Yourself »

Learn more in JS Array Iteration Methods.


JSON.parse()

A common use of JSON is to receive data from a web server.

Imagine you received this text string from a web server:

'{"name":"John", "age":30, "city":"New York"}'

The JavaScript function JSON.parse() is used to convert the text into a JavaScript object:

var obj = JSON.parse('{"name":"John", "age":30, "city":"New York"}');
Try it Yourself »

Read more in our JSON Tutorial.


JSON.stringify()

A common use of JSON is to send data to a web server.

When sending data to a web server, the data has to be a string.

Imagine we have this object in JavaScript:

var obj = {"name":"John", "age":30, "city":"New York"};

Use the JavaScript function JSON.stringify() to convert it into a string.

var myJSON = JSON.stringify(obj);

The result will be a string following the JSON notation.

myJSON is now a string, and ready to be sent to a server:

Example

var obj = {"name":"John", "age":30, "city":"New York"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
Try it Yourself »

Read more in our JSON Tutorial.


Trailing Commas

ECMAScript 5 allows trailing commas in object and array definitions:

Object Example

person = {
  firstName: "John",
  lastName:" Doe",
  age:46,
}

Array Example

points = [
  1,
  5,
  10,
  25,
  40,
  100,
];

WARNING !!!

Internet Explorer 8 will crash.

JSON does not allow trailing commas.

JSON:

person = {firstName:"John", lastName:"Doe", age:46}

JSON:

points = [40, 100, 1, 5, 25, 10];

Strings Over Multiple Lines

ECMAScript 5 allows string litterals over multiple lines if escaped with a backslash:

Example

var obj = {name: "John", new: "yes"};
Try it Yourself »

The \ method might not have universal support.
Older browsers might treat the spaces around the backslash differently.
Some older browsers do not allow spaces behind the \ character.

A safer way to break up a string litteral, is to use string addition:

Example

document.getElementById("demo").innerHTML = "Hello " +
"Dolly!";
Try it Yourself »

Reserwed Words as Property Names

ECMAScript 5 allows reserved words as property names:

Object Example

var obj = {name: "John", new: "yes"}
Try it Yourself »