Thay thế phần tử trong mảng JS bỏ cách cũ đi

Nội dung bài viết

Năm mới qua rồi, nếu ai còn sử dụng cách cũ thì nên thay thế bằng phương pháp mới với những cú pháp đã được giới thiệu ở ES6 rồi đấy. Có những điều cơ bản không khó nhưng chúng ta vẫn sử dụng nó hằng ngày cũng bởi vì chúng ta đã quá quen thuộc và cũng không muốn thay đổi vì nó vốn dĩ là chúng ta đã gắn bó quá rồi. Ví dụ đây là điển hình cho tình huống này.


Thay thế phần tử trong mảng JS nếu biết index


Nếu bạn biết chỉ mục của một mục, bạn có thể thay thế nội dung của nó bằng cách sử dụng một phép gán đơn giản như thế này.


const items = ['a', 'b', 'c', 'd', 'e', 'f']
const i = 2

items[i] = '--NEW-ITEM--'

console.log(items);

Kết quả:


//[ 'a', 'b', '--NEW-ITEM--', 'd', 'e', 'f' ]


Nó chạy cũng ngon, nhưng theo tôi có cách này hay hơn, gọn hơn, nhẹ nhàng hơn. Đó là sử dụng Array.fill() mà tôi đã giới thiệu cùng với 12 phương thức Array trong javascript.


Array.fill()


Theo MDN thì Phương thức fill() điền (sửa đổi) tất cả các phần tử của một mảng từ một chỉ mục bắt đầu (số không mặc định) đến một chỉ mục kết thúc (độ dài mảng mặc định) với một giá trị tĩnh. Nó trả về mảng đã sửa đổi. Thay đổi thì ta có code sau:


const items = ['a', 'b', 'c', 'd', 'e', 'f']
console.log(items.fill('--NEW-ITEM--', 2, 3))


Kết quả:


//[ 'a', 'b', '--NEW-ITEM--', 'd', 'e', 'f' ]


Cú pháp: arr.fill(value[, start[, end]])Với: 


  • value: Là giá trị cần fill. 
  • start (Optional): Vị trí bắt đầu fill, mặc định là 0 
  • end (Optional): Vị trí kết thúc fill, mặc định là this.length


Nếu bạn chưa biết cách tìm index của một array thì có thể tìm hiểu cách tìm chỉ mục của một mảng

Có thể bạn đã bị missing