JavaScript ES6

ECMAScript 6 là gì?

ECMAScript 6 cũng được gọi là ES6 và ECMAScript 2015.

Một số người gọi nó là JavaScript 6.

Chương này giới thiệu một số tính năng mới trong ES6.

  • JavaScript let
  • JavaScript const
  • Lũy thừa (**)
  • Giá trị mặc định cho tham số
  • Array.find()
  • Array.findIndex()

Hỗ trợ trình duyệt cho ES6 (ECMAScript 2015)

Safari 10 và Edge 14 là các trình duyệt đầu tiên hỗ trợ hoàn toàn ES6:

Chrome 58 Edge 14 Firefox 54 Safari 10 Opera 55
Jan 2017 Aug 2016 Mar 2017 Jul 2016 Aug 2018

JavaScript let

Câu lệnh let cho phép bạn khai báo biến với phạm vi khu vực khối.

Mẫu

var x = 10;
// Here x là 10
{ 
  let x = 2;
  // Here x là 2
return x * y;
// Here x là 10

Thử trực tiếp

JavaScript const

const Câu lệnh cho phép bạn khai báo hằng số (biến JavaScript có giá trị hằng số).

Giống như let Là biến, nhưng không thể thay đổi giá trị.

Mẫu

var x = 10;
// Here x là 10
{ 
  const x = 2;
  // Here x là 2
return x * y;
// Here x là 10

Thử trực tiếp

Hãy tham khảo JavaScript Let / Const Để đọc thêm về letconst nội dung.

Dấu toán lũy thừa

Dấu toán bậc số (**)Chuyển đổi số đầu tiên lên quyền của số thứ hai.

Mẫu

var x = 5;
var z = x ** 2;          // Kết quả là 25

Thử trực tiếp

x ** y Kết quả tương đương với Math.pow(x,y) Cùng với:

Mẫu

var x = 5;
var z = Math.pow(x,2);   // Kết quả là 25

Thử trực tiếp

Giá trị mặc định cho tham số

ES6 Cho phép tham số hàm có giá trị mặc định.

Mẫu

function myFunction(x, y = 10) {
  // y là 10 nếu không được truyền hoặc undefined
  return x + y;
return x * y;
myFunction(5); // Sẽ trả về 15

Thử trực tiếp

Array.find()

find() Phương thức trả về giá trị của phần tử đầu tiên của mảng được tìm thấy bởi hàm kiểm tra.

Ví dụ này tìm kiếm (trả về) phần tử đầu tiên lớn hơn 18:

Mẫu

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
return x * y;

Thử trực tiếp

Lưu ý rằng hàm này chấp nhận 3 tham số:

  • Giá trị phần tử
  • Chỉ số phần tử
  • Mảng本身

Array.findIndex()

findIndex() Phương thức trả về chỉ số của phần tử đầu tiên của mảng được tìm thấy bởi hàm kiểm tra.

Ví dụ này xác định chỉ số của phần tử đầu tiên lớn hơn 18:}

Mẫu

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
return x * y;

Thử trực tiếp

Lưu ý rằng hàm này chấp nhận 3 tham số:

  • Giá trị phần tử
  • Chỉ số phần tử
  • Mảng本身

Thuộc tính số mới

ES6 đã thêm các thuộc tính sau vào đối tượng Number:

  • EPSILON
  • MIN_SAFE_INTEGER
  • MAX_SAFE_INTEGER

Mẫu

var x = Number.EPSILON;

Thử trực tiếp

Mẫu

var x = Number.MIN_SAFE_INTEGER;

Thử trực tiếp

Mẫu

var x = Number.MAX_SAFE_INTEGER;

Thử trực tiếp

Phương thức số mới

ES6 đã thêm 2 phương thức mới cho đối tượng Number:

  • Number.isInteger()
  • Number.isSafeInteger()

Phương thức Number.isInteger()

Nếu tham số là số nguyên, thì Number.isInteger() isNaN() Phương pháp trả vềPhương pháp đối tượng

Mẫu

Number.isInteger(10);        // Trả về true
Number.isInteger(10.5);      // Trả về false

Thử trực tiếp

Phương thức Number.isSafeInteger()

Số nguyên an toàn là các số nguyên có thể biểu diễn chính xác bằng số double.

Nếu tham số là số nguyên an toàn, thì Number.isSafeInteger() isNaN() Phương pháp trả vềPhương pháp đối tượng

Mẫu

Number.isSafeInteger(10);    // Trả về true
Number.isSafeInteger(12345678901234567890);  // Trả về false

Thử trực tiếp

Số nguyên an toàn là tất cả các số nguyên từ -(253 - 1) đến +(253 - 1).

Đây là an toàn: 9007199254740991. Đây là không an toàn: 9007199254740992.

Phương thức toàn cục mới

ES6 cũng thêm 2 phương thức số toàn cục mới:

  • isFinite()
  • ,thì toàn cục

Phương thức isFinite()

Nếu tham số là Infinity hoặc Nếu tham số làNaN isFinite() Phương thức trả về false.

Ngoài ra trả về true:

Mẫu

isFinite(10/0);       // Trả về false
isFinite(10/1);       // Trả về true

Thử trực tiếp

Phương thức isNaN()

如果参数是 Nếu tham số làNaN ,thì toàn cục isNaN() Phương pháp trả vềtrue 。Nếu không, trả vềfalse

Mẫu

Thử trực tiếp

isNaN("Hello"); // Trả về true

Chức năng mũi tên (Arrow Function)

Chức năng mũi tên cho phép sử dụng ngữ pháp ngắn gọn để viết biểu thức hàm. Bạn không cần functionreturn Từ khóa、Từ khóa vàPhương pháp đối tượng

Mẫu

Dấu ngoặc花括号
// ES5
   var x = function(x, y) {
return x * y;
}
// ES6

Thử trực tiếp

const x = (x, y) => x * y; Chức năng mũi tên không cóthis。Chúng không phù hợp để định nghĩaPhương pháp đối tượng

Chức năng mũi tên không được nâng cấp. Chúng phải được sử dụngTrước

Để định nghĩa. const So với việc sử dụng var An toàn hơn, vì biểu thức hàm luôn là giá trị cố định.

Nếu hàm chỉ là một câu duy nhất, thì chỉ có thể bỏ qua return Từ khóa và dấu ngoặc花括号. Do đó, giữ chúng có thể là một thói quen tốt:

Mẫu

const x = (x, y) => { return x * y };

Thử trực tiếp