Thao tác với mảng trong Javascript

Khái quát

Trong lập trình web, việc thao tác với mảng chính là một phần không thể thiếu của một chương trình nào. Sử dụng mảng trong đa dạng các bài toán giúp cho các vấn đề giải quyết một cách đơn giản hơn. Mảng có thể được khai báo ở đa dạng ngôn ngữ như Javascript, PHP, Python, C++. 

Các thao tác phổ biến  với mảng trong Javascript có thể kể đến như:
  • Đếm chiều dài mảng.
  • Sắp xếp mảng.
  • Lọc mảng theo các điều kiện.
  • Kiểm tra mảng xem thỏa các điều kiện cụ thể.
  • Cắt mảng tại các vị trí đầu, cuối hoặc bất kì.
  • Thêm phần tử vào đầu mảng, cuối mảng.
  • Thay đổi giá trị phần tử trong mảng.

Để có thể nắm bắt và làm việc dể dàng với mảng trong Javascript, yêu cầu lập trình viên phải có logic tốt, tuy nhiên không dừng lại tại đó, việc có thể nắm bắt thêm nhiều phương pháp sử lí mảng trong javascript sẽ giúp cho lập trình viên giảm đáng kể độ phức tạp của bài toán. Sau đây sẽ là một số phương thức hổ trợ thao tác với mảng trong Javascript giúp cho bài toán đơn giản hơn.

Push trong Javascript

Dùng push thao tác với mảng trong Javascript để tạo thêm những phần tử nằm cuối mảng.
Đoạn code dưới đây là ví dụ dùng push để thêm vào cuối mảng một phần tử có giá trị bốn.
[1, 2, 3].push(4) // [1, 2, 3, 4]

Pop trong Javascript

Pop được dùng trong Javascript để xóa đi phần tử cuối cùng trong mảng. Ví dụ dưới đây sẽ dùng pop trong Javascript để xóa đi phần tử cuối cùng có giá trị là ba ra khỏi mảng ban đầu.

[1, 2, 3].pop() // [1, 2]

Shift trong Javascript

Trái ngược lại với Pop, Shift trong Javascript có nhiệm vụ xóa đi phần tử nằm ở vị trí đầu tiên trong mảng.

[1, 2, 3].shift() // [2, 3]

Unshift trong Javascript

Unshift trong Javascript trái ngược lại với Push trong Javascript nó có nhiệm vụ chèn thêm một giá trị vào đầu mảng trong Javascript. Ví dụ ở đây chèn thêm một phần tử có giá trị bằng không vào đầu mảng.

[1, 2, 3].unshift(0) // [0, 1, 2, 3]

Concat trong Javascript

Hàm concat trong Javascript được dùng để nối các mảng lại với nhau theo thứ tự từ trái sang phải. Ví dụ dưới đây sẽ gọp hai mảng riêng biệt thành một mảng độc nhất.

var projec1 = ["PHP", "CSS"];
var projec2 = ["HTML", "Python", "JS"];
children = projec1.concat(projec2); 
// PHP,CSS,HTML,Python,JS

Join trong Javascript

Hàm Join trong Javascript được áp dụng vào mảng nhằm mục đích chuyển đổi mảng thành chuổi và nối với nhau bằng giá trị mà Join đã đề cập. Dưới đây là ví dụ dùng Join trong Javascript để chuyển đổi mảng thành một chuổi được nối với nhau bằng dấu gạch ngang.

[1, 2, 3].join('-') // 1-2-3

IndexOf trong Javascript

IndexOf  trong Javascript được dùng để xác định vị trí của một phần tử bất kì trong mảng dựa vào giá trị của nó. Ví dụ dưới đây sử dụng IndexOf để tìm vị trí của phần tử có giá trị 'b' trong mảng và kết qua thu được đó là phần tử này nằm ở vị trí thứ một.

['a', 'b', 'c'].indexOf('b') // 1

Includes trong Javascript

Includes trong Javascript được áp dụng vào mảng để kiểm tra xem một phần tử nào đó có tồn tại trong mảng không. Nếu có sẽ trả về true và ngược lại nếu không sẽ trả về false.

['a', 'b', 'c'].includes('b') // true
['a', 'b', 'c'].includes('d') // false

Find trong Javascript

Find được sử dụng trong Javascript để truy tìm một phần tử nào đó theo những điều kiện nâng cao và sẽ kết quả đầu tiên gần nhất tính từ trái sang phải. Ví dụ dưới đây sử dụng Find trong Javascript để tìm phần tử nào chia hết cho hai gần nhất.

[1, 2, 3, 4, 5, 6].find((n) => n % 2 === 0) // 2

FindIndex trong Javascript

FindIndex trong Javascript củng được sử dụng để tìm phần tử đầu tiên thỏa mãn các điều kiện tuy nhiên lần này nó sẽ không lấy giá trị mà sẽ trả về vị trí phần tử đó trong mảng.

[1, 2, 3, 4, 5, 6].find('(n) => n % 2 === 0) // 1

Map trong Javascript

Map trong Javascript được sử dụng để thay đổi các giá trị trong mảng theo một điều kiện đã cho. Ví dụ sau đây sử dụng Map trong Javascript để thay đổi các giá trị trong mảng, mỗi phần tử đều sẽ nhân hai lần giá trị ban đầu.

[1, 2, 3].map((n) => n * 2) // [2,4,6]

Filter trong Javascript

Filter trong Javascript được dùng để lọc các giá trị trong mảng sao cho phù hợp với điều kiện lọc. Kết thúc quá trình lọc sẽ giữ lại được những giá trị đáp ứng được các điều kiện trong filter. Ví dụ sau sẽ lọc và lấy các giá trị trong mảng chia hết cho hai.

[1, 2, 3, 4, 5, 6, 7].filter((n) => n % 2 === 0) // [2,4,6]

Reverse trong Javascript

Reverse trong Javascript được sử dụng để đảo ngược tất cả các vị trí trong mảng lại với nhau.

[1, 2, 3, 4, 5, 6, 7].reverse() // [7, 6, 5, 4, 3, 2, 1]


Every trong Javascript

Hàm every trong Javascript được dùng để kiểm tra điều kiện liệu mảng có thỏa mản một yêu cầu nào không, khi tất cả các phần tử trong mảng đều thỏa mãn điều kiện thì mới trả về true ngược lại dù chỉ một phần tử không thỏa mãn điều kiện sẽ trả về false.

Ví dụ dưới đây sử dụng every để kiểm tra liệu tất cả các phần tử bên trong mảng đều nhỏ hơn sáu không.

[1, 2, 3, 4, 5, 6, 7].every((n) => n < 6) // false
[1, 2, 3, 4, 5].every((n) => n < 6) // true

Some trong Javascript

Trái ngược với every, Some trong Javascript củng sẽ đi kiểm tra liệu mảng có thỏa mãn những điều kiện được đặt ra không, tuy nhiên chỉ cần một phần tử bất kì trong mảng thỏa mãn điều kiện thì nó sẽ trả về true và ngược lại chỉ khi nào không có bất cứ một phần tử nào trong mảng thỏa mãn yêu cầu mới trả về false.

[1, 2, 3, 4, 5, 6, 7].some((n) => n < 6) // true
[7, 8, 9].some((n) => n < 6) // false

At trong Javascript

At trong Javascript được sử dụng để lấy phần tử bất kì dựa vào vị trí của nó trong mảng tính theo chiều từ phải sang trái, số thứ tự sẽ tính từ âm một tức là vị trí của phần tử cuối cùng và càng di chuyển về bên trái vị trí sẽ càng nhỏ.

[1, 2, 3, 4, 5, 6, 7].at(-1) // 7
[1, 2, 3, 4, 5, 6, 7].at(-2) // 6

Tổng kết

Trên đây là những hàm được sử dụng để thao tác với mảng trong Javascript do chính tay Lùn Dev soạn thảo và tập hợp lại. Mong rằng bài viết này sẽ giúp ích cho các bạn trong việc đơn giản hóa các vấn đề sử lí với mảng trong Javascript. 
Previous Post Next Post