Bảng lịch

Hướng dẫn JS

• Hướng dẫn JS
• Giới thiệu JS
• Sử dụng JS
• Đầu ra JS
• Câu JS
• Ngữ pháp JS
• Chú thích JS
• Biến JS
• Let JS
• Const JS
• Toán tử JS
• Tính toán JS
• Gán giá trị JS
• Kiểu dữ liệu JS
• Hàm JS
• Đối tượng JS
• Sự kiện JS
• Chuỗi JS
• Phương thức chuỗi JS
• Tìm kiếm chuỗi JS
• Mẫu chuỗi JS
• Số JS
• BigInt JS
• Phương thức số JS
• Thuộc tính số JS
• Mảng JS
• Phương thức mảng JS
• Tìm kiếm mảng JS
• Sắp xếp mảng JS
• Thực hiện lặp mảng JS
• Định nghĩa hằng số mảng JS
• Ngày JS
• Định dạng ngày JS
• Cách lấy ngày JS
• Cách thiết lập ngày JS
• Toán JS
• Ngẫu nhiên JS
• Lôgic JS
• So sánh JS
• Điều kiện JS
• Switch JS
• Vòng lặp For JS
• Vòng lặp For In JS
• Vòng lặp For Of JS
• Vòng lặp While JS
• Break JS
• Đối tượng có thể lặp lại JS
• Set JS
• Phương pháp Set JS
• Map JS
• Phương pháp Map JS
• typeof JS
• Chuyển đổi loại JS
• Giải cấu trúc JS
• Toán tử bit JS
• Biểu thức chính quy JS
• Cấp độ ưu tiên toán tử JS
• Lỗi JS
• Phạm vi JS
• Hoisting JS
• Chế độ chặt chẽ JS
• Từ khóa this JS
• Hàm mũi tên JS
• Lớp JS
• Mô-đun JS
• JS JSON
• Gỡ lỗi JS
• Hướng dẫn phong cách JS
• Tập quán tốt JS
• Lỗi JS
• Hiệu suất JS
• Từ khóa bảo vệ JS

Phiên bản JS

• Phiên bản JS
• JS 2009 (ES5)
• JS 2015 (ES6)
• JS 2016
• JS 2017
• JS 2018
• JS 2019
• JS 2020
• JS 2021
• JS 2022
• JS 2023
• JS 2024
• JS IE / Edge
• Lịch sử JS

Đối tượng JS

• Định nghĩa đối tượng JS
• Thuộc tính đối tượng JS
• Phương pháp đối tượng JS
• Hiển thị đối tượng JS
• Truy cập đối tượng JS
• Kết hợp đối tượng JS
• Gốc đối tượng JS
• Tham chiếu đối tượng JS

Hàm JS

• Định nghĩa hàm JS
• Tham số hàm JS
• Gọi hàm JS
• Hàm Call JS
• Hàm Apply JS
• Gán hàm JS
• JS Đóng gói

Lớp JS

• Giới thiệu về lớp JS
• JS Kế thừa lớp
• JS Tĩnh

JS Threading

• JS Callback
• JS Threading
• JS Hứa hẹn
• JS Threading

JS HTML DOM

• Giới thiệu về DOM
• Phương pháp DOM
• Tài liệu DOM
• Thành phần DOM
• HTML DOM
• Hình thức DOM
• CSS DOM
• Hoạt hình DOM
• Sự kiện DOM
• Chương trình lắng nghe sự kiện DOM
• Duyệt DOM
• Nút DOM
• Hợp tập hợp DOM
• Danh sách nút DOM

JS BOM trình duyệt

• JS Cửa sổ
• JS Màn hình
• JS Địa điểm
• JS Lịch sử
• JS Navigator
• JS Thông báo
• JS Timing
• JS Cookies

JS Web API

• Giới thiệu về Web API
• API Form Web
• Web History API
• Web Storage API
• Web Worker API
• API Fetch Web
• Web Geolocation API

JS AJAX

• Giới thiệu AJAX
• XMLHttp AJAX
• Yêu cầu AJAX
• Phản hồi AJAX
• Tệp XML AJAX
• AJAX PHP
• AJAX ASP
• Cơ sở dữ liệu AJAX
• Ứng dụng AJAX
• Mô hình AJAX

JS JSON

• Giới thiệu JSON
• Cú pháp JSON
• JSON vs XML
• Kiểu dữ liệu JSON
• Giải mã JSON
• JSON hóa
• Đối tượng JSON
• Mảng JSON
• Máy chủ JSON
• PHP JSON
• HTML JSON
• JSON JSONP

JS vs jQuery

• jQuery chọn lọc
• jQuery HTML
• jQuery CSS
• jQuery DOM

JS hình ảnh

• JS hình ảnh
• JS Canvas
• JS Plotly.js
• JS Chart
• JS biểu đồ Google
• JS D3.js

JS ví dụ

• JS ví dụ
• JS HTML DOM
• JS HTML đầu vào
• JS HTML đối tượng
• JS HTML sự kiện
• JS Browser
• Kiểm tra JS

Tài liệu tham khảo JS

• Đối tượng của JavaScript
• Đối tượng HTML DOM

Khóa học tự chọn

Khuyến nghị khóa học:

• CodeW3C.com 工具箱

Số phiên bản JavaScript

Các phiên bản JS cũ được đặt tên bằng số: ES5 (2009) và ES6 (2015).

Từ năm 2016, các phiên bản được đặt tên theo năm: ECMAScript 2016, 2017, 2018, 2019,...

Tính năng mới trong ES2019:

• String.trimStart()
• String.trimEnd()
• Object.fromEntries
• 可选的 catch 绑定
• Array.flat()
• Array.flatMap()
• Array.Sort() đã được修订 lại
• 重新修订的 JSON.stringify()
• Các dấu phân cách được phép trong văn bản chuỗi
• Function.toString() đã được修订 lại

Cảnh báo

Các tính năng này tương đối mới.

Các trình duyệt cũ có thể cần mã thay thế (Polyfill)

JavaScript 字符串方法 trimStart()

ES2019 đã thêm phương pháp String cho JavaScript trimStart()。

trimStart() Cách hoạt động của phương pháp tương tự như trim() Giống như vậy, nhưng chỉ xóa khoảng trống ở đầu chuỗi.

实例

let text1 = "     Hello World!     ";
let text2 = text1.trimStart();

亲自试一试

Từ tháng 1 năm 2020, tất cả các trình duyệt hiện đại đều hỗ trợ JavaScript String trimStart():

JavaScript 字符串方法 trimEnd()

ES2019 đã thêm vào JavaScript trimEnd() phương pháp chuỗi.

trimEnd() Cách hoạt động của phương pháp tương tự như trim() Giống như vậy, nhưng chỉ xóa khoảng trống ở cuối chuỗi.

实例

let text1 = "     Hello World!     ";
let text2 = text1.trimEnd();

亲自试一试

Từ tháng 1 năm 2020, tất cả các trình duyệt hiện đại đều hỗ trợ JavaScript String trimEnd():

JavaScript 对象方法 fromEntries()

ES2019 đã thêm vào JavaScript fromEntries() Phương pháp đối tượng.

fromEntries() Phương pháp tạo ra đối tượng từ các cặp khóa/giá trị có thể lặp lại.

实例

const fruits = [
["apples", 300],
["pears", 900],
["bananas", 500]
];
const myObj = Object.fromEntries(fruits);

亲自试一试

Từ tháng 1 năm 2020, tất cả các trình duyệt hiện đại đều hỗ trợ JavaScript Object fromEntries():

可选的 catch 绑定

Từ ES2019 trở đi, nếu không cần thiết, có thể bỏ qua tham số catch:

实例

Trước năm 2019:

try {
// mã
}
// mã
}

Sau năm 2019:

try {
// mã
}
// mã
}

Từ tháng 1 năm 2020, tất cả các trình duyệt hiện đại đều hỗ trợ optional catch binding:

JavaScript 数组方法 flat()

ES2019 đã thêm vào JavaScript flat() Phương pháp mảng.

flat() Phương pháp tạo ra mảng mới bằng cách mở rộng mảng đệm.

实例

const myArr = [[1,2],[3,4],[5,6]];
const newArr = myArr.flat();

亲自试一试

Từ tháng 1 năm 2020, tất cả các trình duyệt hiện đại đều hỗ trợ JavaScript Array flat():

JavaScript 数组方法 flatMap()

ES2019 đã thêm vào JavaScript flatMap() Phương pháp mảng.

flatMap() Phương pháp đầu tiên ánh xạ tất cả các phần tử của mảng, sau đó tạo ra mảng mới bằng cách mở rộng mảng.

实例

const myArr = [1, 2, 3, 4, 5, 6];
const newArr = myArr.flatMap((x) => x * 2);

亲自试一试

稳定的数组方法 sort()

ES2019 修订của phương thức sort() của Array.

Trước năm 2019, quy định cho phép sử dụng thuật toán sắp xếp không ổn định, ví dụ như QuickSort.

Sau ES2019, trình duyệt phải sử dụng thuật toán sắp xếp ổn định:

Khi sắp xếp các phần tử dựa trên một giá trị, các phần tử đó phải giữ nguyên vị trí tương đối với các phần tử có cùng giá trị.

实例

const myArr = [
  {name:"X00",price:100 },
  {name:"X01",price:100 },
  {name:"X02",price:100 },
  {name:"X03",price:100 },
  {name:"X04",price:110 },
  {name:"X05",price:110 },
  {name:"X06",price:110 },
  {name:"X07",price:110 }
];

亲自试一试

Trong ví dụ trên, khi sắp xếp theo giá, kết quả không được phép xuất hiện ở các vị trí tương đối khác như sau:

X01 100
X03 100
X00 100
X03 100
X05 110
X04 110
X06 110
X07 110

重新修订的 JSON.stringify()

ES2019 修订của phương thức stringify() của JSON.

Trước năm 2019, JSON không thể.stringify() ký tự được mã hóa bằng \.

实例

let text = JSON.stringify("\u26D4");

亲自试一试

Trước ES2019, việc sử dụng JSON.stringify() trên điểm mã UTF-8 (U+D800 đến U+DFFF) sẽ trả về các ký tự Unicode bị hỏng, ví dụ: ���。

Sau khi chỉnh sửa này, các chuỗi có điểm mã UTF-8 có thể được chuyển đổi an toàn bằng JSON.stringify() và khôi phục lại chuỗi ban đầu bằng JSON.parse()。

分隔符号

Hiện nay, trong văn bản chuỗi, cho phép sử dụng ký tự phân tách dòng và ký tự phân tách đoạn (\u2028 và \u2029）。

Trước năm 2019, chúng được coi là ký tự kết thúc dòng và gây ra lỗi ngoại lệ:

实例

// Điều này là hợp lệ trong ES2019:
let text = "\u2028";

亲自试一试

Lưu ý

Hiện nay, JavaScript và JSON có cùng quy tắc.

Trước ES2019:

text = JSON.parse('"\u2028"') sẽ phân tích thành ''。

text = '"\u2028"' sẽ trả vềLỗi ngữ pháp。

重新修订的 Function toString()

ES2019 修订了 Function toString() 方法。

toString() 方法返回表示函数源代码的字符串。

从 2019 年开始，toString() 必须返回函数的源代码，包括注释、空格和语法细节。

在 2019 年之前，不同的浏览器返回了不同的函数变体（比如没有注释和空格）。从 2019 年开始，该函数应该完全按照编写的方式返回。

实例

function myFunction(p1, p2) {
  return p1 * p2;
}

亲自试一试

工具箱

JavaScript 和 HTML DOM 参考手册

JavaScript 实例

JavaScript 测验

JavaScript 高级教程

赞助商链接