Gà học Javascript 4: Mảng

Trong JavaScript, mảng/Array là một loại đối tượng đặc biệt có thể chứa nhiều giá trị trong một biến, các biến có thể mang kiểu dữ liệu tùy thích. Dưới đây là một số khái niệm và thao tác cơ bản liên quan đến mảng.

Khai báo mảng

Để khai báo một mảng, ta thực hiện cú pháp bao gồm các giá trị bên trong dấu ngoặc vuông [1,2,3,4,5] ví dụ:

const mang = ["Gia tri 1", 2, true, false, 9.99999, null]

Các hàm xử lý mảng cơ bản

Đếm số phần tử

Sử dụng thuộc tính length để đếm số phần tử trong mảng.

var arr = [1, 2, 3.14, 'Hello', null, true];
arr.length; // 6

Truy cập từng phần tử

var colors = ["red", "green", "blue"];
console.log(colors[1]);  // Output: "green"

Trong đó colors[1] với 1 là index hay vị trí của phần tử trong mảng, tính từ 0

Chỉnh sửa phần tử

Bạn có thể sửa đổi giá trị của một phần tử trong mảng theo index của nó

var colors = ["red", "green", "blue"];
colors[1] = "yellow";
console.log(colors);  // Output: ["red", "yellow", "blue"]

Thêm phần tử vào mảng

Thêm phần tử: Bạn có thể sử dụng phương thức push() để thêm phần tử vào cuối mảng

var colors = ["red", "green", "blue"];
colors.push("purple");
console.log(colors);  // Output: ["red", "green", "blue", "purple"]

Xóa một phần tử từ mảng

Bạn có thể sử dụng phương thức pop() để xóa phần tử cuối cùng của mảng

var colors = ["red", "green", "blue"];
colors.pop();
console.log(colors);  // Output: ["red", "green"]

Xóa phần tử theo index của nó

var colors = ["red", "green", "blue"];
colors.splice(2, 1)  // Output: ["red", "green"]
colors.splice(1, 2)  // Output: ["red"]

Trong đó colors.splice(2, 1) 2 là index của phần tử, 1 là số phần tử được xóa tính tử phần tử có index = 2 trở đi.

Vòng lặp duyệt mảng

forEach

Bạn có thể sử dụng phương thức forEach() để lặp qua một mảng và thực hiện một số thao tác trên từng phần tử.

var numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
  console.log(number);
});

// output
1
2
3
4
5

for

Vòng for cũng là một cách thức duyệt mảng

var numbers = [1, 2, 3, 4, 5];
for(let i = 0; i < numbers.length; i++) {
    console.log(numbers[i])
}
// output
1
2
3
4
5

for – in

var numbers = [1, 2, 3, 4, 5];
for (item in numbers) {
  console.log(item)
}
// output
1
2
3
4
5

Tìm phần tử trong mảng

Bạn có thể sử dụng các phương thức find() và findIndex() để tìm phần tử đầu tiên khớp với một điều kiện nhất định.

var numbers = [1, 2, 3, 4, 5];
console.log(numbers.find(function(number) {
  return number > 3;
}));  // Output: 4
console.log(numbers.findIndex(function(number) {
  return number > 3;
}));  // Output: 3

Lọc phần tử

Bạn có thể sử dụng phương thức filter() để tạo một mảng mới với các phần tử thỏa mãn những điều kiện nhất định.

var numbers = [1, 2, 3, 4, 5];
console.log(numbers.filter(function(number) {
  return number % 2 === 0;
}));  // Output: [2, 4]

Tạo mảng mới với Map

Sử dụng phương thức map() để tạo một mảng mới với kết quả của một hàm được áp dụng cho từng phần tử của mảng ban đầu.

var numbers = [1, 2, 3, 4, 5];
console.log(numbers.map(function(number) {
  return number * 2;
}));  // Output: [2, 4, 6, 8, 10]