JavaScript ES5

ECMAScript 2009, còn được gọi là ES5, là bản sửa đổi lớn đầu tiên cho JavaScript.

Chương này mô tả các tính năng quan trọng nhất của ES5.

Các tính năng của ES5

Hỗ trợ trình duyệt

ES5được hỗ trợ đầy đủ trong tất cả các trình duyệt hiện đại:


Chrome	IE	Edge	Firefox	Safari	Opera
Yes	9.0	Yes	Yes	Yes	Yes

Chỉ thị "sử dụng nghiêm ngặt"

"use strict"xác định rằng mã JavaScript phải được thực thi ở "chế độ nghiêm ngặt".

Ví dụ: với chế độ nghiêm ngặt, bạn có thể không sử dụng các biến chưa được khai báo.

Bạn có thể sử dụng chế độ nghiêm ngặt trong tất cả các chương trình của mình. Nó giúp bạn viết mã rõ ràng hơn, chẳng hạn như ngăn bạn sử dụng các biến chưa được khai báo.

"use strict"chỉ là một biểu thức chuỗi. Các trình duyệt cũ sẽ không báo lỗi nếu họ không hiểu nó.

Đọc thêm trong Chế độ nghiêm ngặt JS .

Quyền truy cập tài sản trên chuỗi

Phương charAt()thức trả về ký tự tại một chỉ mục (vị trí) được chỉ định trong một chuỗi:

Thí dụ

var str = "HELLO WORLD";
str.charAt(0); // returns H

ES5 cho phép truy cập thuộc tính trên các chuỗi:

Thí dụ

var str = "HELLO WORLD";
str[0]; // returns H

Quyền truy cập thuộc tính trên chuỗi có thể hơi khó đoán.

Đọc thêm trong Phương thức chuỗi JS .

Chuỗi trên nhiều dòng

ES5 cho phép các ký tự chuỗi trên nhiều dòng nếu được thoát bằng dấu gạch chéo ngược:

Thí dụ

"Hello \
Dolly!";

Phương thức \ có thể không được hỗ trợ chung.
Các trình duyệt cũ hơn có thể xử lý các khoảng trắng xung quanh dấu gạch chéo ngược khác nhau.
Một số trình duyệt cũ hơn không cho phép khoảng trắng phía sau ký tự \.

Một cách an toàn hơn để chia nhỏ một chuỗi ký tự, là sử dụng phép cộng chuỗi:

Thí dụ

"Hello " +
"Dolly!";

Các từ dành riêng làm tên tài sản

ES5 cho phép các từ dành riêng làm tên thuộc tính:

Ví dụ về đối tượng

var obj = {name: "John", new: "yes"}

String trim ()

Phương trim()thức loại bỏ khoảng trắng từ cả hai bên của một chuỗi.

Thí dụ

var str = " Hello World! ";
alert(str.trim());

Đọc thêm trong Phương thức chuỗi JS .

Array.isArray ()

Phương isArray()thức kiểm tra xem một đối tượng có phải là một mảng hay không.

Thí dụ

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

Đọc thêm trong Mảng JS .

Mảng forEach ()

Phương forEach()thức này gọi một hàm một lần cho mỗi phần tử mảng.

Thí dụ

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

function myFunction(value) {
txt = txt + value + "<br>";
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Bản đồ mảng ()

Ví dụ này nhân mỗi giá trị mảng với 2:

Thí dụ

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

function myFunction(value) {
return value * 2;
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Bộ lọc mảng ()

Ví dụ này tạo một mảng mới từ các phần tử có giá trị lớn hơn 18:

Thí dụ

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

function myFunction(value) {
return value > 18;
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Mảng giảm ()

Ví dụ này tìm tổng của tất cả các số trong một mảng:

Thí dụ

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

function myFunction(total, value) {
return total + value;
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Array ReduceRight ()

Ví dụ này cũng tìm tổng của tất cả các số trong một mảng:

Thí dụ

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

function myFunction(total, value) {
return total + value;
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Mảng every ()

Ví dụ này kiểm tra xem tất cả các giá trị có trên 18 hay không:

Thí dụ

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

function myFunction(value) {
return value > 18;
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Array some ()

Ví dụ này kiểm tra xem một số giá trị có lớn hơn 18 hay không:

Thí dụ

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

function myFunction(value) {
return value > 18;
}

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Chỉ mục mảngOf ()

Tìm kiếm một giá trị phần tử trong mảng và trả về vị trí của nó.

Thí dụ

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

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

Mảng lastIndexOf ()

lastIndexOf()giống như indexOf(), nhưng tìm kiếm từ cuối mảng.

Thí dụ

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

Tìm hiểu thêm về Phương thức lặp lại mảng JS .

JSON.parse ()

Cách sử dụng phổ biến của JSON là nhận dữ liệu từ máy chủ web.

Hãy tưởng tượng bạn nhận được chuỗi văn bản này từ một máy chủ web:

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

Hàm JavaScript JSON.parse()được sử dụng để chuyển đổi văn bản thành một đối tượng JavaScript:

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

Đọc thêm trong Hướng dẫn JSON của chúng tôi .

JSON.stringify ()

Cách sử dụng phổ biến của JSON là gửi dữ liệu đến máy chủ web.

Khi gửi dữ liệu đến máy chủ web, dữ liệu phải là một chuỗi.

Hãy tưởng tượng chúng ta có đối tượng này trong JavaScript:

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

Sử dụng hàm JavaScript JSON.stringify()để chuyển nó thành một chuỗi.

var myJSON = JSON.stringify(obj);

Kết quả sẽ là một chuỗi theo sau ký hiệu JSON.

myJSON bây giờ là một chuỗi và sẵn sàng được gửi đến một máy chủ:

Thí dụ

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

Đọc thêm trong Hướng dẫn JSON của chúng tôi .

Date.now ()

Date.now() returns the number of milliseconds since zero date (January 1. 1970 00:00:00 UTC).

Example

var timInMSs = Date.now();

Date.now() returns the same as getTime() performed on a Date object.

Learn more in JS Dates.

Date toISOString()

The toISOString() method converts a Date object to a string, using the ISO standard format:

Example

const d = new Date();
document.getElementById("demo").innerHTML = d.toISOString();

Date toJSON()

toJSON() converts a Date object into a string, formatted as a JSON date.

JSON dates have the same format as the ISO-8601 standard: YYYY-MM-DDTHH:mm:ss.sssZ:

Example

d = new Date();
document.getElementById("demo").innerHTML = d.toJSON();

Property Getters and Setters

ES5 lets you define object methods with a syntax that looks like getting or setting a property.

This example creates a getter for a property called fullName:

Example

// Create an object:
var person = {
firstName: "John",
lastName : "Doe",
get fullName() {
return this.firstName + " " + this.lastName;
}
};

// Display data from the object using a getter:
document.getElementById("demo").innerHTML = person.fullName;

This example creates a setter and a getter for the language property:

Example

This example uses a setter to secure upper case updates of language:

Example

var person = {
firstName: "John",
lastName : "Doe",
language : "NO",
  set lang(value) {
    this.language = value.toUpperCase();
  }
};

// Set an object property using a setter:
person.lang = "en";

// Display data from the object:
document.getElementById("demo").innerHTML = person.language;

Learn more about Gettes and Setters in JS Object Accessors

Object.defineProperty()

Object.defineProperty() is a new Object method in ES5.

It lets you define an object property and/or change a property's value and/or metadata.

Example

// Create an Object:
var person = {
firstName: "John",
lastName : "Doe",
language : "NO",
};

// Change a Property:
Object.defineProperty(person, "language", {
value: "EN",
  writable : true,
  enumerable : true,
  configurable : true
});

// Enumerate Properties
var txt = "";
for (var x in person) {
txt += person[x] + "<br>";
}
document.getElementById("demo").innerHTML = txt;

Next example is the same code, except it hides the language property from enumeration:

Example

// Create an Object:
var person = {
firstName: "John",
lastName : "Doe",
language : "NO",
};

// Change a Property:
Object.defineProperty(person, "language", {
value: "EN",
  writable : true,
  enumerable : false,
  configurable : true
});

// Enumerate Properties
var txt = "";
for (var x in person) {
txt += person[x] + "<br>";
}
document.getElementById("demo").innerHTML = txt;

This example creates a setter and a getter to secure upper case updates of language:

Example

/// Create an Object:
var person = {
firstName: "John",
lastName : "Doe",
language : "NO"
};

// Change a Property:
Object.defineProperty(person, "language", {
get : function() { return language },
set : function(value) { language = value.toUpperCase()}
});

// Change Language
person.language = "en";

// Display Language
document.getElementById("demo").innerHTML = person.language;

E5 Object Methods

ES5 added a lot of new Object Methods to JavaScript:

Managing Objects

// Create object with an existing object as prototype
Object.create(parent, donor)

// Adding or changing an object property
Object.defineProperty(object, property, descriptor)

// Adding or changing object properties
Object.defineProperties(object, descriptors)

// Accessing Properties
Object.getOwnPropertyDescriptor(object, property)

// Returns all properties as an array
Object.getOwnPropertyNames(object)

// Accessing the prototype
Object.getPrototypeOf(object)

// Returns enumerable properties as an array
Object.keys(object)

Protecting Objects

// Prevents adding properties to an object
Object.preventExtensions(object)

// Returns true if properties can be added to an object
Object.isExtensible(object)

// Prevents changes of object properties (not values)
Object.seal(object)

// Returns true if object is sealed
Object.isSealed(object)

// Prevents any changes to an object
Object.freeze(object)

// Returns true if object is frozen
Object.isFrozen(object)

Learn more in Object ECMAScript5.

Trailing Commas

ES5 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 !!!

JSON does not allow trailing commas.

JSON Objects:

// Allowed:
var person = '{"firstName":"John", "lastName":"Doe", "age":46}'
JSON.parse(person)

// Not allowed:
var person = '{"firstName":"John", "lastName":"Doe", "age":46,}'
JSON.parse(person)

JSON Arrays:

// Allowed:
points = [40, 100, 1, 5, 25, 10]

// Not allowed:
points = [40, 100, 1, 5, 25, 10,]

❮ Previous Next ❯

Hướng dẫn JS

Phiên bản JS

Đối tượng JS

Các hàm JS

Lớp JS

JS Async

JS HTML DOM

BOM trình duyệt JS

API web JS

JS AJAX

JS JSON

JS so với jQuery

Đồ họa JS

Ví dụ về JS

Tham khảo JS

JavaScript ES5

Các tính năng của ES5

Hỗ trợ trình duyệt

Chỉ thị "sử dụng nghiêm ngặt"

Quyền truy cập tài sản trên chuỗi

Thí dụ

Thí dụ

Chuỗi trên nhiều dòng

Thí dụ

Thí dụ

Các từ dành riêng làm tên tài sản

Ví dụ về đối tượng

String trim ()

Thí dụ

Array.isArray ()

Thí dụ

Mảng forEach ()

Thí dụ

Bản đồ mảng ()

Thí dụ

Bộ lọc mảng ()

Thí dụ

Mảng giảm ()

Thí dụ

Array ReduceRight ()

Thí dụ

Mảng every ()

Thí dụ

Array some ()

Thí dụ

Chỉ mục mảngOf ()

Thí dụ

Mảng lastIndexOf ()

Thí dụ

JSON.parse ()

JSON.stringify ()

Thí dụ

Date.now ()

Example

Date toISOString()

Example

Date toJSON()

Example

Property Getters and Setters

Example

Example

Example

Object.defineProperty()

Example

Example

Example

E5 Object Methods

Managing Objects

Protecting Objects

Trailing Commas

Object Example

Array Example

JSON Objects:

JSON Arrays: