Hướng dẫn ... in javascript es6

ES6

Học Web Chuẩn sẽ giới thiệu với các bạn một số thay đổi của ES6 gần đây. Sẽ giúp bạn hiểu hơn khi bắt đầu học các thư viện hay JS Frameworks thịnh hành hiện nay.

Đây là phần nâng cao của Javascript, do đó để tránh mất thời gian, Học Web Chuẩn sẽ mặc định các bạn đã biết một số khái niệm về Javascript rồi nhé, sẽ tập trung vô nội dung mới của ES6 thôi.

  • ES6 là gì? cho bạn biết về ES6 và cách cài đặt.
  • ES6 - variables phân biệt var - let - const.
  • ES6 - default parameters cách khai báo tham số mặc định.
  • ES6 - spread syntax sử dụng cú pháp "lây lan".
  • ES6 - rest parameters khai báo và sử dụng các tham số còn lại.
  • ES6 - destructuring tùy biến giá trị array hay object.
  • ES6 - arrow function cách viết function mới theo mũi tên.
  • ES6 - classes cấu trúc và cách sử dụng.
  • ES6 - export & import xuất và lồng các file Javascript.

Đã đăng vào thg 12 23, 2016 11:47 CH 4 phút đọc

1. ECMAScript ES6 là gì?

  • ES6 là chữ viết tắt của ECMAScript 6, là phiên bản mới nhất của chuẩn ECMAScript. ECMAScript do hiệp hội các nhà sản xuất máy tính Châu Âu đề xuất làm tiêu chuẩn của ngôn ngữ Javascript. Bạn cứ nghĩ xem hiện nay có khá nhiều trình duyệt Browser ra đời và nếu mỗi Browser lại có cách chạy Javascript khác nhau thì các trang web không thể hoạt động trên tất cả các trình duyệt đó được, vì vậy cần có một chuẩn chung để bắt buộc các browser phải phát triển dựa theo chuẩn đó.

  • ES6 ra đời vào năm 2015 nên cái tên ES2015 được lấy làm tên chính thức với nhiều tính năng mới học hỏi các ngôn ngữ cấp cao khác, hy vọng dần theo thời gian Javascript trở thành một ngôn ngữ lập trình hướng đối tượng.

  • Phiên bản sắp ra trong năm 2017 đó là phiên bản ES7 cũng đang được nghiên cứu và phát triển, họ cũng nhắm đến các kiến thức mới lạ như async function, observer, .. Hy vọng sẽ có nhiều biến động mới.

2. Các chức năng mới của ES6

  • Arrow function: Bạn có thể tạo hàm bằng cách sử dụng dấu mũi tên =>.
  • Block Scoped: Định nghĩa biến với từ khóa let, cách định nghĩa này thì biến chỉ tồn tại trong phạm vi khối của nó [Block Scope]
  • Destructuring Assignments: Bạn có thể khởi tạo các biến từ một mảng bằng một dòng code đơn giản.
  • Default Parameters: Bạn có thể gán giá trị mặc định cho các tham số.
  • Template String: Tạo templaet HTML cực kì đơn giản
  • Weak, Set: các kiểu dữ liệu phức tạp mới

3. Arrow function

  • Arrow là một dạng viết tắt của các function sử dụng dấu =>, tương tự như trong C#, Java 8,…

Cú pháp căn bản:

Cú pháp căn bản nhất của arrow function như sau:

var functionName = [var1, var2] => {
    // Nội dung function
};

ví dụ

var hello = [] => {
  console.log['Hello Bạn'];
};
hello[];

4. Block Scoped

Block Scoped là gì:

  • Block Scoped là phạm vi trong một khối, nghĩa là chỉ hoạt động trong phạm vi được khai báo bời cặp {}.
  • ở Es6 người ta sử dụng biến let để khai báo cho biến trong cặp {}

xét ví dụ sau:

    for [let i = 0; i 

Chủ Đề