Một trong những nhiệm vụ cơ bản với JavaScript là cách viết và gọi các hàm trong mã của bạn. Đây có vẻ là một việc đơn giản và về cơ bản là như vậy, tuy nhiên, có một số mẹo và thủ thuật bạn có thể sử dụng để giúp việc sử dụng Hàm JavaScript của bạn dễ dàng và trực quan hơn. Bài viết này hướng dẫn bạn những kiến thức cơ bản về cách gọi các hàm trong mã của bạn, cũng như một số mẹo và thủ thuật nâng cao hơn để viết các hàm JavaScript tốt hơn có thể giúp đưa mã JavaScript của bạn lên một tầm cao mới
Cách gọi một hàm trong JavaScript
Gọi một hàm [còn gọi là phương thức] trong JavaScript tương tự như bất kỳ ngôn ngữ lập trình nào khác sử dụng cú pháp giống như C. Chỉ cần gọi hàm theo tên, sau đó chuyển vào bất kỳ tham số bắt buộc nào trong danh sách được phân tách bằng dấu phẩy được đặt trong dấu ngoặc đơn
Để đưa điều này vào một ví dụ tuyệt vời có thể dễ dàng hình dung, hãy lấy hàm
sayHello["Chris"];
sayHello["Chris"];
function sayHello[name] {
// implementation code here
}
Để gọi hàm này, bạn chỉ cần gọi trực tiếp bằng tên, sau đó truyền vào giá trị tham số
sayHello["Chris"];
Bây giờ, nếu bạn có một hàm cần gọi mà không có bất kỳ tham số nào, bạn có thể gọi nó tương tự. Một hàm không có bất kỳ tham số nào có thể được gọi bằng cách bỏ qua bất kỳ tham số nào và gọi nó theo cách tương tự
sayHello[];
Nếu hàm chấp nhận nhiều tham số, thì bạn có thể gọi nó tương tự với tất cả các giá trị tham số dưới dạng danh sách được phân cách bằng dấu phẩy
sayHello["Chris", "Pietschmann", 42];
Ví dụ trước này chấp nhận ba tham số. Hai tham số đầu tiên là các giá trị chuỗi, trong khi tham số thứ ba chấp nhận một số
Gọi hàm JavaScript có giá trị trả về
Mặc dù các tham số được sử dụng để chuyển một hoặc nhiều giá trị vào hàm JavaScript, nhưng bạn cũng có thể sử dụng giá trị trả về để chuyển một giá trị ra khỏi hàm. Hàm có thể sử dụng câu lệnh
sayHello["Chris"];
Đây là một ví dụ về hàm JavaScript có giá trị trả về
function multiply[a, b] {
// simple example that multiplies two numbers
var c = a * b;
return c;
}
Hàm này có thể được gọi bằng cách sử dụng cùng một phương thức như bất kỳ hàm nào khác. Chỉ cần gọi nó theo cùng một cách, bạn sẽ chỉ cần bỏ qua giá trị trả về và tiếp tục
________số 8
Nếu bạn cần nắm bắt giá trị trả về từ hàm, thì bạn có thể gán kết quả đó cho một biến. Khi đó biến sẽ chứa giá trị trả về từ hàm sau khi thực hiện
var c = multiply[6, 7];
Khi giá trị trả về đã được ghi vào một biến, thì biến đó có thể được sử dụng như bất kỳ biến nào khác. Bạn có thể sử dụng trực tiếp giá trị của nó trong mã này cho một thứ gì đó hoặc thậm chí chuyển nó dưới dạng tham số cho một chức năng khác
Nếu giá trị trả về của hàm sẽ chỉ được sử dụng làm tham số đầu vào của hàm khác, bạn có thể chuyển trực tiếp giá trị trả về cho tham số hàm. Điều này được thực hiện bằng cách đặt lời gọi hàm trong danh sách tham số của lời gọi hàm khác, giống như bạn làm với một biến
Dưới đây là một ví dụ về việc truyền một biến dưới dạng tham số cho lệnh gọi hàm và một ví dụ khác truyền trực tiếp giá trị trả về của một hàm cho các tham số của một hàm khác
sayHello["Chris"];
Truyền hàm dưới dạng tham số
JavaScript là một ngôn ngữ lập trình chức năng. Điều này có nghĩa là các hàm cũng là các biến. Do đó, bạn cũng có thể chuyển các hàm xung quanh dưới dạng tham số cho các hàm khác. Điều này mang lại một số lợi ích linh hoạt tuyệt vời cho việc sử dụng lại mã, đệ quy và các lợi ích lập trình chức năng khác
Đây là một ví dụ về việc truyền một hàm dưới dạng tham số cho một hàm khác dựa trên các ví dụ về hàm
sayHello["Chris"];
sayHello["Chris"];
Phương thức đối tượng JavaScript
Hướng đối tượng nhiều hơn một chút [toàn bộ JavaScript OOP sẽ được thảo luận cho một bài viết khác], bạn có thể có một đối tượng JavaScript với các thuộc tính và phương thức riêng của nó. Các phương thức này cũng là các hàm. Cư trú trên đối tượng và khi được gọi trực tiếp có quyền truy cập vào đối tượng bằng từ khóa
sayHello["Chris"];
sayHello["Chris"];
Đây là một ví dụ về việc xác định một đối tượng JavaScript có một số thuộc tính và phương thức
sayHello["Chris"];
Gọi các hàm JavaScript bằng phương thức sayHello[];
1
sayHello[];
Nếu bạn có một đối tượng JavaScript có các thuộc tính và phương thức riêng, bạn cũng có thể gọi các phương thức đó bằng cách sử dụng phương thức
sayHello[];
sayHello[];
sayHello["Chris"];
sayHello["Chris"];
Đây là một ví dụ về việc sử dụng phương thức
sayHello[];
sayHello[];
sayHello[];
sayHello["Chris"];
Đây là một ví dụ về việc xác định một chức năng mới không tồn tại như một phương thức của đối tượng, sau đó gọi nó với ngữ cảnh của từ khóa
sayHello["Chris"];
sayHello["Chris"];
Phương thức
sayHello[];
sayHello["Chris"];
sayHello[];
Đây là một ví dụ khác chấp nhận một giá trị tham số
sayHello["Chris"];
Chức năng như giá trị trả về của chức năng
Điều này thoạt nghe có vẻ khó hiểu. Một hàm JavaScript có thể được truyền dưới dạng giá trị trả về từ một hàm khác. Điều này có thể dẫn đến một số tình huống nâng cao hơn và rất hữu ích khi biết là có thể. Đặc biệt nếu bạn đang sử dụng một thư viện JavaScript hoặc gói NPM có các phương thức/hàm trả về các hàm do đó sẽ được sử dụng sau này
Đây là một ví dụ về định nghĩa hàm trả về một hàm dưới dạng giá trị trả về từ chính hàm đó
sayHello["Chris"];
Bây giờ gọi hàm này sẽ trả về một hàm, không phải bất kỳ loại giá trị nào khác. Ví dụ trước không trả về
sayHello["Chris", "Pietschmann", 42];
Bây giờ, hãy gọi hàm được trả về từ hàm khác để nhận kết quả cuối cùng được trả về
sayHello["Chris"];
Sự kết luận
Việc gọi các hàm JavaScript ban đầu rất đơn giản, nhưng bạn có thể thấy có một số kỹ thuật lập trình hàm có thể được sử dụng. Khi bạn hiểu rõ hơn rằng Hàm JavaScript là một đối tượng, tương tự như chuỗi và số, thì bạn có kiến thức để viết mã JavaScript tốt hơn
Rõ ràng những kỹ thuật này sẽ hữu ích nếu bạn đang viết một thư viện JavaScript, khung hoặc gói NPM mới. Tuy nhiên, biết những kỹ thuật này cũng sẽ giúp bạn sử dụng tốt hơn các thư viện, khung và gói NPM khác trong mã của riêng bạn