Hàm trong Javascript

1. Hàm là gì???

Có thể hiểu ngắn gọn như sau "Hàm là một đoạn mã code được khởi tạo nhằm thực thi một nhiệm vụ bất kỳ khi được gọi. Hàm có khả năng tái sử dụng và có thể được gọi ở bất cứ đâu trong chương trình của bạn".

Điều này giúp các nhà lập trình không cần phải viết một đoạn code giống nhau và phải viết đi viết lại nhiều lần. Nó giúp các nhà lập trình viết các modun code. Các hàm cho phép một nhà lập trình phân chia một chương trình lớn thành các hàm nhỏ và dễ quản lý, nâng cấp và bảo trì.

Cũng giống như bất kỳ ngôn ngữ lập trình cấp cao khác, Javascript cũng hỗ trợ tất cả tính năng cần thiết để viết các code follow theo modun bằng việc sử dụng các hàm. Bạn đã xem các hàm như alert() và write(). Chúng được viết sẵn trong Core của Javascript.

Thông thường chúng sẽ có hai loại hàm như sau.

• Hàm hệ thống(hàm có sẵn)
• Hàm tự định nghĩa.

1.1 Hàm hệ thống(hàm có sẵn)

Là các hàm được xây dựng sẵn và người lập trình chỉ việc sử dụng mà không cần phải xây dựng hoặc quan tâm các hàm này được viết ở đâu và làm như thế nào để có kết quả.(e.g alert(), promt(), write())

1.2 Hàm tự định nghĩa

Là các hàm mà người lập trình phải tự xây dựng nên dựa trên bộ quy tắc mà ngôn ngữ lập trình đó quy định và các hàm không có trong danh sách các hàm có sẵn của ngôn ngữ lập trình. Mặc định nếu chúng ta gọi các hàm này trong khi chúng ta không định nghĩa hàm thì chương trình sẽ gặp lỗi.

<script type="text/javascript">
	function myFunction(){
		// Some code
	}
</script>

Thì myFunction là hàm mà do mình định nghĩa và myFunction không có trong core của Javascript. Và chúng ta sẽ đi sau vào tìm hiểu hàm này.

2. Định nghĩa hàm.

Trước khi chúng ta sử dụng một hàm nào đó nếu chúng chưa tôn tại thì chúng ta cần định nghĩa nó. Phương thức phổ biến nhất để định nghĩa một hàm trong JavaScript theo cú pháp sau đây.

function functionName(param1, param2, param3, ...){
    // Some Code
}

Trong đó:

• function: là từ khóa của Javascript nên bắt buộc phải có.
• functionName: là tên của hàm, bao gồm các ký tự, dấu _ và số. Tền hàm bắt đầu phải là ký tự hoặc dấu _.
• param1, param2, param3, ... là các tham số truyền vào hàm. (Lưu ý: Tham số này là tuy chọn)

Ví dụ:

// Tên hàm đúng
function myFunction(){}
function _myFunction(){}
function __myFunction(){}
function _my3Function(){}
// Tên hàm sai
function 3myFunction(){}

P/s: Theo cá nhân mình thấy thì hàm trong Javascript không quá khác biệt so với các ngôn ngữ lập trình khác e.g PHP. Chỉ có điều rằng trong PHP có một khái niệm mức truy cập các phương thức mà trong Javascript không có.

Ví dụ: Chúng ta sẽ xây dựng một hàm để xuất ra một câu thông báo chào mừng đơn giản nhé.

<script type="text/javascript">
	function myFunction(){
		document.write('Chào mừng bạn đã tới www.chiasephp.net');
	}
</script>

Xem kết quả

Cũng giống PHP. Chúng ta sẽ xem sét các loại thuộc tính của hàm như sau.

• Hàm không có tham số.
• Hàm có tham số.
• Hàm có giá trị trả về.
• Hàm không có giá trị trả về.

2.1 Hàm không có tham số.

Để khai báo hàm không có tham số chúng ta sử dụng từ khoá function theo sau là tên hàm cặp dấu ngoặc đơn () và các tham số đầu vào cho hàm (tuỳ chọn).

Ví dụ:

<script type="text/javascript">
	function myFunction(){
		document.write('Chào mừng bạn đã tới www.chiasephp.net');
	}
</script>

2.2 Hàm có tham số.

Là loại hàm mà khi gọi hàm ta phải truyền giá trị vào cho nó. Tùy vào giá trị được truyền mà hàm sẽ thực thi và cho ra kết quả khác nhau.

Cú pháp:

function functionName(param1, param2...){
    // Some code
}

Trong đó:

• param1, param2 là những tham số được truyền vào trong hàm để xử lý.

Lưu ý: Trong javascript khi gọi hàm có tham số mà chúng ta không truyền tham số thì hàm vẫn được thực thi mà không báo lỗi khi đó giá trị của biến tham số không được truyền được gán giá trị undefined

Ví dụ:

<script type="text/javascript">
	function showMessage(msg){
		var msg = msg || 'Chào mừng các bạn tới website www.chiasephp.net';
		document.writeln(msg);
	}
	// Gọi hàm có truyền tham số
	showMessage("Xin chào ! Tôi tên Mr.Thiêm. Nice to meet you.");
	
	// Gọi hàm không truyền tham số
	showMessage();
</script>

P/s: Trong ví dụ trên mình sử dụng phương pháp gán giá trị mặc định cho tham số. Bằng việc sử dụng toán tử || để gán giá trị cho một tham số bất kỳ nếu giá trị của tham số là các giá trị undefined, null, false, ...

Cũng giống PHP thì Javascript cũng cho phép bạn truyền giá trị mặc định cho tham số của hàm.

function functionName(param1=value1, param2=value2...){
    // Some code
}

Ví dụ:

<script type="text/javascript">
	function showMessage(msg='Chào mừng các bạn tới website www.chiasephp.net'){
		document.writeln(msg);
	}
	// Gọi hàm có truyền tham số
	showMessage("Xin chào ! Tôi tên Mr.Thiêm. Nice to meet you.");
	
	// Gọi hàm không truyền tham số
	showMessage();
</script>

Xem kết quả

2.3 Hàm có giá trị trả về.

Hàm có giá trị trả về là hàm có sử dụng từ khóa return đặt ở cuối hàm với mục đích trả kết quả để sử dụng tiếp ở những đoạn code bên ngoài.

function functionName(param1, param2...){
    // Some code
    
    return ;
}

Trong đó:

• Từ khóa return được sử dụng để trả về kết quả sau khi hàm hoàn tất việc thực thi.

Ví dụ: Ta cần viết một hàm tính tổng của hai số a và b thì hàm này phải trả về giá trị là tổng của hai số a, b

<script type="text/javascript">
	function getSum(a, b){
		return a + b;	
	}
	// Call
	var so1 = 5;
	var so2 = 10;
	var ketqua = getSum(so1, so2);
	document.writeln(ketqua);
</script>

Xem kết quả

2.4 Hàm không có giá trị trả về.

Hàm không có return là hàm không có sử dụng từ khóa return đặt trong hàm.

Ví dụ: Viết hàm tính tổng hai số

<script type="text/javascript">
	// Khai báo hàm
	function getSum(a, b){
		var result = a + b;
		document.writeln(result);	
	}
	// Call
	var so1 = 5;
	var so2 = 10;
	
	// Truyền so1, so2 vào hàm
	getSum(so1, so2);
</script>

Xem kết quả

3. Kết luận

Hàm trong Javascript không có gì quá khác so với hàm trong các ngôn ngữ lập trình khác. Việc nắm bắt được kiến thức này giúp bạn xây dựng chương trình nhìn gọn gàng hơn. Nếu một tác vụ nào đó cần lặp đi lặp lại thì bạn mơi nên tách thành hàm. Hiểu được khái niệm hàm, hàm có và không có tham số hay có và không có giá trị trả về.