Làm cách nào để function này chạy xong thì mới thực thi function tiếp theo?

#1

Như tiêu đề bài viết
ví dụ em có 2 function như sau:

function ajax() {
    $.ajax({
        type: "GET",
        dataType: 'jsonp',
        url: url,
        success: function(data) {}
    })
}

function get() {
    // content
}

làm thế nào để khi ajax() chạy xong thì mới tới get() ạ? không settime vì e nghĩ nhiều lúc ajax nó sẽ load lâu hơn 1 tý.

#2

Dùng async await thôi bạn hoặc là dùng Promise cũng được. Lưu ý là jquery chỉ hỗ trợ Promise và async await từ bản 1.6 trở lên. Lưu ý khi dùng async await thì bạn phải sửa function ajax() thành async function ajax() và hàm ajax bên dưới thêm await ở đầu rồi code bên dưới gọi hàm bằng await ajax(), mà không biết là trình duyệt hiện tại hỗ trợ top-level await chưa?

5 Likes
#3

Hình như chỉnh async trong ajax thành false thì nó sẽ chạy xong ajax mới chạy cái khác đấy

3 Likes
#4

Biết chỗ này nó làm gì không?

4 Likes
#5

kết quả trả về khi yêu cầu chạy thành công a

1 Like
#6

vâng. để em làm thử ạ

1 Like
#7

Dùng await thôi bạn? Ngoài ra ajax mà không có async thì không hợp lí lắm

1 Like
#8

của em để async: true nó mới chạy đúng a ạ

1 Like
#11 
function ajax() {
  $.ajax({
    ...
    success: get
  })
}

function get(data) {
  // content
}
4 Likes
#14

Xài cách đó cũng được, mỗi tội sợ gặp callback hell nếu truyền anonymous function vào thôi.
Ngoài ra có thể dùng promise như sau:

function ajax() {
    return $.ajax({
        type: "GET",
        dataType: 'jsonp',
        url: url
    })
}

function get() {
    // content
}
ajax().done((res) => get())

Dùng async await:

function ajax() {
    return $.ajax({
        type: "GET",
        dataType: 'jsonp',
        url: url
    })
}

function get() {
    // content
}
(async () => {
    try{
        let res = await ajax()
        get()
    }
    catch(err){
          console.log(err)
     }
})()

Tại mình đang dùng điện thoại để bình luận chưa quen nên xoá hơi nhiều.

4 Likes
#15

nó báo lỗi Uncaught (in promise) a

1 Like
#16

Ghi đầy đủ lỗi ra đi em, để thế biết lỗi gì?

2 Likes
#17

e chỉ copy đoạn của a bỏ vào thì nó báo như v

image
image751×427 18.4 KB

1 Like
#18

À anh quên mất, em thêm try catch vào chỗ hàm async để bắt lỗi. Tại đang viết code bằng đt nên chưa test code

2 Likes
#19

Ngoài ra await ajax() sẽ trả về response của request em gửi lên. Ví dụ:

(async () => {
    let res = await ajax()
    console.log(res)
})
3 Likes
#20

chính xác là code e nó như này. thì e phải return lại nội dung bên trong function hay sao a?

image
image765×455 18.6 KB

1 Like
#21 
function ajax() {
    $.ajax({
        type: "GET",
        dataType: 'jsonp',
        url: url,
        complete: function(data) {
                get(data);
        }
        // Hoặc
        complete: get
    })
}

function get(data) {
    // content
}
#22

Học lập trình bất đồng bộ trong javascript đi em, vì em không biết về lập trình bất đồng bộ nên anh khó lòng giải thích được :grinning: Sau khi học xong thì đọc đoạn này, chưa học không hiểu được đâu :rofl::
Khi dùng ajax trong javascript thì nó sẽ resovle giá trị trả về từ server nếu thành công hoặc reject nếu có lỗi, áp dụng cho cả hàm ajax của jquery hay fetch có sẵn trong javascript.
Còn nếu em lười quá thì cứ dùng đại success: get, mặc dù dùng cái này thì không có bắt kịp công nghệ mới(à mà cái này ra từ hồi 2015 rồi) + có thể gặp callback hell nếu truyền vào một anoymous function

1 Like
#23

Gọi get trong success hoặc error của ajax.
Mình gà chỉ nghĩ được có vậy ::))

3 Likes
#24

ko biết m.n có hiểu sai ý của e ko chứ. hàm get() là 1 hàm riêng biệt mà? chứ đâu phải e muốn lấy data của thằng ajax đâu?

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?