Function trong js?

Để hiểu rõ được vấn đề ở trên, em nên nắm được các khái niệm như sau:

• Trong javascript có một khái niệm gọi là first class function, tức một function có thể được gán vào một biến, có thể được truyền vào một function khác, hay được trả về bởi một function khác. Em có thể xem thêm bài viết này https://viblo.asia/p/first-class-functions-trong-javascript-la-gi-phan-1-E375zXpWZGW
• Trong javascript còn có 2 khái niệm khác là function declaration và function expression. Em có thể đọc thêm các bài viết sau để phân biệt 2 khái niệm này:
  • https://viblo.asia/p/hieu-ro-hon-ve-function-declaration-va-function-expression-eW65G7195DO
  • https://viblo.asia/p/tan-man-ve-function-declaration-va-function-expression-YmjeoLxnkqa
  • https://viblo.asia/p/phan-biet-function-declaration-va-function-expression-Az45bGnoKxY
• Trong javascript còn có thêm 1 khái niệm khác gọi là callback function. Hiểu đơn giản một hàm A được coi như một đối số truyền vào trong một hàm B, và một lúc nào đó thì code trong hàm B được chạy, và nó sẽ gọi đến hàm A (tức code của hàm A không phải là được thực thi ngay lập tức, mà chỉ được thực thi từ hàm B ở một thời điểm phù hợp, nên ta gọi hàm A là callback). Em có thể tham khảo thêm một số bài viết sau:
  • https://viblo.asia/p/the-nao-la-mot-callback-function-trong-javascript-vyDZOAqd5wj
  • https://viblo.asia/p/callback-trong-javascript-gDVK2RkXKLj
  • https://viblo.asia/p/callback-la-gi-callback-trong-javascript-RnB5pBVDZPG
  • https://viblo.asia/p/hieu-ve-callback-trong-javascript-pxvKokxyKLd
  • https://viblo.asia/p/callback-function-trong-javascript-bWrZn1QQKxw

Ở trong 2 ví dụ của em thì ví dụ thứ 2:

$(".customNextBtn").click(){
      owl.trigger("next.owl.carousel");
};

là một đoạn code sai cú pháp, sẽ không thể chạy được. $(".customNextBtn").click() là một lời gọi hàm (Function Invocation), tuy nhiên sau đó lại xuất hiện cú pháp {} không xác định.

còn ví dụ thứ nhất

$(".customNextBtn").click(function () {
      owl.trigger("next.owl.carousel");
    });

thì ta có thể giải thích bằng những khái niệm ở phía trên như sau:

• $(".customNextBtn").click() dùng để define event click vào một element
• Ta truyền một tham số vào hàm đó. Tham số này hơi đặc biệt ở chỗ nó không phải là một số tự nhiên, một chuỗi, hay một mảng thông thường, mà nó là một hàm số
• Tham số truyền vào này là một function expression
• Tham số truyền vào này là một callback function, nó sẽ được gọi để chạy, khi mà button được click

1: hình như function thứ 2 bạn viết hơi sai

$(".customNextBtn").click(() => {
      owl.trigger("next.owl.carousel");
})

viết như thế này chỉ để cho code ngắn thôi chứ trong trường hợp này thì sài kiểu nào cũng đc nhé

2: Có 3 loại function trong javascript:

• 1. Declaration function:

function hello(name) {
   console.log('Hello:', name)
}

• 2. Expression function

const hello2 = function(name) {
   console.log('Hello:', name)
}

• 3. Arrow function

const hello3 = (name)  => {
   console.log('Hello:', name)
}

Bạn có thểm xem thêm video của kênh F8 Official nhé

cái đấy người ta gọi là callback, tức pass function as param

cái .click() là 1 lời gọi hàm chứ ko phải khai báo hàm