Cách thêm một mục vào một vị trí mảng cụ thể bằng JavaScript

Tìm hiểu cách thêm một mục vào một vị trí mảng (chỉ mục) cụ thể trong JavaScript.

Giả sử bạn muốn thêm một mục vào một mảng, nhưng bạn không muốn nối thêm (thêm vào cuối) hoặc thêm trước (thêm vào đầu). Bạn muốn thêm mục tại một vị trí / vị trí cụ thể của một mảng.

Lưu ý:khi chúng tôi hướng dẫn thao tác dữ liệu tại các vị trí / địa điểm cụ thể, chúng tôi thường gọi nó là chỉ mục. Với chỉ mục mảng chúng tôi bắt đầu đếm ở 0 , có nghĩa là:

0 là 1
1 là 2
và như vậy.

Vì vậy, nếu bạn có một mảng có 5 mục và bạn muốn truy cập vào mục thứ 3, bạn sẽ đặt nó là 2 .

Được rồi, hãy làm những gì bạn đến đây.

Nhập phương thức splice ()

Để thêm một mục vào một vị trí chỉ mục cụ thể trong một mảng, chúng ta có thể sử dụng JavaScript array.splice() mạnh mẽ phương pháp. splice() phương thức có thể thêm hoặc xóa các mục khỏi một mảng.

splice() cú pháp trông như thế này:

array.splice(startIndex)
array.splice(startIndex, deleteCount)
array.splice(startIndex, deleteCount, value1)

splice() phương thức có 3 đối số trở lên:

Đối số 1:startIndex đó là nơi (vị trí) bạn muốn thêm thứ gì đó.
Đối số 2: tùy chọn deleteCount đối số nơi bạn có thể chỉ định số lượng mục bạn muốn xóa (từ startIndex vị trí).
Đối số 3:(các) giá trị mục mới bạn muốn thêm vào mảng.

Ví dụ về thực tế splice ()

Vì vậy, giả sử chúng tôi có một danh sách các diễn viên từ một bộ phim hành động giả tưởng có tên “Đặt câu hỏi sau”. Các diễn viên được liệt kê theo thứ tự dựa trên quy mô vai diễn của họ trong phim.

Một diễn viên trong dàn diễn viên quyết định nổi cơn tam bành vì tên của anh ấy không xuất hiện trong danh sách diễn viên chính:

const mainCastList = [
  "Michael Jai White",
  "Jean-Claude Van Damme",
  "Sigourney Weaver",
  "Jason Statham",
  "Uma Thurman"
  "The Rock",
  "Wesley Snipes"
]

Và nam diễn viên khó chịu không ai khác chính là Steven Seagal (!!) toàn năng người xuất hiện trong bộ phim này đúng 7 giây, thời gian vừa đủ để đánh bại 10 kẻ thù vô tri. Ông Seagal tin rằng đây là thời lượng đủ để đưa anh ấy vào danh sách diễn viên chính.

Và ai sẽ tranh luận với Steven Seagal?

Được rồi, hãy thêm anh ấy vào danh sách diễn viên chính bằng cách sử dụng splice() phương thức và cú pháp đối số mà bạn vừa học được.

Chúng tôi sẽ thêm Steven Seagal làm diễn viên thứ 2 trong danh sách diễn viên chính, ngay sau Michael Jai White (tôi sẽ giải thích lý do trong giây lát):

const mainCastList = [
  "Michael Jai White",
  "Jean-Claude Van Damme",
  "Sigourney Weaver",
  "Jason Statham",
  "Uma Thurman",
  "The Rock",
  "Wesley Snipes",
]

mainCastList.splice(1, 0, "Steven Seagal")

console.log(mainCastList)
// ["Michael Jai White", "Steven Seagal", "Jean-Claude Van Damme", "Sigourney Weaver", "Jason Statham", "Uma Thurman", "The Rock", "Wesley Snipes"]

Của bạn đấy Steven, tôi hy vọng bạn đang hạnh phúc!

Và chỉ vì lặp lại là một phần quan trọng của việc học, đây là những gì đang xảy ra trong đoạn mã trên:

Chúng tôi đính kèm splice() đến mainCastList biến
Sau đó, chúng tôi áp dụng 3 đối số cho splice() , vị trí startIndex (1 ), deleteCount (0 =không có gì bị xóa), và cuối cùng, mục chúng tôi muốn thêm ở vị trí chỉ mục đó ("Steven Seagal" ).

Ồ và lý do chúng tôi không thể thêm ông Seagal vào vị trí số một trong danh sách là vì rõ ràng là Michael Jai White sẽ đá đít ông ấy.

Điều cần biết về phương thức splice ()

Thêm nhiều mục cùng lúc

Nếu bạn muốn thêm nhiều mục cùng một lúc, bạn phân tách chúng bằng dấu phẩy, như sau:

mainCastList.splice(1, 0, "Steven Seagal", "Sylvester Stallone")

Xóa tất cả các mục khỏi startIndex

Nếu bạn không vượt qua đối số thứ 2 (trong ví dụ của chúng tôi, 0 ) thì tất cả các mục từ startIndex vị trí sẽ bị xóa theo mặc định. Vì vậy, hãy cẩn thận khi sử dụng splice() về các dự án thực tế.

Bắt đầu từ phần cuối của mảng

Nếu bạn muốn chỉ định vị trí mà bạn muốn thêm / xóa các mục từ cuối mảng thay vì đầu mảng, thì hãy sử dụng giá trị âm, trên splice() đầu tiên đối số, như thế này:

mainCastList.splice(-1, 0, "Steven Seagal")
console.log(mainCastList)
// ["Michael Jai White", "Jean-Claude Van Damme", "Sigourney Weaver", "Jason Statham", "Uma Thurman", "The Rock", "Steven Seagal", "Wesley Snipes"]

Giờ đây, ông Seagal đứng cuối cùng trong danh sách diễn viên chính, đây là một quyết định táo bạo mà bạn tự chịu rủi ro.