Review: Functions

Đây là một đánh giá về những gì chúng tôi trình bày trong hướng dẫn này về các chức năng.

Chúng ta thường muốn có thể thực thi lại các khối mã khi chúng ta viết chương trình, mà không phải viết lại toàn bộ khối mã. Chúng ta cần một cách để nhóm mã lại với nhau và đặt tên cho nó, để chúng ta có thể gọi nó bằng tên đó sau đó, và đó là những gì chúng ta gọi là một hàm .

Để tạo một hàm, trước tiên chúng ta phải khai báo nó và đặt tên cho nó, giống như cách chúng ta tạo bất kỳ biến nào và sau đó chúng ta theo nó theo một định nghĩa hàm:

var sayHello = function() {
};

Chúng ta có thể đặt bất kỳ mã nào bên trong hàm đó - một câu lệnh, nhiều câu lệnh - phụ thuộc vào những gì chúng ta muốn làm. Trong chức năng này, chúng tôi chỉ có thể xuất một tin nhắn tại một vị trí ngẫu nhiên:

var sayHello = function() {
   text("Halllllllo!", random(200), random(200));
};

Bây giờ, nếu tất cả những gì chúng ta làm là khai báo hàm, sẽ không có gì xảy ra. Để chương trình thực thi mã bên trong hàm, chúng ta thực sự phải "gọi" hàm, bằng cách viết tên của nó theo dấu ngoặc đơn trống:

sayHello();

Và sau đó chúng tôi có thể gọi nó bất cứ khi nào chúng tôi muốn, bao nhiêu lần chúng tôi muốn!

sayHello();
sayHello();
sayHello();

Chúng tôi thường muốn có thể tùy chỉnh các chức năng, để nói với chương trình "tốt, làm tất cả các mã này, nhưng thay đổi một số điều về cách bạn làm điều đó." Bằng cách đó, chúng tôi có mã có thể tái sử dụng và linh hoạt, tốt nhất của cả hai thế giới. Chúng ta có thể đạt được điều đó bằng cách chỉ định "đối số" cho hàm, sử dụng các đối số đó để thay đổi cách thức hoạt động của hàm và chuyển chúng vào khi chúng ta gọi hàm.

Ví dụ, điều gì sẽ xảy ra nếu chúng ta muốn có thể nói chính xác nơi chúng ta muốn thông báo được hiển thị, giống như chúng ta có thể nói chính xác nơi chúng ta muốn vẽ orth () s và ellipse () s? Chúng ta có thể tưởng tượng việc gọi nó như vậy, để đặt tin nhắn ở hai tọa độ chính xác:

sayHello(50, 100);
sayHello(150, 200);

Để thực hiện công việc đó, chúng ta cần thay đổi sayHellođịnh nghĩa hàm để biết rằng nó sẽ nhận được 2 đối số và sau đó sử dụng chúng bên trong:

var sayHello = function(xPos, yPos) {
   text("Halllllllo!", xPos, yPos);
};

Các đối số được truyền vào về cơ bản trở thành giống như các biến trong định nghĩa hàm của bạn và các tên phụ thuộc vào những gì bạn gọi chúng trong ngoặc đơn. Chúng ta có thể dễ dàng đổi tên chúng thành một cái gì đó ngắn hơn:

var sayHello = function(x, y) {
   text("Halllllllo!", x, y);
};

Các hàm của chúng tôi có thể chấp nhận bất kỳ số lượng đối số - không, một, hai hoặc nhiều hơn. Chúng tôi cũng có thể đã quyết định rằng chúng tôi muốn thay đổi chức năng của mình để chấp nhận một tên để nói xin chào:

var sayHello = function(name) {
   text("Halllllllo, " + name, random(200), random(200));
};

Và sau đó chúng tôi sẽ gọi nó như vậy:

sayHello("Winston");
sayHello("Pamela");

Chúng ta có thể kết hợp những ý tưởng đó và để nó chấp nhận ba đối số, cho tên và vị trí:

var sayHello = function(name, x, y) {
   text("Halllllllo " + name, x, y);
};

Và sau đó gọi nó như vậy:

sayHello("Winston", 10, 100);

Nó thực sự phụ thuộc vào những gì bạn muốn chức năng của bạn làm, và bạn muốn tùy chỉnh những gì họ có thể làm. Bạn luôn có thể bắt đầu mà không có đối số, và sau đó thêm nhiều hơn khi bạn nhận ra bạn cần chúng.

Bây giờ, bạn đã thực sự được gọi chức năng toàn bộ thời gian này - đó là cách bạn đã làm cho bản vẽ và hình ảnh động - giống như với rect, ellipse, triangle, vv Tất cả những chức năng là những người mà đến từ các thư viện ProcessingJS, và chúng ta nạp chúng vào mỗi chương trình mà bạn thực hiện ở đây, để bạn luôn có thể sử dụng chúng. Chúng tôi đã xác định các chức năng cho bạn, bởi vì chúng tôi nghĩ rằng chúng sẽ hữu ích và bây giờ bạn phải quyết định những chức năng tùy chỉnh nào bạn muốn sử dụng trong các chương trình của riêng bạn. Ví dụ: chúng tôi cung cấp ellipsechức năng, nhưng chúng tôi không cung cấp catchức năng - nếu chương trình của bạn liên quan đến nhiều con mèo khác nhau ở các địa điểm khác nhau, có lẽ bạn nên tạo chức năng mèo của riêng mình!

Có một thứ mạnh mẽ khác mà chúng ta có thể làm với các hàm - chúng ta có thể sử dụng chúng để nhận một số giá trị, tính toán chúng và trả về một giá trị mới. Hãy suy nghĩ về tất cả những điều bạn có thể làm với máy tính - thêm giá trị, trừ, tính căn bậc hai, nhân, v.v. Tất cả những điều đó sẽ được thực hiện với các hàm lấy đầu vào và đầu ra kết quả. Các hàm sẽ lấy đầu vào làm đối số và xuất kết quả bằng cách sử dụng câu lệnh return . Đây là một hàm thêm hai số và trả về kết quả:

var addNumbers = function(num1, num2) {
  var result = num1 + num2;
  return result;
};

var sum = addNumbers(5, 2);
text(sum, 200, 200); // Displays "7"

Câu lệnh return thực hiện hai điều: nó trả về một giá trị cho bất kỳ ai gọi nó (đó là lý do tại sao chúng ta có thể lưu trữ nó trong sumbiến) và nó ngay lập tức thoát khỏi hàm. Điều đó có nghĩa là thật ngớ ngẩn nếu chúng ta có một cái gì đó như thế này, bởi vì dòng cuối cùng sẽ không bao giờ được thực thi:

var addNumbers = function(num1, num2) {
  var result = num1 + num2;
  return result;
  result = result * 2; // silly!
};

Các hàm có giá trị trả về khá hữu ích để thao tác dữ liệu trong các chương trình và chúng cũng có thể được kết hợp với nhau trong các biểu thức:

var biggerSum = addNumbers(2, 5) + addNumbers(3, 2);

Bạn thậm chí có thể gọi các chức năng bên trong các cuộc gọi chức năng, mặc dù điều đó có thể khó đọc đôi khi:

var hugeSum = addNumbers(addNumbers(5, 2), addNumbers(3, 7));

Bây giờ bạn đã biết cách tạo các hàm bao quanh các khối mã, chúng ta phải đưa ra một khái niệm quan trọng: biến cục bộ so với biến toàn cục .

Khi chúng ta khai báo một biến mới bên trong một hàm, chúng ta nói rằng nó là cục bộ của hàm đó. Đó là bởi vì chỉ có chức năng đó có thể thấy biến đó - phần còn lại của chương trình bên ngoài nó không thể. Khi chúng ta ở ngoài chức năng đó, nó giống như nó không còn tồn tại. Trong hàm sau, localResultlà một biến cục bộ:

var addNumbers = function(num1, num2) {
  var localResult = num1 + num2;
  println("The local result is: " + localResult);
  return localResult;
};
addNumbers(5, 7);
println(localResult); // oh noes!

Khi chúng tôi chạy mã đó, chúng tôi sẽ gặp lỗi trên dòng cuối cùng: "localResult không được xác định." Biến chỉ được định nghĩa bên trong hàm, vì đó là nơi chúng ta đã khai báo nó với var localResult =dòng và không được định nghĩa bên ngoài hàm.

Khi chúng ta khai báo một biến ngoài các hàm của chúng ta, chúng ta nói rằng đó là một biến toàn cục. Đó là bởi vì tất cả các chức năng hiện có thể truy cập nó và làm bất cứ điều gì họ muốn với nó.

var globalResult;

var addNumbers = function(num1, num2) {
  globalResult = num1 + num2;
  println("The global result is: " + globalResult);
};
addNumbers(5, 7);
println(globalResult);

Khi chúng tôi chạy mã ở trên, chúng tôi sẽ không gặp lỗi, vì chúng tôi đã khai báo globalResultbên ngoài hàm, vì vậy chúng tôi có thể truy cập vào bất cứ nơi nào chúng tôi muốn.

Mỗi ngôn ngữ lập trình là khác nhau, nhưng đối với JavaScript, điều quan trọng là phải biết rằng các biến có "phạm vi hàm" - một hàm có thể thấy các biến cục bộ được khai báo bên trong nó và các biến toàn cục được khai báo bên ngoài nó, nhưng nó không thể nhìn thấy các biến cục bộ bên trong các chức năng khác.