TypeScript - Chức năng

Các hàm là các khối xây dựng của mã có thể đọc được, có thể bảo trì và có thể tái sử dụng. Hàm là một tập hợp các câu lệnh để thực hiện một nhiệm vụ cụ thể. Các hàm tổ chức chương trình thành các khối mã logic. Sau khi được xác định, các hàm có thể được gọi để truy cập mã. Điều này làm cho mã có thể được sử dụng lại. Hơn nữa, các hàm giúp bạn dễ dàng đọc và duy trì mã của chương trình.

Một khai báo hàm cho trình biên dịch biết về tên, kiểu trả về và các tham số của hàm. Một định nghĩa hàm cung cấp nội dung thực tế của hàm.

Sr.No Funtions & Description
1. Xác định một chức năng

Một định nghĩa hàm xác định những gì và cách thức một nhiệm vụ cụ thể sẽ được thực hiện.
2. Gọi một hàm

Một hàm phải được gọi để thực thi nó.
3. Trả lại các chức năng

Các hàm cũng có thể trả về giá trị cùng với điều khiển, quay trở lại người gọi.
4. Chức năng được tham số hóa

Tham số là một cơ chế để truyền giá trị cho các hàm.

Các thông số tùy chọn

Các tham số tùy chọn có thể được sử dụng khi các đối số không cần được chuyển bắt buộc để thực thi một hàm. Một tham số có thể được đánh dấu tùy chọn bằng cách thêm dấu chấm hỏi vào tên của nó. Tham số tùy chọn phải được đặt làm đối số cuối cùng trong một hàm. Cú pháp để khai báo một hàm với tham số tùy chọn như sau:

function function_name (param1[:type], param2[:type], param3[:type])

Ví dụ: Tham số tùy chọn

function disp_details(id:number,name:string,mail_id?:string) { 
   console.log("ID:", id); 
   console.log("Name",name); 
   
   if(mail_id!=undefined)  
   console.log("Email Id",mail_id); 
}
disp_details(123,"John");
disp_details(111,"mary","[email protected]");

  • Ví dụ trên khai báo một hàm được tham số hóa. Ở đây, tham số thứ ba, tức là, mail_id là một tham số tùy chọn.

  • Nếu một tham số tùy chọn không được chuyển một giá trị trong khi gọi hàm, thì giá trị của tham số được đặt thành không xác định.

  • Hàm in ra giá trị của mail_id chỉ khi đối số được truyền vào một giá trị.

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
function disp_details(id, name, mail_id) {
   console.log("ID:", id);
   console.log("Name", name);
	
   if (mail_id != undefined)
      console.log("Email Id", mail_id);
}
disp_details(123, "John");
disp_details(111, "mary", "[email protected]");

Đoạn mã trên sẽ tạo ra kết quả sau:

ID:123 
Name John 
ID: 111 
Name  mary 
Email Id [email protected]

Tham số còn lại

Tham số phần còn lại tương tự như đối số biến trong Java. Các tham số còn lại không hạn chế số lượng giá trị mà bạn có thể chuyển cho một hàm. Tuy nhiên, tất cả các giá trị được truyền phải cùng loại. Nói cách khác, tham số phần còn lại hoạt động như trình giữ chỗ cho nhiều đối số cùng loại.

Để khai báo một tham số nghỉ, tên tham số được bắt đầu bằng ba dấu chấm. Bất kỳ tham số nonrest nào phải đến trước tham số còn lại.

Ví dụ: Tham số còn lại

function addNumbers(...nums:number[]) {  
   var i;   
   var sum:number = 0; 
   
   for(i = 0;i<nums.length;i++) { 
      sum = sum + nums[i]; 
   } 
   console.log("sum of the numbers",sum) 
} 
addNumbers(1,2,3) 
addNumbers(10,10,10,10,10)

  • Khai báo hàm addNumbers (), chấp nhận một tham số còn lại là nums . Kiểu dữ liệu của tham số còn lại phải được đặt thành một mảng. Hơn nữa, một hàm có thể có nhiều nhất một tham số nghỉ.

  • Hàm được gọi hai lần, bằng cách chuyển ba và sáu giá trị tương ứng.

  • Vòng lặp for lặp qua danh sách đối số, được chuyển tới hàm và tính tổng của chúng.

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

function addNumbers() {
   var nums = [];
   for (var _i = 0; _i < arguments.length; _i++) {
      nums[_i - 0] = arguments[_i];
   }
	var i;
   var sum = 0;
	
   for (i = 0; i < nums.length; i++) {
      sum = sum + nums[i];
   }
   console.log("sum of the numbers", sum);
}
addNumbers(1, 2, 3);
addNumbers(10, 10, 10, 10, 10);

Đầu ra của đoạn mã trên như sau:

sum of numbers 6 
sum of numbers 50

Tham số mặc định

Các tham số hàm cũng có thể được gán giá trị theo mặc định. Tuy nhiên, các tham số như vậy cũng có thể là các giá trị được truyền rõ ràng.

Cú pháp

function function_name(param1[:type],param2[:type] = default_value) { 
}

Note - Một tham số không thể được khai báo tùy chọn và mặc định cùng một lúc.

Ví dụ: Tham số mặc định

function calculate_discount(price:number,rate:number = 0.50) { 
   var discount = price * rate; 
   console.log("Discount Amount: ",discount); 
} 
calculate_discount(1000) 
calculate_discount(1000,0.30)

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
function calculate_discount(price, rate) {
   if (rate === void 0) { rate = 0.50; }
   var discount = price * rate;
   console.log("Discount Amount: ", discount);
}
calculate_discount(1000);
calculate_discount(1000, 0.30);

Đầu ra của nó như sau:

Discount amount : 500 
Discount amount : 300

  • Ví dụ khai báo hàm, tính_đĩa . Hàm có hai tham số - giá và tỷ lệ.

  • Giá trị của tỷ lệ tham số được đặt thành 0,50 theo mặc định.

  • Chương trình gọi hàm, chỉ truyền cho nó giá trị của tham số. Ở đây, giá trị của tỷ lệ là 0,50 (mặc định)

  • Cùng một hàm được gọi, nhưng với hai đối số. Giá trị mặc định của tỷ lệ bị ghi đè và được đặt thành giá trị được truyền rõ ràng.

Chức năng ẩn danh

Các hàm không bị ràng buộc với một định danh (tên hàm) được gọi là anonymous functions. Các hàm này được khai báo động trong thời gian chạy. Các hàm ẩn danh có thể chấp nhận đầu vào và trả về đầu ra, giống như các hàm tiêu chuẩn. Một chức năng ẩn danh thường không thể truy cập được sau khi tạo lần đầu.

Các biến có thể được gán một chức năng ẩn danh. Biểu thức như vậy được gọi là biểu thức hàm.

Cú pháp

var res = function( [arguments] ) { ... }

Ví dụ ─ Một hàm Ẩn danh Đơn giản

var msg = function() { 
   return "hello world";  
} 
console.log(msg())

Khi biên dịch, nó sẽ tạo ra cùng một mã trong JavaScript.

Nó sẽ tạo ra kết quả sau:

hello world

Ví dụ ─ Hàm ẩn danh với các tham số

var res = function(a:number,b:number) { 
   return a*b;  
}; 
console.log(res(12,2))

Hàm ẩn danh trả về sản phẩm của các giá trị được chuyển cho nó.

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
var res = function (a, b) {
   return a * b;
};
console.log(res(12, 2));

Đầu ra của đoạn mã trên như sau:

24

Biểu thức hàm và Khai báo hàm ─ Chúng có đồng nghĩa với nhau không?

Biểu thức hàm và khai báo hàm không đồng nghĩa. Không giống như một biểu thức hàm, một khai báo hàm được ràng buộc bởi tên hàm.

Sự khác biệt cơ bản giữa cả hai là, các khai báo hàm được phân tích cú pháp trước khi thực thi chúng. Mặt khác, các biểu thức hàm chỉ được phân tích cú pháp khi công cụ tập lệnh gặp nó trong quá trình thực thi.

Khi trình phân tích cú pháp JavaScript nhìn thấy một hàm trong dòng mã chính, nó sẽ giả định là Khai báo Hàm. Khi một hàm xuất hiện như một phần của câu lệnh, nó là một Biểu thức Hàm.

Hàm tạo hàm

TypeScript cũng hỗ trợ định nghĩa một hàm với hàm tạo JavaScript được tích hợp sẵn có tên là Function ().

Cú pháp

var res = new Function( [arguments] ) { ... }.

Thí dụ

var myFunction = new Function("a", "b", "return a * b"); 
var x = myFunction(4, 3); 
console.log(x);

Hàm mới () là một lệnh gọi đến hàm tạo, lần lượt tạo và trả về một tham chiếu hàm.

Khi biên dịch, nó sẽ tạo ra cùng một mã trong JavaScript.

Đầu ra của mã ví dụ trên như sau:

12

Các hàm đệ quy và TypeScript

Đệ quy là một kỹ thuật để lặp lại một hoạt động bằng cách gọi một hàm đến chính nó nhiều lần cho đến khi nó đi đến kết quả. Đệ quy được áp dụng tốt nhất khi bạn cần gọi lặp lại cùng một hàm với các tham số khác nhau từ trong một vòng lặp.

Ví dụ - Đệ quy

function factorial(number) {
   if (number <= 0) {         // termination case
      return 1; 
   } else {     
      return (number * factorial(number - 1));     // function invokes itself
   } 
}; 
console.log(factorial(6));      // outputs 720

Khi biên dịch, nó sẽ tạo ra cùng một mã trong JavaScript.

Đây là đầu ra của nó -

720

Ví dụ: Hàm đệ quy ẩn danh

(function () { 
   var x = "Hello!!";   
   console.log(x)     
})()      // the function invokes itself using a pair of parentheses ()

Khi biên dịch, nó sẽ tạo ra cùng một mã trong JavaScript.

Đầu ra của nó như sau:

Hello!!

Các hàm Lambda

Lambda đề cập đến các hàm ẩn danh trong lập trình. Các hàm Lambda là một cơ chế ngắn gọn để biểu diễn các hàm ẩn danh. Các chức năng này còn được gọi làArrow functions.

Chức năng Lambda - Giải phẫu

Có 3 phần đối với một hàm Lambda -

  • Parameters - Một chức năng có thể có các tham số tùy chọn

  • The fat arrow notation/lambda notation (=>) - Nó còn được gọi là toán tử đi tới

  • Statements - đại diện cho tập lệnh của hàm

Tip - Theo quy ước, việc sử dụng tham số ký tự đơn được khuyến khích để khai báo hàm chính xác và gọn gàng.

Lambda Expression

Nó là một biểu thức hàm ẩn danh trỏ đến một dòng mã. Cú pháp của nó như sau:

( [param1, parma2,…param n] )=>statement;

Ví dụ: Lambda Expression

var foo = (x:number)=>10 + x 
console.log(foo(100))      //outputs 110

Chương trình khai báo một hàm biểu thức lambda. Hàm trả về tổng của 10 và đối số được truyền vào.

Khi biên dịch, nó sẽ tạo mã JavaScript sau.

//Generated by typescript 1.8.10
var foo = function (x) { return 10 + x; };
console.log(foo(100));      //outputs 110

Đây là đầu ra của đoạn mã trên -

110

Tuyên bố Lambda

Câu lệnh Lambda là một khai báo hàm ẩn danh trỏ đến một khối mã. Cú pháp này được sử dụng khi nội dung hàm kéo dài nhiều dòng. Cú pháp của nó như sau:

( [param1, parma2,…param n] )=> {
 
   //code block
}

Ví dụ: câu lệnh Lambda

var foo = (x:number)=> {    
   x = 10 + x 
   console.log(x)  
} 
foo(100)

Tham chiếu của hàm được trả về và lưu trữ trong biến foo.

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
var foo = function (x) {
   x = 10 + x;
   console.log(x);
};
foo(100);

Kết quả của chương trình trên như sau:

110

Các biến thể cú pháp

Loại tham số Suy luận

Không bắt buộc phải chỉ định kiểu dữ liệu của một tham số. Trong trường hợp này, kiểu dữ liệu của tham số là bất kỳ. Chúng ta hãy xem đoạn mã sau:

var func = (x)=> { 
   if(typeof x=="number") { 
      console.log(x+" is numeric") 
   } else if(typeof x=="string") { 
      console.log(x+" is a string") 
   }  
} 
func(12) 
func("Tom")

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
var func = function (x) {
   if (typeof x == "number") {
      console.log(x + " is numeric");
   } else if (typeof x == "string") {
      console.log(x + " is a string");
   }
};
func(12);
func("Tom");

Đầu ra của nó như sau:

12 is numeric 
Tom is a string

Dấu ngoặc đơn tùy chọn cho một tham số

var display = x=> { 
   console.log("The function got "+x) 
} 
display(12)

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
var display = function (x) {
   console.log("The function got " + x);
};
display(12);

Đầu ra của nó như sau:

The function got 12

Dấu ngoặc nhọn tùy chọn cho một câu lệnh duy nhất, Dấu ngoặc đơn trống cho không có tham số

Ví dụ sau đây cho thấy hai biến thể Cú pháp này.

var disp =()=> { 
   console.log("Function invoked"); 
} 
disp();

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
var disp = function () {
   console.log("Function invoked");
};
disp();

Đầu ra của nó như sau:

Function invoked

Quá tải chức năng

Các chức năng có khả năng hoạt động khác nhau trên cơ sở đầu vào được cung cấp cho chúng. Nói cách khác, một chương trình có thể có nhiều phương thức trùng tên với cách triển khai khác nhau. Cơ chế này được gọi là Chức năng Quá tải. TypeScript cung cấp hỗ trợ cho việc nạp chồng hàm.

Để nạp chồng một hàm trong TypeScript, bạn cần làm theo các bước dưới đây:

Step 1- Khai báo nhiều hàm trùng tên nhưng khác chữ ký hàm. Chữ ký hàm bao gồm những điều sau đây.

  • The data type of the parameter

function disp(string):void; 
function disp(number):void;

  • The number of parameters

function disp(n1:number):void; 
function disp(x:number,y:number):void;

  • The sequence of parameters

function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

Note - Chữ ký của hàm không bao gồm kiểu trả về của hàm.

Step 2- Phần khai báo phải được theo sau bởi định nghĩa hàm. Các loại tham số phải được đặt thànhanynếu các loại tham số khác nhau trong quá trình quá tải. Ngoài ra, đối vớicase b đã giải thích ở trên, bạn có thể xem xét việc đánh dấu một hoặc nhiều tham số là tùy chọn trong quá trình định nghĩa hàm.

Step 3 - Cuối cùng, bạn phải gọi hàm để làm cho nó hoạt động.

Thí dụ

Bây giờ chúng ta hãy xem mã ví dụ sau:

function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 

function disp(x:any,y?:any):void { 
   console.log(x); 
   console.log(y); 
} 
disp("abc") 
disp(1,"xyz");

  • Hai dòng đầu tiên mô tả khai báo quá tải hàm. Hàm có hai quá tải -

    • Hàm chấp nhận một tham số chuỗi đơn.

    • Hàm chấp nhận hai giá trị kiểu số và chuỗi tương ứng.

  • Dòng thứ ba xác định hàm. Kiểu dữ liệu của các tham số được đặt thànhany. Hơn nữa, tham số thứ hai là tùy chọn ở đây.

  • Hàm nạp chồng được gọi bởi hai câu lệnh cuối cùng.

Khi biên dịch, nó sẽ tạo ra mã JavaScript sau:

//Generated by typescript 1.8.10
function disp(x, y) {
   console.log(x);
   console.log(y);
}
disp("abc");
disp(1, "xyz");

Đoạn mã trên sẽ tạo ra kết quả sau:

abc 
1 
xyz
ja/tutorial
es/tutorial
de/tutorial
fr/tutorial
th/tutorial
pt/tutorial
ru/tutorial
vi/tutorial
it/tutorial
ko/tutorial
tr/tutorial
id/tutorial
pl/tutorial
hi/tutorial
japost
espost
depost
frpost
thpost
ptpost
rupost
vipost
itpost
kopost
trpost
idpost
plpost
hipost

© Copyright 2021 - 2024 | All Rights Reserved