Mảng JavaScript: Lưu nhiều giá trị trong một biến duy nhất

Một mảng là một đối tượng có thể lưu trữ nhiều giá trị cùng một lúc. Ví dụ,

const words = ['hello', 'world', 'welcome'];

Ở đây, words là một mảng. Mảng này đang lưu trữ 3 giá trị.

Tạo một Mảng

Bạn có thể tạo một mảng bằng hai cách:

1. Sử dụng mảng literal

Cách đơn giản nhất để tạo một mảng là bằng cách sử dụng mảng literal []. Ví dụ,

const array1 = ["eat", "sleep"];

2. Sử dụng từ khóa new

Bạn cũng có thể tạo một mảng bằng cách sử dụng từ khóa new của JavaScript.

const array2 = new Array("eat", "sleep");

Trong cả hai ví dụ trên, chúng ta đã tạo một mảng có hai phần tử.

Lưu ý : Đề xuất sử dụng mảng literal để tạo một mảng.

Dưới đây là thêm ví dụ về mảng:

// empty array
const myList = [ ];

// array of numbers
const numberArray = [ 2, 4, 6, 8];

// array of strings
const stringArray = [ 'eat', 'work', 'sleep'];

// array with mixed data types
const newData = ['work', 'exercise', 1, true];

Bạn cũng có thể lưu trữ các mảng, hàm và các đối tượng khác trong một mảng. Ví dụ,

const newData = [
    {'task1': 'exercise'},
    [1, 2 ,3],
    function hello() { console.log('hello')}
];

Truy cập Phần tử trong Mảng

Bạn có thể truy cập các phần tử trong một mảng bằng cách sử dụng chỉ số (0, 1, 2 …). Ví dụ,

const myArray = ['h', 'e', 'l', 'l', 'o'];

// first element
console.log(myArray[0]);  // "h"

// second element
console.log(myArray[1]); // "e"

Run Code

Chỉ số mảng trong JavaScript

Lưu ý : Chỉ số của mảng bắt đầu từ 0, không phải 1.

Thêm Một Phần tử vào Mảng

Bạn có thể sử dụng phương thức tích hợp push() và unshift() để thêm các phần tử vào một mảng.

Phương thức push() thêm một phần tử vào cuối mảng. Ví dụ,

let dailyActivities = ['eat', 'sleep'];

// add an element at the end
dailyActivities.push('exercise');

console.log(dailyActivities); //  ['eat', 'sleep', 'exercise']

Run Code

Phương thức unshift() thêm một phần tử vào đầu mảng. Ví dụ,

let dailyActivities = ['eat', 'sleep'];

//add an element at the start
dailyActivities.unshift('work');

console.log(dailyActivities); // ['work', 'eat', 'sleep']

Run Code

Thay đổi Phần tử trong Mảng

Bạn cũng có thể thêm phần tử hoặc thay đổi phần tử bằng cách truy cập giá trị chỉ mục.

let dailyActivities = [ 'eat', 'sleep'];

// this will add the new element 'exercise' at the 2 index
dailyActivities[2] = 'exercise';

console.log(dailyActivities); // ['eat', 'sleep', 'exercise']

Run Code

Giả sử một mảng có hai phần tử. Nếu bạn cố gắng thêm một phần tử tại chỉ mục 3 (phần tử thứ tư), phần tử thứ ba sẽ không xác định. Ví dụ,

let dailyActivities = [ 'eat', 'sleep'];

// this will add the new element 'exercise' at the 3 index
dailyActivities[3] = 'exercise';

console.log(dailyActivities); // ["eat", "sleep", undefined, "exercise"]

Run Code

Theo cơ bản, nếu bạn cố gắng thêm các phần tử vào các chỉ số cao, các chỉ số ở giữa sẽ có giá trị không xác định.

Xóa Một Phần tử khỏi Mảng

Bạn có thể sử dụng phương thức pop() để loại bỏ phần tử cuối cùng khỏi một mảng. Phương thức pop() cũng trả về giá trị đã bị loại bỏ. Ví dụ,

let dailyActivities = ['work', 'eat', 'sleep', 'exercise'];

// remove the last element
dailyActivities.pop();
console.log(dailyActivities); // ['work', 'eat', 'sleep']

// remove the last element from ['work', 'eat', 'sleep']
const removedElement = dailyActivities.pop();

//get removed element
console.log(removedElement); // 'sleep'
console.log(dailyActivities);  // ['work', 'eat']

Run Code

Nếu bạn cần loại bỏ phần tử đầu tiên, bạn có thể sử dụng phương thức shift(). Phương thức shift() loại bỏ phần tử đầu tiên và cũng trả về phần tử đã bị loại bỏ. Ví dụ,

let dailyActivities = ['work', 'eat', 'sleep'];

// remove the first element
dailyActivities.shift();

console.log(dailyActivities); // ['eat', 'sleep']

Run Code

Độ dài của Mảng

Bạn có thể tìm độ dài của một mảng (số lượng phần tử trong mảng) bằng cách sử dụng thuộc tính length. Ví dụ,

const dailyActivities = [ 'eat', 'sleep'];

// this gives the total number of elements in an array
console.log(dailyActivities.length); // 2

Các Phương thức của Mảng

Trong JavaScript, có các phương thức mảng khác nhau giúp thực hiện các tính toán hữu ích dễ dàng hơn.

Một số phương thức mảng JavaScript thường được sử dụng bao gồm:

Ví dụ: Các phương thức Mảng JavaScript

let dailyActivities = ['sleep', 'work', 'exercise']
let newRoutine = ['eat'];

// sorting elements in the alphabetical order
dailyActivities.sort();
console.log(dailyActivities); // ['exercise', 'sleep', 'work']

//finding the index position of string
const position = dailyActivities.indexOf('work');
console.log(position); // 2

// slicing the array elements
const newDailyActivities = dailyActivities.slice(1);
console.log(newDailyActivities); // [ 'sleep', 'work']

// concatenating two arrays
const routine = dailyActivities.concat(newRoutine);
console.log(routine); // ["exercise", "sleep", "work", "eat"]

Run Code

Lưu ý: Nếu phần tử không có trong mảng, indexOf() trả về -1.

Hoạt động của Mảng JavaScript

Trong JavaScript, một mảng là một đối tượng. Và, các chỉ số của mảng là các khóa đối tượng.

Vì mảng là đối tượng, các phần tử của mảng được lưu trữ bằng tham chiếu. Do đó, khi sao chép một giá trị mảng, bất kỳ thay đổi nào trong mảng sao chép cũng sẽ phản ánh trong mảng gốc. Ví dụ,

let arr = ['h', 'e'];
let arr1 = arr;
arr1.push('l');

console.log(arr); // ["h", "e", "l"]
console.log(arr1); // ["h", "e", "l"]

Run Code

Bạn cũng có thể lưu trữ giá trị bằng cách truyền một khóa có tên trong một mảng. Ví dụ,

let arr = ['h', 'e'];
arr.name = 'John';

console.log(arr); // ["h", "e"]
console.log(arr.name); // "John"
console.log(arr['name']); // "John"

Run Code

Chỉ mục Mảng trong JavaScript

Tuy nhiên, không khuyến nghị lưu trữ giá trị bằng cách truyền tên tùy ý trong một mảng.

Do đó, trong JavaScript, bạn nên sử dụng một mảng nếu các giá trị nằm trong một tập hợp có thứ tự. Nếu không, thì tốt hơn là sử dụng đối tượng với { }.

• Bài đăng blog này được xuất bản ban đầu tại: https://www.programiz.com/