Hàm và các phương thức xử lý mảng trong JavaScript

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);
})();

Thẻ: JavaScript hàm mạng phương thức mảng async/await

Đăng vào ngày 20 tháng 5 lúc 03:30