Phạm vi gọi lại javascript

Mình phải thừa nhận một điều là mình đã quyết định học Nodejs phải chăng qua bịch ép mà thôi. Với điểm xuất phát từ trình lập trình Java, cho đến trình lập trình Android nên tư duy xử lý bất đồng bộ Javascript thực sự làm mình bối rối

Như mọi người cũng biết, việc xử lý các tác vụ trong Javascript là bất đồng bộ. Tức là các nhiệm vụ sẽ được Javascript đưa ra hết một vòng lặp sự kiện

Các bạn có thể xem video bên dưới để hiểu rõ hơn về Event Loop trong Javascript nhé

Nhiệm vụ nào hoàn thành thì sẽ xảy ra sự kiện để thông báo và trả kết quả. Do đó, các nhiệm vụ sẽ không được thực hiện theo đúng trình tự như chúng ta nhìn thấy trong mã

Từ đó, chúng ta sử dụng gọi lại để có thể điều khiển việc thực hiện các tác vụ theo đúng trình tự mong muốn

Tuy nhiên, nếu sử dụng callback mà không được thiết kế cẩn thận sẽ làm cho code của bạn trở nên khó đọc, khó bảo trì

Phạm vi gọi lại javascript

Nội dung chính của bài viết

#Callback hell trong javascript là gì?

Chắc chắn bạn đang rất muốn biết bản chất callbackhell trong javascript là điều gì sai?

Thực hiện callback hell trong javascript chỉ là bạn thực hiện quá nhiều callback lồng nhau. Đại khái, địa ngục gọi lại sẽ có định dạng như bên dưới

getData(function(a){  
    getMoreData(a, function(b){
        getMoreData(b, function(c){ 
            getMoreData(c, function(d){ 
                getMoreData(d, function(e){ 
                    ...
                });
            });
        });
    });
});

Nhìn qua đoạn mã bạn có thấy đau không?

Những người mới bắt đầu học Nodejs thường rất dễ bị lỗi này. Đơn giản vì bạn chưa có một nhà tư vấn thiết kế chuẩn cho kiểu hệ thống định hướng sự kiện

Bài viết này mình sẽ chia sẽ 5 cách để các bạn hạn chế bị callback hell trong javascript mà dễ thực hiện nhất

>> Đọc ngay. Định nghĩa hàm Javascript – 3 cách cơ bản nhất

#6 cách xử lý callback hell trong javascript dễ nhất

1. Thiết kế ứng dụng theo mô-đun định dạng

Cũng giống với các ngôn ngữ lập trình khác nhau, một trong những cách để hạn chế sự phức tạp của mã là mô-đun hóa

Bất kể khi nào bạn viết code, đừng cắm cổ vào viết ngay mà hãy dành chút thời gian để suy nghĩ xem mình viết như thế nào là tốt nhất chưa

Bạn đang viết một đoạn mã và đoạn mã này xuất hiện ở rất nhiều nơi?

Bạn nên nhớ rằng, Nodejs được như hôm nay là do được xây dựng trên các module hàng trăm ngàn khác nhau. Nodejs sẽ không là gì cả nếu không có các mô-đun. Nên việc bạn module mã nguồn của mình là đi đúng hướng với tâm lý của Nodejs đấy

Ví dụ cách viết một mô-đun. You create a module name is Test

//node_modules/test/index.js
module.exports = {
  hello: function(name) {
    console.log("Hello, " + name);
  },
  bye: function(name) {
    console.log("Goodbye, " + name);
  }
};

Sau đó gọi vào ứng dụng như sau

var greeter = require('test');

greeter.hello("Monkey");
greeter.bye("Steven");

2. Nên đặt tên gọi lại trong javascript

Bạn hay bắt gặp cách viết callback is anonymous function. Tức là các chức năng không có tên

Ví dụ đoạn mã sử dụng gọi lại là chức năng ẩn danh. Và có đến 2 callback lồng nhau

var fs = require('fs');

var myFile = '/tmp/test';  
fs.readFile(myFile, 'utf8', function(err, txt) {  
    if (err) return console.log(err);

    txt = txt + '\nAppended something!';
    fs.writeFile(myFile, txt, function(err) {
        if(err) return console.log(err);
        console.log('Appended text!');
    });
});

Nhìn vào đoạn mã này sẽ khiến bạn mất vài giây để xem gọi lại thực hiện điều gì và được gọi từ đâu

Để giải quyết vấn đề này, bạn chỉ cần thêm một thao tác nhỏ là đặt tên cho lệnh gọi lại. Nó sẽ giúp bạn dễ đọc code hơn, đặc biệt khi các callback lồng nhau nhiều hơn

var fs = require('fs');

var myFile = '/tmp/test';  
fs.readFile(myFile, 'utf8', function appendText(err, txt) {  
    if (err) return console.log(err);

    txt = txt + '\nAppended something!';
    fs.writeFile(myFile, txt, function notifyUser(err) {
        if(err) return console.log(err);
        console.log('Appended text!');
    });
});

Lúc này, bạn chỉ cần lướt qua là biết callback đầu tiên thực hiện việc nối các văn bản lại với nhau. Còn gọi lại thứ 2 là để thông báo cho người dùng. Việc làm này giúp bạn tránh bị gọi lại địa ngục trong javascript một cách dễ dàng đúng không?

>> Có ích cho bạn. Tự xây dựng ứng dụng web với ExpressJS

3. Định nghĩa hàm trước khi gọi để tránh địa ngục gọi lại trong javascript

Tiếp tục với ví dụ ở trên, việc bạn đặt tên đã giúp mã dễ đọc hơn rất nhiều. Nhưng nó vẫn còn khá trống rỗng

Bạn thực hiện thêm một bước nữa, đó là tách riêng và định nghĩa các cuộc gọi lại riêng lẻ. Please split function when could

var fs = require('fs');

function notifyUser(err) {  
    if(err) return console.log(err);
    console.log('Appended text!');
};

function appendText(err, txt) {  
    if (err) return console.log(err);

    txt = txt + '\nAppended something!';
    fs.writeFile(myFile, txt, notifyUser);
}

var myFile = '/tmp/test';  
fs.readFile(myFile, 'utf8', appendText);  

Bạn thế mã trên đẹp trai hơn chưa?

Mặc dù cách viết mã đã giải quyết được bất kỳ vấn đề nào. Nhưng nó vẫn chưa phải là giải pháp tốt nhất. Nếu bạn đọc lại mã mà không nhớ chính xác hàm đó làm gì, bạn sẽ phải truy tìm lại mã, mà thông thường thì mã của hàm đó lại trôi dạt ở đâu đó. This time is loss

Chúng ta còn có giải pháp tốt hơn, ngay bên dưới thôi

4. Use module Async. js

Đúng với tên gọi của nó, mô-đun Async. js sẽ giúp bạn xử lý các hàm bất đồng theo cách đồng bộ

Mô-đun này có rất nhiều phương pháp để bạn lựa chọn như , , … Vì vậy, bạn nên dành một chút thời gian để đọc tài liệu hướng dẫn của tác giả trước khi quyết định lựa chọn phương pháp nào

Không đồng bộ. js thực sự là một thư viện tốt, nhưng nếu sử dụng quá nhiều thì cũng không tốt. Bạn nên nhớ Nodejs là nền tảng được thiết kế để hệ thống xử lý bất đồng bộ, với ưu điểm xử lý thời gian thực. Nên nếu toàn bộ dự án sử dụng Async. js để xử lý các tác vụ theo kiểu đồng bộ tuần tự là tự động loại bỏ điểm mạnh của Nodejs

Đây là đoạn mã sử dụng Async. js cho ví dụ trên

var fs = require('fs');  
var async = require('async');

var myFile = '/tmp/test';

async.waterfall([  
    function(callback) {
        fs.readFile(myFile, 'utf8', callback);
    },
    function(txt, callback) {
        txt = txt + '\nAppended something!';
        fs.writeFile(myFile, txt, callback);
    }
], function (err, result) {
    if(err) return console.log(err);
    console.log('Appended text!');
});

Nhìn cũng khá tường minh và dễ hiểu phải không?

5. Use Promises

Mặc dù khái niệm Promies hơi khó hiểu khi mới tiếp cận. Nhưng theo mình thì đây là một khái niệm quan trọng mà bạn nên cố hiểu khi học Javascrip/Nodejs

Hứa hẹn giúp giảm số dòng mã đáng kể, nó còn giúp mã dễ đọc, dễ bảo trì hơn nhiều

Quay lại ví dụ ban đầu, nếu sử dụng Promises will like after

var Promise = require('bluebird');  
var fs = require('fs');  
Promise.promisifyAll(fs);

var myFile = '/tmp/test';  
fs.readFileAsync(myFile, 'utf8').then(function(txt) {  
    txt = txt + '\nAppended something!';
    fs.writeFile(myFile, txt);
}).then(function() {
    console.log('Appended text!');
}).catch(function(err) {
    console.log(err);
});

Nói về Hứa thì còn nhiều điều để nói lắm. Ở bài viết này mình sẽ không trình bày sâu về nó (mặc dù rất thích nói về Promises). Hẹn các bạn ở bài viết sau nhé

6. Không đồng bộ/Await Giảm khả năng xảy ra địa ngục gọi lại trong javascript

Kể từ phiên bản ES7, Javascript có một khái niệm mới là Async/Await. Khi sử dụng hàm không đồng bộ, mã của bạn sẽ trông giống như đồng bộ vì thực chất là bất đồng bộ. The new or

Đoạn mã ví dụ sau

________số 8_______

Ở đoạn code trên, hàm db.user.byId(id) sẽ trả về một Promise, và nếu hàm này được sử dụng thì kết quả sẽ trả về trong hàm

//node_modules/test/index.js
module.exports = {
  hello: function(name) {
    console.log("Hello, " + name);
  },
  bye: function(name) {
    console.log("Goodbye, " + name);
  }
};
0

Tuy nhiên, với từ khóa đang chờ, bạn sẽ nhận được kết quả trả về trực tiếp

Lưu ý. đang chờ chỉ được sử dụng với chức năng được báo cáo với từ khóa async

#Tầm kết

Như vậy, qua bài viết này bạn đã biết callback hell trong javascript là gì rồi đúng không? . Tuy nhiên, hãy hạn chế nó càng nhiều càng tốt

Chỉ cần bạn cố gắng viết mã chậm lại một chút, suy nghĩ một chút trước khi viết mã. Javascript là một ngôn ngữ “dễ dãi”, đây cũng vừa là điểm ưu và nhược điểm của Javascript

Please is the user write code information

Bạn có thể tham khảo thêm các bài viết hay ho về Nodejs khác trên VNTALKING

  • Series học lập trình Nodejs cơ bản
  • Xây dựng RESTful API bằng Nodejs

Mình xin kết thúc bài viết tại đây, nếu bạn có khúc mắc thắc mắc gì thì đừng ngại mà để lại bình luận bên dưới nhé

Phạm vi gọi lại javascript

​Đăng ký nhận ​ngày ​kiếm tiền từ ứng dụng di động

​Bạn đã bao giờ tự hỏi Hà Đông kiếm tiền Tỷ từ ​Flappy Bird như nào chưa?

Hiển thị cuốn sách đang bán rất chạy trên Amazon với giá 9. 99$. Bạn có muốn nhận cuốn sách này để học không?

TẢI XUỐNG

Phạm vi gọi lại javascript

  • THẺ
  • địa ngục gọi lại trong javascript
  • jav
  • tự học lập trình web

Facebook

Twitter

liên kết

Pinterest

WhatsApp

Bài trước Sử dụng Data Binding trong Android effect

Bài tiếp theo Tạo Thông báo đẩy với Firebase trong ứng dụng Android

sơn dương

Tên đầy đủ là Dương Anh Sơn. Tốt nghiệp ĐH Bách Khoa Hà Nội. Mình bắt đầu nghiệp coder khi mà ra trường đúng là xin được làm đúng chuyên ngành. Mình tin rằng chỉ có chia sẻ kiến ​​thức mới là cách học tập nhanh nhất. Các bạn góp ý bài viết của mình bằng cách comment bên dưới nhé