Tìm hiểu arrow function trong JavaScript

Học Javascript : tìm hiểu Arrow Function trong JavaScript4 phút đọc

Arrow Function là một trong những tính năng mới của ES6. Việc sử dụng đúng cách Arrow Function giúp code trở nên ngắn gọn và dễ hiểu hơn.

Trong bài viết này mình sẽ giúp bạn hiểu rõ cách sử dụng cơ bản của Arrow Function trong JavaScript.Hãy cùng mình tìm hiểu ngay bây giờ nhé.

Cú pháp

Cú phápÝ nghĩa
(tham_số) => {nội_dung_xử_lý}Định nghĩa hàm số

Ví dụ sử dụng

Trong bài viết trước để khai báo một hàm số (function) thì bạn sẽ khai báo giống như dưới đây.Hàm số này đầy đủ các thành phần cơ bản như tên hàm số, tham số truyền vào, xử lý và giá trị trả về.

JavaScript

Bạn có thể sử dụng Arrow Function để khai báo một hàm số.Hàm số khai báo bằng Arrow Function trông sẽ gọn hơn hàm số thông thường.Dưới đây là hàm số trong ví dụ trên nhưng được khai báo bằng cách sử dụng Arrow Function.

Bạn hãy bỏ đi từ khóa function và thêm vào dấu = ở giữa tên hàm số và tham số truyền vào.Giữa phần tham số truyền vào với phần ngoặc nhọn chứa code xử lý phải là dấu =>(kết hợp hai dấu = và >).Tất cả phần còn lại hoàn toàn tương tự như một hàm số thông thường.

JavaScript

Để gọi và thực hành hàm số được khai báo bằng Arrow Function bạn cũng gọi như hàm số thông thường.Bạn hãy thực hành cả hai ví dụ trên đây xem chúng có trả về cùng một kết quả không nhé.

Ngoài ra cũng có một cách khai báo hàm số khác, đó là sử dụng từ khóa khai báo biến ở trước tên hàm số như ở một số ví dụ dưới đây.

JavaScript

Trên đây là ví dụ với kiểu viết hàm số giữ nguyên từ khóa khai báo hàm số function.

JavaScript

Còn đây là ví dụ khi sử dụng Arrow Function.

Mình đã đưa ra khá nhiều ví dụ về các cách viết hàm số khác nhau và sử dụng cách nào sẽ tùy theo từng team.Bạn nên ghi nhớ tất cả các cách viết này để tiện tham khảo tài liệu trên mạng cũng như sau khi đi làm.

Với hàm số Arrow Function trong trường hợp tham số truyền vào chỉ có một giá trị duy nhất thì bạn có thể lược bỏ dấu ().Tuy nhiên khi không có tham số truyền vào và tham số truyền vào từ hai trở lên thì phải có dấu () khi khai báo hàm số.

JavaScript

JavaScript

JavaScript

Thêm vào đó nếu như phần xử lý trong hàm số chỉ có một dòng duy nhất để trả về kết quả thì bạn có thể lược bỏ luôn cả dấu ngoặc nhọn {}return.Dưới đây là ví dụ.

JavaScript

Kết luận

Arrow Function là kiến thức mới xuất hiện khi ES6 ra đời nhưng nó đã nhanh chóng phổ biến và xuất hiện trong hầu hết các chương trình hiện nay.Khi kết hợp Arrow Function với những kiến thức khác trong các bài viết tới bạn sẽ nhanh chóng thành thạo ngôn ngữ JavaScript.

Bài viết trước

 

 

 

 

Nếu bạn thấy bài viết này hay và có ích thì bạn có thể ủng hộ blog của mình bằng một trong số những cách sau để mình có thêm động lực xuất bản nhiều bài viết mới chất lượng hơn nữa.

  • Chia sẻ bài viết này lên mạng xã hội qua các nút bên dưới đây.
  • Thả tim ở ngay cuối cùng bài viết này.
  • Đăng kí nhận thông báo bài viết mới bằng cách nhấn vào chuông đỏ góc dưới cùng bên trái.
  • Đánh giá chất lượng bài viết bằng sao ở trên cùng bài viết này.

Tìm kiếm bài viết trên blog với Google Search :

Bài viết có thể bạn sẽ thích

guest
0 Comments
Inline Feedbacks
View all comments
0
Hãy cùng thảo luận về bài viếtx
()
x