Để gọi một hàm bên trong một hàm khác, hãy xác định hàm bên trong bên trong hàm bên ngoài và gọi nó
Khi sử dụng từ khóa function, hàm sẽ được nâng lên đầu phạm vi và có thể được gọi từ bất kỳ đâu bên trong hàm bên ngoài
Ví dụ sau đây cho thấy cách chúng ta có thể gọi hàm bên trong trước khi nó được khai báo
Điều này là do cách cẩu hoạt động trong JavaScript
Điều này chỉ hoạt động đối với các hàm được khai báo bằng từ khóa function (không dành cho các hàm mũi tên)
Bạn có thể tưởng tượng rằng phần khai báo của hàm được nâng lên đầu phạm vi, vì vậy nó có thể được gọi từ bất kỳ đâu trong phạm vi
Trả về chức năng bên trong từ chức năng bên ngoài
Một cách tiếp cận khác là trả về hàm bên trong từ hàm bên ngoài
Lưu ý rằng chúng ta không sử dụng dấu ngoặc đơn () để gọi hàm bên trong bên trong hàm bên ngoài
Chúng tôi đã trả lại chức năng mà không cần gọi nó. Nói cách khác, chúng ta đã trả về một tham chiếu đến hàm bên trong, không phải kết quả của việc gọi nó.
Điều này cho phép chúng ta gọi hàm bên trong nhiều lần nếu cần, truyền cho nó các đối số khác nhau mỗi lần
Hàm bên trong ghi nhớ các biến được khai báo trong hàm bên ngoài
Điều hữu ích nhất trong trường hợp này là hàm bên trong ghi nhớ các biến được khai báo trong hàm bên ngoài giữa các lần gọi
Lưu ý rằng hàm bên trong ghi nhớ giá trị của biến z giữa các lần gọi
Khái niệm này được gọi là bao đóng trong JavaScript
Hàm bên trong được đóng gói với các tham chiếu đến trạng thái xung quanh của nó
Điều này có nghĩa là hàm bên trong có quyền truy cập vào các biến được khai báo bên trong phạm vi của hàm bên ngoài bất cứ lúc nào
Điều này hữu ích trong nhiều tình huống khác nhau. Ví dụ: bạn có thể truyền một tham số cho hàm bên ngoài mà nó sẽ ghi nhớ cho bất kỳ lệnh gọi hàm bên trong nào
Chúng tôi đã chuyển 10 làm tham số cho hàm bên ngoài và lưu trữ kết quả trong một biến
Biến innerFunc lưu trữ một tham chiếu đến hàm innerFunc trong đó biến a trỏ đến giá trị của 10
Bạn có thể gọi một hàm bên trong một đối tượng bằng cách khai báo hàm đó như một thuộc tính trên đối tượng và gọi nó, e. g. obj.sum(2, 2)
Thuộc tính của một đối tượng có thể trỏ đến một hàm, giống như nó có thể trỏ đến một chuỗi, số hoặc các giá trị khác
Chúng tôi đã tuyên bố một thuộc tính sum trên một đối tượng. Thuộc tính trỏ đến một chức năng
Chúng ta có thể truy cập thuộc tính của đối tượng bằng cách sử dụng ký hiệu dấu chấm . hoặc dấu ngoặc [] để gọi hàm
Chúng tôi đã sử dụng thuộc tính tốc ký để xác định chức năng trong đối tượng
Khi đọc mã cũ hơn, bạn có thể thấy cách tiếp cận dài dòng và lỗi thời hơn sau đây
Cách tiếp cận đầu tiên ngắn gọn hơn và dễ đọc hơn
Sử dụng từ khóa this để truy cập các thuộc tính của đối tượng
Bạn có thể sử dụng từ khóa this để truy cập các thuộc tính của đối tượng bên trong hàm
Trong ngữ cảnh cụ thể này, từ khóa this đề cập đến đối tượng
Bạn cũng có thể thêm một chức năng vào đối tượng sau khi nó đã được khai báo
Lưu ý rằng chúng tôi đã sử dụng từ khóa function để xác định chức năng
Nếu chúng ta sử dụng hàm mũi tên, thì giá trị của từ khóa this sẽ không bị ràng buộc chính xác và sẽ trỏ đến phạm vi kèm theo (không phải đối tượng)
Ở đây nhiệm vụ là tạo các hàm lồng nhau, JavaScript hỗ trợ các hàm lồng nhau. Trong các ví dụ được đưa ra bên dưới, kết quả trả về là sự kết hợp của đầu ra từ hàm bên ngoài cũng như hàm bên trong (hàm lồng nhau).
Tiếp cận
- Viết một hàm bên trong một hàm khác
- Thực hiện cuộc gọi đến hàm bên trong trong câu lệnh trả về của hàm bên ngoài
- Gọi nó là fun(a)(b) trong đó a là tham số của hàm bên ngoài và b là hàm bên trong
- Cuối cùng, trả về đầu ra kết hợp từ hàm lồng nhau
ví dụ 1. Ví dụ này sử dụng cách tiếp cận được thảo luận ở trên.
html
<body id="body" style="text-align:center;">
<body1 style=body4>
body6body7
body9body1>
<id4 id=id7 id8
id9=0
body9id4>
<=7 =8="body"0>
body6"body"3
body9=7>
<id4 id=style3 style4
style5style6
style5style8
body9id4>
<=5>
body6=8
body6"text-align:center;"0
body6"text-align:center;"2
body6"text-align:center;"4
body6"text-align:center;"6
body6"text-align:center;"8
"text-align:center;"9>0
body6>2
body6>4
body6>2
body6>8
"text-align:center;"9 0
1 2
1____27_______4
body6>2
body9=5>
body9body>
đầu ra
ví dụ 2. Ví dụ này sử dụng cách tiếp cận đã thảo luận ở trên, nhưng ở đây, hàm lồng nhau được tạo khác với hàm trước đó.
html
<body id="body" style="text-align:center;">
<body1 style=body4>
body6body7
body9body1>
<id4 id=id7 id8
id9=0
body9id4>
<=7 =8="body"0>
body6"body"3
body9=7>
<id4 id=style3 body58
body59body60
body59style8
body9id4>
<=5>
body6=8
body6"text-align:center;"0
body6"text-align:center;"2
"text-align:center;"9"text-align:center;"4
body6"text-align:center;"6
body6body82
"text-align:center;"9>0
body6>2
body6body88
body6>2
body6>8
"text-align:center;"9body94
body6>2
body9=5>
body9body>
đầu ra
JavaScript được biết đến nhiều nhất để phát triển trang web nhưng nó cũng được sử dụng trong nhiều môi trường không có trình duyệt. Bạn có thể học JavaScript từ đầu bằng cách làm theo Hướng dẫn JavaScript và Ví dụ về JavaScript này