Khái niệm về hàm trong JavaScript
Hàm là một khối mã được thiết kế để thực hiện một nhiệm vụ cụ thể. Nó giúp tổ chức chương trình theo ba cấu trúc điều khiển cơ bản: tuần tự, rẽ nhánh và lặp. Thay vì viết lại cùng một đoạn mã nhiều lần, ta có thể đóng gói logic vào một hàm và gọi nó bất cứ khi nào cần.
Lợi ích khi sử dụng hàm
- Tránh lặp lại mã nguồn (DRY - Don't Repeat Yourself).
- Tăng khả năng tái sử dụng và bảo trì code.
- Chia nhỏ chương trình thành các phần nhỏ dễ quản lý.
Cách khai báo và gọi hàm
Khai báo hàm
Dùng từ khóa function, kèm theo tên hàm, danh sách tham số (nếu có) và thân hàm:
function tenHam(thamSo1, thamSo2) {
// Các câu lệnh xử lý
return ketQua; // Có thể không có return
}
Gọi hàm
Một hàm chỉ được thực thi khi nó được gọi thông qua tên và dấu ngoặc đơn:
tenHam(giaTri1, giaTri2);
Với hàm ẩn danh (không có tên), thường dùng dạng tự thực thi (IIFE):
(function() {
console.log("Hàm chạy ngay lập tức");
})();
// Hoặc với async
(async function() {
await someAsyncOperation();
})();
Các phương thức xử lý mảng phổ biến
push() – Thêm phần tử vào cuối mảng
const arr = [1, 2];
arr.push(3, 4); // arr = [1, 2, 3, 4]
unshift() – Thêm phần tử vào đầu mảng
const arr = [3, 4];
arr.unshift(1, 2); // arr = [1, 2, 3, 4]
pop() – Xóa phần tử cuối
const arr = [1, 2, 3];
arr.pop(); // arr = [1, 2]
shift() – Xóa phần tử đầu
const arr = [1, 2, 3];
arr.shift(); // arr = [2, 3]
splice() – Chèn/xóa/thay thế phần tử tại vị trí xác định
const arr = ['a', 'b', 'c', 'd'];
arr.splice(1, 2, 'x', 'y'); // Xóa 2 phần tử từ index 1, chèn 'x','y'
// Kết quả: ['a', 'x', 'y', 'd']
join() – Nối các phần tử thành chuỗi
const arr = ['hello', 'world'];
console.log(arr.join(' ')); // "hello world"
reverse() – Đảo ngược thứ tự mảng (thay đổi mảng gốc)
const arr = [1, 2, 3];
arr.reverse(); // [3, 2, 1]
concat() – Nối mảng, trả về mảng mới
const a = [1, 2], b = [3, 4];
const c = a.concat(b); // [1, 2, 3, 4]
forEach() – Duyệt từng phần tử
['a', 'b'].forEach((item, index) => {
console.log(index + ': ' + item);
});
find() – Tìm phần tử đầu tiên thỏa điều kiện
const numbers = [5, 10, 15];
const firstBig = numbers.find(n => n > 8); // 10
findIndex() – Tìm chỉ số của phần tử đầu tiên thỏa điều kiện
const index = numbers.findIndex(n => n === 15); // 2
sort() – Sắp xếp mảng
const nums = [3, 1, 4, 2];
nums.sort((a, b) => a - b); // [1, 2, 3, 4]
filter() – Lọc phần tử theo điều kiện
const even = [1, 2, 3, 4].filter(n => n % 2 === 0); // [2, 4]
reduce() – Tổng hợp giá trị từ mảng
const sum = [1, 2, 3].reduce((tong, so) => tong + so, 0); // 6
const max = [5, 2, 8].reduce((a, b) => a > b ? a : b); // 8
map() – Biến đổi mỗi phần tử thành giá trị mới
const doubled = [1, 2, 3].map(n => n * 2); // [2, 4, 6]
some() – Kiểm tra xem có ít nhất một phần tử thỏa điều kiện
const hasNegative = [-1, 2, 3].some(n =< n < 0); // true
every() – Kiểm tra tất cả phần tử đều thỏa điều kiện
const allPositive = [1, 2, 3].every(n => n > 0); // true
Hàm bất đồng bộ async/await
Hàm async cho phép dùng await để đợi Promise hoàn thành:
async function fetchData() {
const res = await fetch('/api/data');
const data = await res.json();
return data;
}
Hoặc dùng IIFE async để thực thi ngay:
(async () => {
const result = await fetchData();
console.log(result);
})();