1. Định nghĩa nhanh về splice

  • Nếu như pop, push, shift & unshift cho phép chúng ta lấy add hay remove item từ vị trí đầu tiên hoặc cuối cùng của array, thì splice được ví như là "a swiss army knife" cho phép chúng ta có thể tự do insert, remove & replace bao nhiêu item tuỳ ý.
  • Kết quả sau khi thực hiện method này sẽ làm thay đổi array gốc & lấy ra được các item mà chúng ta remove.

2. Một số ví dụ cụ thể

2.1 Remove - Xoá bỏ một hoặc nhiều phần tử trong array

// Cho một array chứa nhiều số
 let numbers = [1,2,3,4,5,6,7,8,9,10]
// Yêu cầu đơn giản là xoá đi số "5", với những ai mới làm quen với array có thể chúng ta sẽ đếm ra index của số 5 là "4". Sau đó sử dụng splice để cut thử nhé.
 let removeNumber = numbers.splice(4)
 console.log("numbers: ", numbers)
 console.log("remove number: ", removeNumber)
  • Sau khi chạy ví dụ trên, các bạn đã hiểu hoàn toàn chưa? Nếu chưa hay để lại cho mình một comment ở cuối bài viết nhé.
  • Array.splice với một tham số (param) được cung cấp điều này đồng nghĩa với việc: array sẽ được cut ở index thứ n với duy nhất 1 item. Còn nếu như chúng ta muốn cut nhiều item thì sao nhỉ ?
// Ví dụ ở đây có một mảng có chứa tên, nhưng không may trong mảng tên lại có chứa thừa một vài con số không liên quan. Thử áp dụng splice để xử lý trường hợp này nhé.
    let myName = ["Tuan",1,2,3,4,"Anh"]
    let removeNumber = myName.splice(1,4)
    console.log(myName)
        console.log(removeNumber)
  • Như các bạn đã thấy param thứ 2 của splice đã xuất hiện với ý nghĩa là "số lượng item cần xoá".

**2.2 Add một hoặc nhiều item vào giữa array **

  • Hãy tiếp tục với một ví dụ sử dụng splice để thêm item vào array nào.
    // Tiếp tục ví dụ từ những con số để các bạn mới có thể dễ hình dung về sự hoạt động của các method
let numbers = [1,2,3,5]
// 1 2 3 5 chúng ta có đánh rơi nhịp nào không nhỉ? À tất nhiên là có rồi :D giờ thử code với splice xem nào
numbers.splice(3,0,4)
console.log(numbers)
  • Có thể lúc này một số bạn phần lớn đã nhận thấy sự xuất hiện của param thứ 3. Khi làm việc với splice, khi bạn cần add thêm item vào mảng hãy nhớ rằng truyền item đó vào ở param thứ 3 trở đi. Nhưng tại sao param thứ 2 lại 0 nhỉ ? Comment ở cuối bài về ý kiến & mức độ hiểu của bạn cho mình ở cuối bài viết nhé. Hãy nhớ rằng chỉ khi bạn viết ra được những ý hiểu của bạn thì bạn mới có thể tiến xa được trong việc học lập trình. Và mình rất mong bình luận chia sẻ đóng góp của các bạn với bài viết của mình.

2.3 Replace item trong array

  • Ví dụ cuối cùng về công dụng của splice
      // Tiếp tục với array chứa các số 
let numbers = [1,2,3,5,5]
  // Ở đây số 5 không may bị lặp lại 2 lần, vậy làm thế nào để thay thế số 5 thứ nhất bằng số 4 với splice ? 
numbers.splice(3,1,4)
console.log(numbers)
  • Kết quả sẽ xuất hiện khi các bạn code lại trên màn hình console của các bạn. Ví này thoạt nhìn qua cũng khá giống với ví dụ add mình đã nêu trên, nhưng hãy nhớ đấy là replace. Vậy replace là việc chúng ta xoá bỏ đi các item và thay thế các item đã xoá bằng các item khác.

3.Tổng kết lại

  • Với splice: add, remove và replace
  • Kết quả splice: sẽ ảnh hưởng (thay đổi trực tiếp) lên array gốc.
  • index để bắt đầu cho việc add, remove và replace luôn là param thứ nhất chúng ta truyền vào, tiếp theo param thứ hai là số lượng item chúng ta muốn remove (với bài toán ở ví dụ đầu tiên thì việc truyền param thứ hai vào thì mặc định Javascript sẽ remove số item còn lại). Các param từ thứ 3 trở đi dành cho các item khi chúng ta replace & add - không giới hạn kể cả truyền 69 param vẫn ok.