JavaScript - Tham số hàm

Chào mừng các bạn đang học lập trình! Hôm nay, chúng ta sẽ khám phá thế giới thú vị của các tham số hàm trong JavaScript. Là giáo viên máy tính gần gũi của bạn, tôi ở đây để hướng dẫn bạn qua chủ đề quan trọng này. Vậy, hãy lấy饮料 yêu thích của bạn, ngồi thoải mái, và cùng nhau bắt đầu hành trình lập mã này nhé!

Tham số hàm và đối số

Hãy bắt đầu từ những điều cơ bản. Trong JavaScript, hàm giống như những chiếc máy nhỏ thực hiện các nhiệm vụ cụ thể. Đôi khi, những chiếc máy này cần đầu vào để làm việc đúng cách. Đó là lúc các tham số xuất hiện!

Tham số là gì?

Tham số là các biến được liệt kê trong khai báo hàm. Chúng hoạt động như các placeholder cho các giá trị sẽ được truyền vào hàm khi nó được gọi.

Hãy xem một ví dụ đơn giản:

function greet(name) {
console.log("Hello, " + name + "!");
}

greet("Alice");

Trong ví dụ này, name là tham số. Khi chúng ta gọi hàm với greet("Alice"), "Alice" là đối số. Hàm sau đó sử dụng đối số này để cá nhân hóa lời chào.

Nhiều tham số

Hàm có thể có nhiều tham số. Hãy mở rộng hàm chào hỏi của chúng ta:

function greet(name, time) {
console.log("Good " + time + ", " + name + "!");
}

greet("Bob", "morning");

Tại đây, chúng ta có hai tham số: name và time. Khi gọi hàm, chúng ta cung cấp hai đối số theo thứ tự tương tự như các tham số được định nghĩa.

Tham số mặc định

Đôi khi, bạn có thể muốn đặt một giá trị mặc định cho một tham số. Điều này hữu ích khi bạn muốn hàm hoạt động ngay cả khi không có đối số được cung cấp:

function greet(name = "friend") {
console.log("Hello, " + name + "!");
}

greet(); // Xuất: Hello, friend!
greet("Charlie"); // Xuất: Hello, Charlie!

Trong trường hợp này, nếu không có đối số được cung cấp cho name, nó sẽ mặc định là "friend".

Đối tượng arguments

Bây giờ, hãy nói về một điều gì đó nâng cao hơn: đối tượng arguments. Đây là một biến cục bộ có sẵn trong tất cả các hàm. Nó chứa một đối tượng tương tự mảng của các đối số được truyền vào hàm.

function sumAll() {
let total = 0;
for (let i = 0; i < arguments.length; i++) {
total += arguments[i];
}
return total;
}

console.log(sumAll(1, 2, 3, 4)); // Xuất: 10

Hàm này có thể chấp nhận bất kỳ số lượng đối số nào và cộng chúng lại. Rất tuyệt, phải không?

Truyền đối số theo giá trị

Trong JavaScript, khi bạn truyền các kiểu dữ liệu nguyên thủy (như số, chuỗi hoặc boolean) vào một hàm, chúng được truyền theo giá trị. Điều này có nghĩa là hàm nhận được một bản sao của giá trị, không phải biến gốc.

function changeValue(x) {
x = 5;
console.log("Trong hàm: " + x);
}

let num = 10;
console.log("Trước khi gọi hàm: " + num);
changeValue(num);
console.log("Sau khi gọi hàm: " + num);

Kết quả:

Trước khi gọi hàm: 10
Trong hàm: 5
Sau khi gọi hàm: 10

Như bạn có thể thấy, thay đổi x trong hàm không ảnh hưởng đến biến num gốc.

Truyền đối số theo tham chiếu

Đối tượng, mặt khác, được truyền theo tham chiếu. Điều này có nghĩa là nếu bạn thay đổi đối tượng trong hàm, đối tượng gốc cũng sẽ bị thay đổi.

function changeName(person) {
person.name = "Jane";
console.log("Trong hàm: " + person.name);
}

let myPerson = {name: "John"};
console.log("Trước khi gọi hàm: " + myPerson.name);
changeName(myPerson);
console.log("Sau khi gọi hàm: " + myPerson.name);

Kết quả:

Trước khi gọi hàm: John
Trong hàm: Jane
Sau khi gọi hàm: Jane

Tại đây, thay đổi thuộc tính name trong hàm ảnh hưởng đến đối tượng myPerson gốc.

Lời khuyên

Hành vi này có thể cả mạnh mẽ và nguy hiểm. Nó cho phép bạn hiệu quả trong việc thay đổi các cấu trúc dữ liệu phức tạp, nhưng nó cũng có thể dẫn đến các hiệu ứng phụ không mong muốn nếu bạn không cẩn thận. Hãy luôn cảnh giác về việc bạn đang làm việc với các kiểu dữ liệu nguyên thủy hay đối tượng!

Kết hợp tất cả lại

Hãy kết thúc với một ví dụ thú vị kết hợp nhiều khái niệm chúng ta đã học:

function createSuperHero(name, power = "flying", weaknesses) {
let hero = {
name: name,
power: power,
weaknesses: []
};

for (let i = 2; i < arguments.length; i++) {
hero.weaknesses.push(arguments[i]);
}

return hero;
}

let myHero = createSuperHero("Captain Awesome", "super strength", "kryptonite", "public speaking");
console.log(myHero);

Hàm này tạo ra một đối tượng siêu anh hùng. Nó sử dụng tham số mặc định, đối tượng arguments, và làm việc cả với các kiểu dữ liệu nguyên thủy và đối tượng. Hãy thử chạy nó và xem bạn sẽ nhận được gì!

Kết luận

Chúc mừng! Bạn đã nâng cấp kỹ năng JavaScript của mình bằng cách thành thạo các tham số hàm. Nhớ rằng, thực hành là cách tốt nhất để trở nên hoàn hảo, vì vậy đừng ngại thử nghiệm các khái niệm này trong mã của riêng bạn.

Dưới đây là bảng tóm tắt các phương thức chúng ta đã覆盖:

Phương thức	Mô tả
Tham số cơ bản	function name(param1, param2) {...}
Tham số mặc định	function name(param = defaultValue) {...}
Đối tượng arguments	arguments[i] để truy cập các đối số
Truyền theo giá trị	Áp dụng cho các kiểu dữ liệu nguyên thủy (số, chuỗi, boolean)
Truyền theo tham chiếu	Áp dụng cho các đối tượng và mảng

Chúc các bạn lập mã vui vẻ và các hàm của bạn luôn chạy không lỗi!

Credits: Image by storyset