Tips xử lý Array Javascript hay không phải ai cũng biết

4105
xử lỳ array trong javascript

Xin chào tất cả mọi người! Đang trong thời đại của Cô Vy, cả nước đang thực hiện nghiêm việc cách ly toàn xã hội. Vậy nên thời gian cũng rảnh rỗi hơn, mình có đi lang thang vài blog IT thì có lượm nhặt được vài tips khá hay về mảng (Array) trong Javascript, muốn share lại cho mọi người. Và nếu mọi người biết các tips nào khác hãy share lại với mình để chúng ta cùng nâng cao kiến thức làm việc với Array nhé.

Cùng bắt đầu với mình nào!

1. Xóa bỏ giá trị trùng lặp

Đây là một câu hỏi phỏng vấn rất phổ biến về Array Javascript, làm thế nào để trích xuất các giá trị duy nhất trong Array. Giải quyết vấn đề này, bạn có thể sử dụng new Set().

2. Thay đổi giá trị trong mảng

Đôi khi, bạn cần phải thay thế 1 giá trị cụ thể trong mảng và có 1 phương pháp hay và ngắn gọn để làm điều đó. Chúng ta có thể sử dụng splice() method.

Cú pháp: Array.splice(index, howmany, item1, ..., itemX)

Trong đó:

  • index – là vị trí bắt đầu thay thế.
  • howmany – số phần tử sẽ bị loại bỏ, tính từ vị trí index bao gồm cả phần tử index. Nếu howmany mang giá trị 0 thì sẽ không có phần tử nào bị loại bỏ.
  • item1, ..., itemX – các phần tử sẽ được thêm vào từ vị trí index. Sau khi thêm, phần tử thứ index của mảng sẽ là item1.

3. Map array without .map()

Có lẽ mọi người đều biết map() method trong Array, nhưng có 1 giải pháp khác được sử dụng có kết quả tương tự và code khá sạch sẽ. Đó là ta có thể sử dụng from() method cho mục đích này.

4. Empty an array

Cách khá đơn giản, bạn chỉ cần gán Array.length = 0 là mọi chuyện được giải quyết. Ngoài ra còn có các cách khác nữa, cùng xem ví dụ nhé.

5. Convert array to an object

Vấn đề này xảy ra rằng chúng ta đang có 1 mảng Array, nhưng với mục đích nào đó, ta cần chuyển thành 1 Object với dữ liệu đó. Cách nhanh nhất để chuyển đổi mảng Array thành Object là sử dụng Spread Operator (...) trong ES6.

6. Merge arrays

Với bài toán này, chúng ta sẽ nghĩ ngay đến việc sử dụng phương thức concat(). Ta cũng có thể giải quyết bằng cách lại một lần nữa sử dụng Spread Operator (...) trong ES6.

7. Tìm giá trị giống nhau giữa 2 mảng

Bài toán giả sử được đưa ra phần này, đó là tìm ra các giá trị chung giữa 2 mảng và chúng không được trùng lặp.

8. Xóa các giá trị Falsy trong mảng

Đầu tiên, phải xác định giá trị Falsy . Trong Javascript, có các giá trị Falsy là false, 0 hoặc NaN, '' hoặc "", null, undefined.

Bây giờ, ta có thể tìm hiểu làm thế nào để loại bỏ giá trị này khỏi mảng. Để đạt được điều này, chúng ta sẽ sử dụng phương thức filter()

9 . Tìm index của phần tử xuất hiện cuối cùng trong mảng

Bài toán đưa ra là chúng ta có một mảng Array và có giá trị trùng lặp, tìm vị trí xuất hiện cuối cùng. Giải quyết bài toán bằng cách sử dụng phương thức lastIndexOf().

10. Tính toán các giá trị trong mảng

Điều này ta có thể sử dụng for() hoặc foreach(), khai báo 1 biến sum rồi cộng với từng giá trị trong mảng. Với ES6, ta có phương thức reduce() giúp cho việc tính tổng ngắn gọn và sạch sẽ code hơn.

11. Reversing an array

Khi chúng ta cần đảo ngược mảng, không cần phải tạo nó thông qua các vòng lặp và hàm phức tạp. Hãy sử dụng phương thức reverse() dễ dàng thực hiện tất cả cho chúng ta.

Với cách sử dụng trên, mảng ban đầu colors[] cũng sẽ bị thay đổi theo. Nếu bạn không muốn thay đổi mảng ban đầu của nó, bạn có thể viết:

let

12. Tìm số nhỏ nhất trong mảng

Sử dụng phương thức Math.min()

Tổng kết

Trong bài viết này, mình đã chia sẻ cho bạn vài tips mình biết. Hy vọng những tips trên sẽ phần nào giúp đỡ các bạn trong khi làm việc với Javascript.

Cảm ơn bạn đã đọc bài viết của mình!

Tài liệu tham khảo

https://www.w3schools.com/js/js_es6.asp

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

https://www.freecodecamp.org/news/https-medium-com-gladchinda-hacks-for-creating-javascript-arrays-a1b80cb372b/

TopDev via Viblo

SHARE