Rate this post

Tóm tắt: trong hướng dẫn này, bạn sẽ tìm hiểu về Array JavaScript và các hoạt động cơ bản của chúng.

Trong JavaScript, một Array là một danh sách các giá trị có thứ tự. Mỗi giá trị được gọi là một phần tử được chỉ định bởi một chỉ mục. Mảng trong JavaScript là một kiểu dữ liệu cho phép lưu trữ một tập hợp các giá trị. Mỗi giá trị trong mảng được gán với một chỉ số (index), bắt đầu từ 0. Mảng trong JavaScript có thể lưu trữ bất kỳ kiểu dữ liệu nào, bao gồm cả các mảng và đối tượng. Mảng là kiểu dữ liệu rất phổ biến trong JavaScript và có rất nhiều hàm hỗ trợ xử lý mảng , nó được sử dụng rất nhiều trong các đồ án web, game ,…

Các bài viết liên quan:

Tóm tắt nội dung

JavaScript Array

Một Array JavaScript có các đặc điểm sau:

Đầu tiên, một Array có thể chứa các giá trị thuộc các kiểu khác nhau. Ví dụ: bạn có thể có một Array lưu trữ số và chuỗi cũng như các giá trị boolean.

Thứ hai, độ dài của một Array được định kích thước động và tự động tăng lên. Nói cách khác, bạn không cần chỉ định trước kích thước Array.

Tạo Array JavaScript

JavaScript cung cấp cho bạn hai cách để tạo một Array. Cách đầu tiên là sử dụng phương thức khởi tạo Array như sau:

let mArray = new Array();

Array đang trống, tức là nó không chứa phần tử nào.

Nếu bạn biết số phần tử mà Array sẽ chứa, bạn có thể tạo một Array với kích thước ban đầu như trong ví dụ sau:

let mArray = Array(10);

Để tạo một Array với một số phần tử, bạn chuyển các phần tử dưới dạng danh sách được phân tách bằng dấu phẩy vào phương thức Constructor Array ().

let mArray = new Array(9,10,8,7,6);

Ví dụ: phần sau tạo Array có năm phần tử (hoặc số):

Điều quan trọng cần lưu ý là nếu bạn sử dụng hàm tạo Array để tạo một Array và chuyển thành một số, bạn đang tạo một Array với kích thước ban đầu.

Tuy nhiên, khi bạn truyền một giá trị có kiểu khác như chuỗi vào phương thức khởi tạo Array (), bạn sẽ tạo một Array với một phần tử của giá trị đó. Ví dụ:

let athletesArray = new Array(3); // tạo array có độ lớn 3
let scoresArray = new Array(1, 2, 3); // tạo array với 3 phần tử 1,2 3
let signsArray = new Array('Red'); // tạo array với 1 phần tử là chuỗi

JavaScript cho phép bạn bỏ qua toán tử new khi bạn sử dụng hàm tạo Array.

let artistsArray = Array();

Trong thực tế, bạn sẽ hiếm khi sử dụng Constructor Array () để tạo một Array.

Cách ưu tiên hơn để tạo một Array là sử dụng ký hiệu chữ của Array:

let arrayName = [element1, element2, element3, ...];

Dạng ký tự Array sử dụng dấu ngoặc vuông [] để bao bọc danh sách các phần tử được phân tách bằng dấu phẩy.

Ví dụ sau tạo Array màu chứa ba chuỗi:

let colorsArray = ['red', 'green', 'blue'];

Để tạo một Array trống, bạn sử dụng dấu ngoặc vuông mà không chỉ định bất kỳ phần tử nào như sau:

let emptyArray = [];

Truy cập vào một phần tử trong Array

Array JavaScript được lập chỉ mục dựa trên 0. Nói cách khác, phần tử đầu tiên của Array bắt đầu từ chỉ số 0, phần tử thứ hai bắt đầu từ chỉ mục 1, v.v.

Để truy cập một phần tử trong một Array, bạn chỉ định một chỉ mục trong dấu ngoặc vuông []:

arrayName[index]

Sau đây là cách truy cập các phần tử của Array:

let mount_Array = ['Everest', 'Fuji', 'Nanga Parbat'];

console.log(mount_Array[0]); // 'Everest'
console.log(mount_Array[1]); // 'Fuji'
console.log(mount_Array[2]); // 'Nanga Parbat'

Để thay đổi giá trị của một phần tử, bạn gán giá trị đó cho phần tử như sau:

let mount_Array = ['Everest', 'Fuji', 'Nanga Parbat'];
mount_Array[2] = 'K2';

console.log(mount_Array);

Lấy kích thước Array:

Thông thường, thuộc tính length của một Array trả về số phần tử. Ví dụ sau đây cho thấy cách sử dụng thuộc tính length:

let mount_Array = ['Everest', 'Fuji', 'Nanga Parbat'];
console.log(mount_Array.length); // 3

Các thao tác cơ bản trên Array

Phần sau giải thích một số thao tác cơ bản trên Array. Và bạn sẽ học các thao tác nâng cao như map (), filter () và Reduce () trong các hướng dẫn tiếp theo.

Thêm một phần tử vào cuối một Array

let sea_Arr = ['Black Sea', 'white Sea', 'blue Sea', 'yellow Sea'];
sea_Arr.push('Red Sea');

console.log(sea_Arr);

Để thêm một phần tử vào cuối một Array, bạn sử dụng phương thức push ():

Thêm một phần tử vào đầu một Array

let sea_Arr = ['Black Sea', 'white Sea', 'blue Sea', 'yellow Sea'];
sea_Arr.unshift('Red Sea');

console.log(sea_Arr);

Để thêm một phần tử vào đầu Array, bạn sử dụng phương thức unshift ():

Xóa một phần tử khỏi phần cuối của một Array

let sea_Arr = ['Black Sea', 'white Sea', 'blue Sea', 'yellow Sea'];
const lastElement = sea_Arr.pop();
console.log(lastElement);

Loại bỏ một phần tử khỏi phần cuối của một Array, bạn sử dụng phương thức pop ():

Xóa một phần tử khỏi đầu Array

let sea_Arr = ['Black Sea', 'white Sea', 'blue Sea', 'yellow Sea'];
const firstElement = sea_Arr.shift();

console.log(firstElement);

Để xóa một phần tử khỏi đầu Array, bạn sử dụng phương thức shift ():

Tìm chỉ số của một phần tử trong Array

let sea_Arr = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea'];
let index = sea_Arr.indexOf('North Sea');

console.log(index); // 2

Để tìm chỉ mục của một phần tử, bạn sử dụng phương thức indexOf ():

Kiểm tra xem một giá trị có phải là một Array không

console.log(sea_Arr.isArray(sea_Arr)); // true

Để kiểm tra xem một giá trị có phải là một Array hay không, bạn sử dụng phương thức sea_Arr.isArray ():

Vì sao nên sử dụng Mảng (array)?

Có nhiều lý do nên sử dụng mảng trong JavaScript, một số lý do chính là:

Lưu trữ nhiều giá trị cùng một lúc: Mảng cho phép lưu trữ nhiều giá trị cùng một lúc, và các giá trị này có thể là bất kỳ kiểu dữ liệu nào.
Sử dụng các phương thức và thuộc tính của mảng: JavaScript cung cấp rất nhiều phương thức và thuộc tính cho việc xử lý mảng, ví dụ như sort, push, pop, splice, v.v.
Lưu trữ các dữ liệu liên quan đến vị trí: Mảng cho phép lưu trữ các dữ liệu theo thứ tự, và các phương thức của mảng cũng cho phép xử lý dữ liệu theo vị trí, như với việc lấy, thay đổi hoặc xoá các phần tử tại vị trí cụ thể.
Xử lý dữ liệu có cấu trúc, ví dụ như danh sách điểm số, danh sách đơn hàng, danh sách người dùng, v.v.

Sử dụng mảng trong javascript cung cấp cho ta rất nhiều cách tiện dụng để xử lý dữ liệu , tiết kiệm thời gian và công sức cho các developer.

Khi nào nên sử dụng Mảng ?

Khi nào nên sử dụng mảng trong JavaScript:

Khi bạn cần lưu trữ nhiều giá trị cùng một kiểu dữ liệu và muốn thao tác với chúng dễ dàng.
Khi bạn cần lưu trữ dữ liệu theo thứ tự và muốn truy cập đến các phần tử theo chỉ số.
Khi bạn cần duyệt qua tất cả các phần tử trong mảng và thực hiện các thao tác với chúng.
Khi bạn cần tìm kiếm, sắp xếp hoặc xóa các phần tử trong mảng.

Trong một số trường hợp, sử dụng mảng có thể giúp giảm thiểu số lượng dòng code cần viết và tăng tốc độ thực thi của chương trình của bạn.

Một số ví dụ nâng cao về các trường hợp sử dụng Mảng trong JavaScript.

Duyệt qua tất cả các phần tử trong mảng và tính tổng các phần tử:

let numbers = [1, 2, 3, 4, 5];

let sum = 0;

numbers.forEach(function(number) {

  sum += number;

});

console.log(sum); // Output: 15

Lọc ra các phần tử có giá trị lớn hơn 10:

let numbers = [1, 5, 10, 15, 20];

let filteredNumbers = numbers.filter(function(number) {

  return number > 10;

});

console.log(filteredNumbers); // Output: [15, 20]

Sắp xếp mảng theo thứ tự tăng dần:

let numbers = [5, 1, 4, 2, 8];

numbers.sort(function(a, b) {

  return a - b;

});

console.log(numbers); // Output: [1, 2, 4, 5, 8]

Tìm giá trị lớn nhất trong mảng:

let numbers = [5, 1, 4, 2, 8];

let max = Math.max(...numbers);

console.log(max); // Output: 8

Chuyển đổi một mảng chứa các object thành một mảng chứa thuộc tính của chúng:

let people = [{ name: "John", age: 30 }, { name: "Jane", age: 25 }];

let names = people.map(function(person) {

  return person.name;

});

console.log(names); // Output: ["John", "Jane"]

Tìm kiếm một phần tử trong mảng:

let numbers = [1, 2, 3, 4, 5];

let searchValue = 3;

let isExist = numbers.includes(searchValue);

console.log(isExist); // Output: true

Gom nhóm các phần tử trong mảng theo một thuộc tính:

let people = [{ name: "John", age: 30 }, { name: "Jane", age: 25 }, { name: "Jim", age: 30 }];

let groupedByAge = people.reduce(function(result, person) {

  (result[person.age] = result[person.age] || []).push(person);

  return result;

}, {});

console.log(groupedByAge); 
// Output: { 30: [{ name: "John", age: 30 }, { name: "Jim", age: 30 }], 25: [{ name: "Jane", age: 25 }] }

Như vậy, mảng trong javascript cung cấp rất nhiều phương thức hỗ trợ cho việc xử lý và tìm kiếm dữ liệu, tùy vào yêu cầu và mục đích của bạn để sử dụng các phương thức phù hợp.

Tóm lược

Trong JavaScript, một Array là một danh sách thứ tự các giá trị. Mỗi giá trị được gọi là một phần tử được chỉ định bởi một chỉ mục.

Một Array có thể chứa các giá trị của các kiểu hỗn hợp.

Array JavaScript là Array động. Chúng phát triển hoặc thu nhỏ khi cần thiết.

JavaScript

Giới thiệu về Array trong JavaScript