Tại sao lời gọi hàm (function invocation) trong javascript nhưng không truyền tham số và không có cặp ngoặc ()

Chào ạ,

  <button onClick={handle}> </button>

const handle = e => {
 console.log(e)
};

Cho em hỏi trường hợp này gọi là gì. Em không biết search google kiểu gì luôn á. Tại sao onClick gọi đến hàm handle mà không truyền tham số e vào mà vẫn in ra console.log được event. Trong các ngôn ngữ khác đáng lẽ cú pháp phải là handle(e); khi cần chạy hàm handle? Đây là cú pháp viết tắt hay mặc định event được sinh ra từ DOM nó tự động truyền vào hàm theo cách viết trên?

Em cảm ơn!

1 Like

Đúng vậy, event luôn được truyền vào các handle đang listen nó. Lưu ý event sẽ đi theo cả hai chiều: từ <html> xuống, rồi sau đó ngược lên lại (bubbling), nhưng đa số và mặc định các handle chỉ bắt sự kiện ở pha bubbling.

7 Likes

cái chỗ mà bạn truyền hàm vào ở kia có thể coi nó như là callback chứ không phải là bạn đang gọi hàm đâu. khi bạn click thì trình duyệt sẽ bắt sự kiện đó rồi gọi đến callback mà bạn đã chỉ định, đồng thời truyền vào kèm theo 1 biến chứa các thông tin của event

9 Likes

Vậy làm sao mình biết được sự kiện (event) do DOM tạo ra có bao nhiêu tham số để hàm callback đó nhận vào để thực thi? Trong trường hợp bên trên thì chỉ có 1 tham số là e. :face_with_monocle:

Trong JS không có quy định cần phải quan tâm số lượng tham số truyền vào giống như nhiều ngôn ngữ khác. Do đó nhiệm vụ của trình duyệt là gọi hàm cần gọi và pass số lượng tham số mà nó muốn, còn ở phía khai báo cần bao nhiêu tham số đó là việc khác.
VD:

// khai báo
function hello(name1, name2) {
  console.log("hello", name1, name2);
} 

// sử dụng
hello();
hello('name1');
hello('name1', 'name2');
hello('name1', 'name2', 'name3');

Như ví dụ trên, cả 4 trường hợp sử dụng đều hợp lệ bất chấp khai báo function chỉ chấp nhận 2 tham số.

Trong TH các hàm callback, bạn cần tham khảo document chuẩn của các thư viện/API để biết được bao nhiêu tham số sẽ được truyền vào hàm ở phía sử dụng từ đó khai báo cho đúng.

9 Likes

Có phải đây chính là một trong những nhược điểm của javascript nên typescript mới ra đời để khắc phục tình trạng này không vậy bác, trong typescript hàm viết bao nhiêu tham số thì lúc gọi chỉ được truyền bấy nhiêu đối số thôi?

Js nó ảo diệu lắm.

0 == “0” còn return true nữa là

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