Hàm là một khối câu lệnh mô-đun, có thể tái sử dụng dùng để thực hiện một tập hợp gồm các câu lệnh các công việc liên quan, chẳng hạn như tính toán và trả về một giá trị dựa trên đối số được cung cấp cho hàm. Giống như tất cả giá trị không gốc, hàm là đối tượng. Chúng là những đối tượng độc đáo mà có thể được gọi là để thực thi mã, hãy truyền dữ liệu ở dạng đối số, và trả về một giá trị.
Hàm được coi là "lớp đầu tiên" của đối tượng, nghĩa là mặc dù hành vi độc đáo của chúng, chúng vẫn có thể được sử dụng trong tất cả ngữ cảnh giống như bất kỳ đối tượng JavaScript nào khác. Ví dụ: một hàm có thể là gán cho một biến, được truyền dưới dạng đối số cho các hàm khác và trả về bằng các hàm khác.
function myFunction() {
console.log( "This is my function." );
};
Một hàm được xác định là thuộc tính của đối tượng được xác định là
thường được gọi là "phương thức". Tương tự như các biến được khai báo bằng var
`,
các khai báo hàm được thực hiện bên ngoài hàm bao quanh sẽ được thêm vào
đối tượng toàn cục làm phương thức.
Khai báo hàm
Khai báo hàm (còn được gọi là "câu lệnh hàm" hoặc "định nghĩa hàm")
tạo một hàm được đặt tên có thể được gọi ở nơi khác trong phạm vi chứa hàm đó.
Nội dung khai báo hàm bao gồm từ khoá function
, theo sau là một
mã nhận dạng, danh sách các tham số được phân tách bằng dấu phẩy được đặt trong ngoặc đơn và
câu lệnh khối đã gọi là
"cơ thể chức năng". Bạn sẽ thường xuyên gặp phải các khai báo hàm không
kết thúc bằng dấu chấm phẩy; vì phần khai báo hàm là một câu lệnh, theo sau
dấu chấm phẩy có thể được suy ra bởi ASI.
function myFunction() {
console.log( "This is my function." );
};
myFunction();
> "This is my function."
Để giữ lại các quyết định thiết kế ban đầu của JavaScript, việc khai báo hàm
vẫn phải tuân theo cùng một quy trình chuyển lên trên
dưới dạng các biến được khai báo bằng var
, nghĩa là việc khai báo hàm
được chuyển lên đầu phạm vi và có thể được gọi trước khi khai báo dưới dạng một
cho dù phạm vi đó có chịu sự điều chỉnh của chế độ nghiêm ngặt hay không:
"use strict";
{
myFunction();
function myFunction() {
console.log( "This is my function." );
};
}
> "This is my function."
Bên ngoài chế độ nghiêm ngặt, chức năng nội dung khai báo sử dụng phạm vi cũ của JavaScript hành vi, tức là nội dung khai báo hàm nằm trong phạm vi của thành phần bao quanh gần nhất hàm:
function myFunction() {
function myNestedFunction() {
console.log( "This is my nested function." );
}
myNestedFunction();
};
myFunction();
> "This is my nested function."
myNestedFunction();
>Uncaught ReferenceError: myNestedFunction is not defined
Ở chế độ nghiêm ngặt, việc khai báo hàm
đều nằm trong phạm vi của khối bao quanh gần nhất, như với các biến được khai báo bằng
let
hoặc const
:
"use strict";
{
function myFunction() {
console.log( "This is my function." );
};
}
myFunction();
> Uncaught ReferenceError: myFunction is not defined
Gọi hàm
Tương tự như với biến, giá trị nhận dạng dùng khi khai báo hàm hoạt động như một tên tượng trưng của một giá trị. Việc tham chiếu đến một hàm chỉ bằng giá trị nhận dạng sẽ trả về kết quả trả về chỉ đối tượng hàm và không thực thi hàm chứa:
function myFunction() {
console.log( "This is my function." );
};
myFunction;
> myFunction() {
console.log( "This is my function." );
}
Để thực thi mã bên trong phần nội dung hàm, hãy gọi (hoặc gọi) hàm đó bằng cách theo sau tên hàm có một cặp dấu ngoặc đơn khớp:
function myFunction() {
console.log( "My function has been executed." );
}
myFunction();
> "My function has been executed."
Các tham số trong định nghĩa hàm đóng vai trò là biến phần giữ chỗ cho các giá trị có thể được truyền vào phần nội dung hàm khi hàm được gọi. Các giá trị trong dấu ngoặc đơn khi một hàm được gọi là "đối số" (mặc dù bạn có thể thấy "đối số" được sử dụng để mô tả cả đối số và tham số trong một số tài liệu):
function myFunction( myParameter ) {
console.log( `The value is: ${ myParameter }.` );
};
myFunction( "this string" );
> "The value is: this string."
Nếu một đối số dự kiến bị bỏ qua, tham số thu được sẽ chứa một
undefined
, vì tham số này được khai báo trong phần nội dung hàm nhưng
không được khởi tạo bằng một giá trị:
function myFunction( myParameter ) {
console.log( `The value is: ${ myParameter }.` );
};
myFunction();
> "The value is: undefined."
Bạn có thể đặt giá trị thông số mặc định bằng cách khởi tạo các giá trị đó giống như cách bạn làm
khởi tạo một biến: một toán tử gán (=
) theo sau là một giá trị. Nếu bạn
sau đó chỉ định đối số cho hàm đó, giá trị mới đó sẽ ghi đè đối số
giá trị mặc định:
function myFunction( myParameter = "omitted" ) {
console.log( `The value is: ${ myParameter }.` );
};
myFunction( "this string" );
> "The value is: this string."
myFunction();
> "The value is: omitted."
Thân của không phải mũi tên
cũng có quyền truy cập vào mã có chỉ mục 0,
đối tượng arguments
giống mảng
chứa bất kỳ giá trị nào được truyền dưới dạng đối số, cho dù hàm
định nghĩa chỉ định các tham số:
function myFunction() {
console.log( arguments );
};
myFunction( 3, true, "My string" );
> Arguments { 0: 3, 1: true, 2: "My string", … }
Hàm Variadic
Đối tượng arguments
cho phép bạn tạo các hàm biến thiên cơ bản mà có thể
chấp nhận số lượng đối số có thể thay đổi:
function myFunction() {
let result = "";
for (let i = 0; i < arguments.length; i++) {
result += arguments[i] + " - ";
}
console.log( result );
};
myFunction( "My first string", "My second string", "my third string" );\
> "My first string - My second string - my third string - "
Tuy nhiên, phương pháp này đối với các hàm biến đổi hiếm khi được sử dụng trong JavaScript hiện đại phát triển ứng dụng. Thường thì chúng ta sẽ sử dụng kiểu mã hiện đại và dễ đọc hơn cú pháp tham số còn lại, Hàm này sẽ tạo một tham số được đặt tên được khởi tạo dưới dạng một mảng chứa bất kỳ đối số nào ngoài những nội dung được chỉ định rõ ràng:
function myFunction( mySeparator, ...myStrings ) {
console.log( myStrings.join( mySeparator ) );
};
myFunction( " - ", "My first string", "My second string", "my third string" );
> "My first string - My second string - my third string"
Không giống như liên kết parameter
, cú pháp tham số còn lại hoạt động như dự kiến với các tham số hàm mũi tên:
function myOuterFunction() {
let myInnerArrowFunction = ( ...myParams ) => {
console.log( myParams[ 0 ] );
}
myInnerArrowFunction( true );
};
myOuterFunction( false );
> true
let myArrowFunction = ( ...myParams ) => {
console.log( myParams[ 0 ] );
};
myArrowFunction( true );
> true`
``