/ / Tìm hiểu cách tạo chương trình không đồng bộ với JavaScript

Tìm hiểu cách tạo chương trình không đồng bộ với JavaScript

Lập trình không đồng bộ là một yếu tố cơ bản trong phát triển phần mềm. Thật khó tin rằng khái niệm lập trình này chỉ mới xuất hiện từ thế kỷ XXI. Ngôn ngữ lập trình F # là ngôn ngữ đầu tiên trong số các đồng nghiệp của nó giới thiệu lập trình không đồng bộ vào năm 2007.

Các ngôn ngữ khác như C #, Python, JavaScript và C ++ dần dần được bổ sung hỗ trợ cho lập trình không đồng bộ. Câu hỏi lớn là, lập trình không đồng bộ thêm giá trị nào vào các ứng dụng của bạn?

Bài viết này trả lời câu hỏi đó và các câu hỏi khác, vì vậy bạn sẽ tìm hiểu tất cả về cách sử dụng lập trình không đồng bộ.

Lập trình đồng bộ là gì?

Lập trình đồng bộ đề cập đến một chương trình ở dạng cơ bản nhất của nó. Mô hình lập trình này xử lý các dòng mã trong một chương trình hoặc tập lệnh một cách tuần tự. Nó luôn bắt đầu từ dòng mã đầu tiên trong một chương trình. Sau đó, nó đợi cho đến khi mỗi dòng mã hoàn thành việc thực thi trước khi chuyển sang dòng tiếp theo.

Mô hình đồng bộ cũng bao gồm mã có điều kiện, chẳng hạn như nếutrong khi các câu lệnh. Mặc dù chỉ một số mã trong câu lệnh điều kiện sẽ thực thi, chương trình vẫn sẽ chạy tuần tự.

Ví dụ về chương trình đồng bộ

const SyncCode = () => {
console.log("This is the first line in the program")
console.log("This is the second line in the program")
console.log("This is the final line in the program")
}

SyncCode();

Chạy chương trình JavaScript ở trên sẽ tạo ra kết quả sau trong bảng điều khiển:

This is the first line in the program
This is the second line in the program
This is the final line in the program

Kết quả ở trên là chính xác những gì bạn nên mong đợi. Chương trình bắt đầu từ trên cùng và đợi cho đến khi một dòng mã kết thúc trước khi chuyển sang dòng tiếp theo.

Lập trình không đồng bộ là gì?

Lập trình không đồng bộ ngược lại với lập trình đồng bộ. Mô hình lập trình không đồng bộ xử lý một số dòng mã đồng thời. Nó không đợi cho đến khi dòng mã trước đó trong chương trình hoàn thành việc thực thi trước khi chuyển sang dòng tiếp theo.

Liên quan: Lập trình đồng bộ và không đồng bộ: Chúng khác nhau như thế nào?

Lập trình không đồng bộ có thể cắt giảm một nửa thời gian thực thi, giúp tạo ra các máy tính nhanh hơn một cách hiệu quả.

Ví dụ về chương trình không đồng bộ

const AsyncCode = () => {
console.log("This is the first line in the program")
setTimeout(() => {
console.log("This is the second line in the program")
}, 3000)
console.log("This is the final line in the program")
}

AsyncCode();

Việc thực thi Mã JavaScript ở trên sẽ tạo ra kết quả sau trong bảng điều khiển của bạn:

This is the first line in the program
This is the final line in the program
This is the second line in the program

Nếu bạn so sánh kết quả đầu ra của bảng điều khiển ở trên với chương trình không đồng bộ tạo ra nó, bạn sẽ thấy rằng có một sự khác biệt rõ ràng. Cuộc gọi đến khúc gỗ cho biết “Đây là dòng thứ hai trong chương trình” xảy ra trước dòng cho biết “Đây là dòng cuối cùng trong chương trình”. Tuy nhiên, đầu ra bảng điều khiển không phản ánh điều này.

Cho rằng JavaScript chủ yếu là đồng bộ, mã trong chương trình trên đã thực thi tuần tự. Nhưng JavaScript hỗ trợ lập trình không đồng bộ thông qua các tính năng như setTimeout () phương pháp.

Các setTimeout () phương thức là một phương thức JavaScript không đồng bộ có hai đối số: một hàm và một độ trễ. Độ trễ là bộ đếm thời gian (tính bằng mili giây), làm chậm quá trình thực thi chức năng. Vì vậy, trong khi chương trình ở trên đang đợi ba giây để thực thi hàm trong setTimeout () , nó chuyển sang dòng tiếp theo trong mã. Điều này dẫn đến việc thực hiện lệnh gọi hàm thứ ba trước lệnh thứ hai.

Công nghệ JavaScript không đồng bộ

Ngoài setTimeout () phương pháp đề cập ở trên, một số công nghệ JavaScript sử dụng lập trình không đồng bộ. Các công nghệ này sử dụng mô hình lập trình không đồng bộ để phát triển các ứng dụng không chặn nhanh hơn. Một số công nghệ này bao gồm:

Liên quan: Node.js là gì? Đây là cách sử dụng JavaScript phía máy chủ

Tạo chương trình không đồng bộ với JavaScript

Có một số cách để xử lý mã không đồng bộ. Phương pháp bạn chọn phải tùy thuộc vào loại ứng dụng bạn muốn phát triển. Các phương thức này bao gồm các hàm gọi lại, lời hứa và async / await.

Chức năng gọi lại

Có hai thuộc tính quan trọng của một hàm gọi lại. Chúng đóng vai trò là tham số cho các chức năng khác và chúng dựa vào các sự kiện bên ngoài để thực hiện nhiệm vụ của mình. Các setTimeout () phương thức được sử dụng trong ví dụ không đồng bộ ở trên là một hàm gọi lại. Chương trình chuyển cho nó một hàm nhật ký như một tham số (hàm gọi lại) và chỉ thực thi nó sau ba giây (sự kiện).

Các chức năng gọi lại rất tốt cho các chương trình nhỏ, nhưng khi các ứng dụng của bạn phát triển, chúng có thể trở nên quá phức tạp nhanh chóng. Điều này là do các hàm gọi lại thường gọi các hàm gọi lại khác, tạo ra một chuỗi các lệnh gọi lại lồng nhau.

Sử dụng lời hứa

JavaScript bổ sung hỗ trợ cho các lời hứa sau các hàm gọi lại. Chúng là một sự thay thế tốt khi tạo các ứng dụng lớn hơn. Một lời hứa đại diện cho những gì có thể xảy ra sau một hoạt động không đồng bộ. Kết quả tiềm năng này sẽ có một trong hai dạng: đã giải quyết hoặc từ chối. Một hàm riêng biệt xử lý từng kết quả này, loại bỏ sự cần thiết phải lồng vào nhau (vấn đề hàm gọi lại). Thay vào đó, những lời hứa khuyến khích các chức năng chuỗi dễ sử dụng hơn.

Mọi lời hứa đều bắt đầu bằng một điều mới Lời hứa đối tượng có chức năng ẩn danh với giải quyếtTừ chối thông số. Trong hàm này, bạn sẽ có ứng dụng không đồng bộ, ứng dụng này sẽ trả về giải pháp nếu hoạt động không đồng bộ thành công hoặc từ chối nếu không.

Các sau đó() chức năng chuỗi xử lý giải quyết chức năng và chụp lấy() chức năng chuỗi xử lý Từ chối chức năng. Vì vậy, không cần câu lệnh if lồng nhau, như trường hợp với các hàm gọi lại.

Ví dụ về sử dụng lời hứa

const PromiseFunction = () =>{
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("this asynchronous operation executed well")
}, 3000)
})
}

PromiseFunction().then((result) => {
console.log("Success", result)
}).catch((error) => {
console.log("Error", error)
})

Đoạn mã trên trả về kết quả sau trong bảng điều khiển:

Success this asynchronous operation executed well

Điều này là do lời hứa trả về giải quyết hàm, chuyển kết quả của nó đến sau đó() chức năng. Nếu lời hứa trả về Từ chối chức năng chương trình sử dụng chụp lấy chức năng thay thế.

Sử dụng Async / Await

Nếu bạn không muốn tạo chuỗi hứa khi xử lý các hoạt động không đồng bộ, thì bạn có thể thử async / await. Async / await không phải là một công cụ không đồng bộ hoàn toàn khác với các hứa hẹn, chỉ là một cách xử lý chúng khác nhau. Nó xử lý các lời hứa mà không cần sử dụng phương pháp chuỗi. Vì vậy, theo cùng một cách mà các hứa hẹn xử lý các hoạt động không đồng bộ tốt hơn các hàm gọi lại, async / await có lợi ích hơn các hứa hẹn đơn giản.

Có hai thuộc tính chính của mọi hàm async / await. Họ bắt đầu với không đồng bộ từ khóa và chờ đợi từ khóa chờ kết quả của một hoạt động không đồng bộ.

Ví dụ về chương trình Async / Await

const PromiseFunction = () =>{
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("this asynchronous operation executed well")
}, 3000)
})
}

const AsyncAwaitFunc = async () => {
const result = await PromiseFunction();
console.log(result);
}

AsyncAwaitFunc();

Đoạn mã trên sẽ trả về kết quả sau trong bảng điều khiển:

this asynchronous operation executed well

Bài học rút ra chính là gì?

Có một số điểm chính mà bạn nên rút ra từ bài viết này:

  • Lập trình không đồng bộ có giá trị vì nó làm giảm thời gian chờ của chương trình, tạo ra các ứng dụng nhanh hơn.

  • Một hàm gọi lại có thể đồng bộ hoặc không đồng bộ.

  • Promises cung cấp một cách tốt hơn để xử lý các hoạt động không đồng bộ so với các hàm gọi lại.

  • Các hàm async / await xử lý các hứa hẹn theo cách tốt hơn so với việc sử dụng các hàm chuỗi.

  • Hàm async / await xử lý các hoạt động không đồng bộ theo cách có vẻ đồng bộ, giúp dễ hiểu hơn.

  • Các hàm mũi tên giúp bạn viết mã tốt hơn.


javascript-arrow-functions
Các hàm mũi tên trong JavaScript có thể giúp bạn trở thành nhà phát triển tốt hơn

Muốn phát triển web tốt hơn? Các hàm mũi tên, được thêm vào JavaScript ES6, cung cấp cho bạn hai cách để tạo các hàm cho ứng dụng web.

Đọc tiếp


Thông tin về các Tác giả

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *