Tương tự như
2, phương thức
$[ ".hello" ].remove[];
3 đưa các phần tử ra khỏi DOM. Sử dụng
$[ ".hello" ].remove[];
3 khi bạn muốn xóa chính phần tử đó, cũng như mọi thứ bên trong nó. Ngoài bản thân các phần tử, tất cả các sự kiện ràng buộc và dữ liệu jQuery được liên kết với các phần tử đều bị xóa. Để xóa các thành phần mà không xóa dữ liệu và sự kiện, hãy sử dụng
$[ ".hello" ].remove[];
0 thay thế
$[ ".hello" ].remove[];
Hãy xem xét HTML sau
1
2
3
4
Hello
Goodbye
Chúng tôi có thể nhắm mục tiêu bất kỳ yếu tố nào để loại bỏ
1
$[ ".hello" ].remove[];
Điều này sẽ dẫn đến cấu trúc DOM với phần tử
1 bị xóa
$[ ".hello" ].remove[];
1
2
3
Goodbye
Nếu chúng ta có bất kỳ số lượng phần tử lồng nhau nào bên trong
2, thì chúng cũng sẽ bị xóa. Các cấu trúc jQuery khác như dữ liệu hoặc trình xử lý sự kiện cũng bị xóa
$[ ".hello" ].remove[];
Chúng tôi cũng có thể bao gồm một bộ chọn làm tham số tùy chọn. Ví dụ: chúng ta có thể viết lại mã xóa DOM trước đó như sau
Và vâng, đây là cách dễ nhất để hoàn thành nhiệm vụ. Không có mảng. remove[] chức năng trong JavaScript người ta sẽ giả sử
Tiếp theo, hãy xem cách bạn có thể làm cho nhiệm vụ này dễ dàng hơn và ít lặp lại hơn. Cuối cùng, chúng ta hãy xem một ví dụ nâng cao hơn
Làm thế nào để làm cho nó dễ dàng hơn
Một cách bạn có thể làm cho việc loại bỏ các phần tử khỏi mảng dễ dàng hơn là lưu trữ các cách tiếp cận trên vào các hàm riêng biệt
function removeFirst[arr, target] { var idx = arr.indexOf[target]; if [idx > -1] { arr.splice[idx, 1]; } return arr; } function removeAll[arr, target] { var i = 0; while [i < arr.length] { if [arr[i] === target] { arr.splice[i, 1]; } else { ++i; } } return arr; }
Bây giờ bạn có thể sử dụng các chức năng này trong dự án của mình, do đó bạn không cần phải lặp đi lặp lại nhiều lần
const numbers = [5, 10, 15]; console.log[removeFirst[numbers, 10]]; // output: [5, 15] const numbers = [1, 1, 2, 2]; console.log[removeAll[numbers, 1]] // output: [2, 2]
Bây giờ bạn đã hiểu cách xóa phần tử khỏi mảng trong JavaScript, hãy xem xét một cách tiếp cận khác
Chức năng bộ lọc []
Một cách để xóa các phần tử cụ thể khỏi một mảng trong JavaScript là sử dụng hàm filter[]
Bộ lọc[] trả về một mảng mới chỉ với các phần tử được lọc
Hàm filter[] hoạt động sao cho nó lặp qua mảng các phần tử để kiểm tra xem mỗi phần tử có thỏa mãn một điều kiện hay không. Điều kiện này được thực hiện như một hàm mà hàm filter[] gọi cho từng phần tử một. Nếu một điều kiện được đáp ứng, phần tử sẽ được thêm vào mảng kết quả
Đây là một minh họa
Hãy triển khai bộ lọc [] được minh họa ở trên
________số 8đầu ra
[1, 2, 4, 5]
Tất nhiên, bạn không phải chỉ xử lý các con số
Có thể áp dụng hàm filter[] để dễ dàng loại bỏ các đối tượng khỏi mảng dựa trên tiêu chí
Cách xóa một đối tượng cụ thể khỏi một mảng trong JavaScript
Để xóa một đối tượng cụ thể khỏi một mảng trong JavaScript, hãy sử dụng hàm filter[]
Ví dụ: giả sử chúng tôi có một dòng đối tượng người và chúng tôi muốn xóa tất cả những người dưới 18 tuổi
0
Hello
Goodbye
đầu ra
1
Hello
Goodbye
Đoạn mã này hoạt động sao cho hàm filter[]
- Vòng qua danh sách các đối tượng
- Áp dụng một chức năng cho từng đối tượng người để kiểm tra tuổi của đối tượng
- Đặt từng đối tượng người vào mảng kết quả nếu độ tuổi là 18+
- Trả về mảng mới
Loại bỏ các phần tử khỏi phần cuối của một mảng
Để xóa các phần tử ở cuối mảng trong JavaScript, bạn có thể đặt độ dài của mảng nhỏ hơn độ dài hiện tại. Điều này có nghĩa là bạn làm cho mảng ngắn hơn ban đầu bằng cách thay đổi độ dài của mảng
Ví dụ
20
Hello
Goodbye
Để xóa phần tử cuối cùng khỏi mảng, bạn cũng có thể sử dụng phương thức Array. phương thức pop[]
Phương pháp này
- Xóa phần tử cuối cùng khỏi mảng ban đầu. Nó trực tiếp sửa đổi mảng ban đầu thay vì tạo một mảng mới
- Trả về phần tử cuối cùng đã loại bỏ
Ví dụ
21
Hello
Goodbye
Loại bỏ các phần tử khỏi phần đầu của một mảng
Để xóa phần tử đầu tiên của một mảng trong JavaScript, hãy sử dụng Array. phương thức shift[]
Phương pháp này
- Xóa phần tử đầu tiên khỏi mảng ban đầu. Do đó, nó trực tiếp sửa đổi mảng ban đầu
- Trả về phần tử đầu tiên đã loại bỏ
Nếu không có phần tử nào trong mảng thì Array. phương thức shift[] trả về không xác định
Ví dụ: hãy xóa số đầu tiên trong mảng số
22
Hello
Goodbye
Xóa một phạm vi phần tử bằng cách sử dụng mảng. nối[]
Trước đó trong hướng dẫn này, bạn đã học cách sử dụng Array. splice[] để loại bỏ một phần tử
Tuy nhiên, đôi khi bạn không chỉ muốn loại bỏ một mục. Thay vào đó, bạn muốn loại bỏ một dãy các phần tử liên tiếp ở một vị trí tùy ý trong mảng
Để xóa một loạt các phần tử khỏi một mảng JavaScript, hãy sử dụng Array. phương thức mối nối []
Mảng. phương thức mối nối [] có hai đối số
- bắt đầu. Chỉ mục để bắt đầu xóa mục
- n. Số phần tử cần loại bỏ
- yếu tố. Đây là một đối số tùy chọn. Nó chỉ định các phần tử sẽ được thêm vào mảng
Phương thức này trả về các phần tử đã loại bỏ dưới dạng một mảng
Ví dụ: bỏ 3 chữ cái ở giữa
23
Hello
Goodbye
Xóa các phần tử khỏi một mảng bằng toán tử 'xóa'
Bạn cũng có thể sử dụng toán tử xóa có sẵn để loại bỏ phần tử của mảng
Điều này giả định rằng bạn biết chỉ mục của phần tử cụ thể mà bạn muốn xóa khỏi mảng
Tuy nhiên, lưu ý rằng điều này không thay đổi kích thước của mảng ban đầu
Thay vì loại bỏ hoàn toàn phần tử, toán tử xóa đánh dấu phần tử là không xác định
Toán tử xóa hoạt động sao cho nó xóa một thuộc tính khỏi một đối tượng. Nếu không còn tham chiếu đến thuộc tính, nó sẽ tự động được giải phóng khỏi bộ nhớ
Toán tử xóa trả về true nếu xóa thành công và trả về false nếu không
Không như bạn tưởng tượng, toán tử xóa không trực tiếp giải phóng bộ nhớ. Thay vào đó, việc quản lý bộ nhớ diễn ra khi các tham chiếu bị hỏng
Chẳng hạn, hãy xóa chữ cái đầu tiên khỏi một mảng ký tự
24
Hello
Goodbye
Như bạn có thể thấy, kích thước của mảng vẫn giữ nguyên. Bây giờ phần tử đầu tiên chỉ là một phần tử rỗng, không xác định
Xóa một mảng JavaScript
Để xóa tất cả các phần tử của một mảng JavaScript, bạn có thể thực hiện theo một số phương pháp
- Đặt mảng bằng một mảng trống. [Điều này có thể có vấn đề, bạn sẽ sớm biết tại sao]
- Đặt độ dài của mảng thành 0
- Sử dụng mảng. splice[] để xóa tất cả các phần tử khỏi mảng ban đầu
- Sử dụng mảng. pop[] với một vòng lặp để loại bỏ tất cả các phần tử của mảng ban đầu
Hãy nhanh chóng đi qua các tùy chọn này từng cái một
Có lẽ cách dễ nhất là đặt mảng bằng một mảng trống
Ví dụ
25
Hello
Goodbye
Tuy nhiên, điều này có thể là vấn đề
Nếu bạn có tham chiếu đến mảng này, chúng sẽ không thay đổi. Thay vào đó, các tham chiếu vẫn có các phần tử ban đầu của mảng
Nếu bạn không cẩn thận, điều này có thể gây ra rất nhiều đau đầu
Hãy xem một ví dụ
26
Hello
Goodbye
Như bạn có thể thấy, mặc dù alphabet2 được đặt bằng alphabet1, nhưng mảng alphabet2 vẫn không thay đổi sau khi loại bỏ các phần tử khỏi mảng alphabet1
Mảng ban đầu trỏ đến một mảng mới trong bộ nhớ. Mảng được tham chiếu vẫn trỏ đến mảng gốcĐể khắc phục sự cố này, bạn cần sửa đổi mảng ban đầu thay vì gán mảng mới cho một trong các mảng
Một cách để làm điều đó là đặt độ dài của mảng ban đầu thành 0
Chẳng hạn, hãy đặt độ dài của alphabet1 thành 0. Điều này thu nhỏ mảng để chứa 0 phần tử. Vì mảng alphabet2 trỏ đến cùng mảng này trong bộ nhớ nên nó cũng thay đổi
27
Hello
Goodbye
Dù sao, cách duy nhất để làm sạch mảng và tất cả các mảng tham chiếu mảng ban đầu là sửa đổi trực tiếp mảng ban đầu
Như bạn đã học trước đó, bạn có thể sửa đổi mảng ban đầu bằng cách loại bỏ các phần tử bằng Array. phương thức mối nối[] cũng vậy
Vì vậy, bạn cũng có thể loại bỏ tất cả các phần tử của mảng bằng phương thức splice[]
28
Hello
Goodbye
Tất nhiên, bạn cũng có thể sử dụng Array. pop[] cho đến khi độ dài của mảng bằng 0
Ví dụ
29
Hello
Goodbye
Như bạn đã biết trước đó, phương thức pop[] cũng sửa đổi mảng ban đầu, vì vậy cả hai mảng đều được cập nhật
Phần kết luận
Hôm nay bạn đã học cách xóa một phần tử cụ thể trong một mảng trong JavaScript
Tóm lại, không có phương thức nào như mảng. remove[], vì vậy bạn phải tự mình thực hiện
Để xóa một phần tử cụ thể khỏi một mảng
- Tìm chỉ số của phần tử
- Xóa phần tử tại chỉ mục đó
Để xóa tất cả các phần tử cụ thể khỏi một mảng
- Lặp qua mảng từ đầu đến cuối
- Đối với mỗi lần lặp, hãy kiểm tra xem phần tử hiện tại có phải là phần tử đích không
- Nếu đúng như vậy, hãy xóa mục tiêu bằng hàm splice[]
Ngoài ra, bạn có thể sử dụng hàm filter[] để xóa một/tất cả các phần tử cụ thể khỏi một mảng trong JavaScript