Xóa phần tử khỏi mảng JavaScript mà không có đột biến
|
Khi bạn bắt đầu học các cách khác nhau để thao tác với một mảng, thế giới của bạn sẽ bừng sáng. Bạn có thể thêm và xóa các phần tử. Bạn có thể đảo ngược chúng. Sau đó, bạn nhận ra rằng không phải tất cả các phương thức mảng tích hợp đều hoạt động theo cách bạn muốn. Ở đâu đó trên đường đi, bạn sẽ bối rối không biết phương thức nào thay đổi mảng ban đầu của bạn và phương thức nào không Show Sẽ thật tuyệt nếu có một công cụ cho bạn biết liệu một phương thức mảng cụ thể có thay đổi mảng ban đầu hay không? Vâng tôi biết. Chúng tôi luôn có thể kiểm tra tài liệu của MDN. Tốt hơn nữa, có trang web tuyệt vời này (hy vọng) liệt kê tất cả các phương thức mảng thường được sử dụng và xác định chúng là "đột biến" hoặc "không đột biến". ” Tôi đã kiểm đếm nhanh và thấy rằng chỉ có 9 trong số 31 phương pháp được liệt kê trên trang web làm biến đổi mảng Đây là một ý tưởng. Tại sao không chỉ nhớ chín phương pháp mảng hủy diệt? . Nếu chúng ta gọi bất kỳ phương thức nào trong chín phương thức, chắc chắn mảng ban đầu sẽ bị sửa đổi Được rồi, hãy cùng khám phá chín phương pháp này và xem những người đột biến biến đổi 1. . xô() Phương thức happy1 nhận một phần tử mảng sẽ được thêm vào cuối mảng Ở đây, chúng tôi có một mảng được gọi là happy2 bao gồm ba biểu tượng cảm xúc khuôn mặt hạnh phúc. Sau khi chúng tôi đẩy một mặt phân, mảng happy2 hiện có một mặt phân vui vẻ được gắn vào cuối let happy = ['🙂', '😀', '😊'];happy.push('💩');happy 2. . nhạc pop() Phương pháp này tương tự như phương pháp happy1, vì cả hai đều liên quan đến việc thay đổi phần tử cuối cùng của mảng Không giống như phương thức happy1, happy6 sẽ loại bỏ phần tử cuối cùng của mảng. Như được hiển thị bên dưới, chúng tôi chỉ cần happy6 phân ra khỏi mảng happy2 happy Mẹo. Biểu tượng cảm xúc phân không được chọn ngẫu nhiên. Nó ở đây để giúp chúng ta nhớ rằng cả happy9 và let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy0 đều thay đổi mảng bằng cách thêm (đẩy) hoặc xóa (bật) mục cuối cùng (poop) 3. . bỏ dịch () Phương thức let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy1 hoạt động tương tự như phương thức happy1, ngoại trừ việc nó thêm một phần tử mới vào đầu mảng Quay lại ví dụ khuôn mặt hạnh phúc sạch sẽ, không có phân của chúng tôi. Sau khi chúng tôi chuyển một biểu tượng cảm xúc ma vào phương thức let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy1, mảng happy2 hiện được dẫn dắt bởi một con ma let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy Bây giờ, nếu chúng ta muốn xóa mục đầu tiên thì sao? 4. . sự thay đổi() Trong khi happy6 xóa mục cuối cùng, thì let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy6 chỉ cần xóa mục đầu tiên trong một mảng như vậy happy Mẹo. Như bây giờ bạn có thể đã nhận thấy, let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy7 và let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy8 là các phương thức phản chiếu để thêm/xóa phần tử đầu tiên trong một mảng. Cũng giống như vậy, bạn có thể coi happy9 và let happy = [ '🙂', '😀', '😊']happy.unshift('👻');happy0 như một tập hợp các phương thức khác để thêm/xóa phần tử cuối cùng của một mảng 5. . đảo ngược() Đây là một trong những không có trí tuệ. Đúng như tên gọi của nó, phương thức happy1 đảo ngược thứ tự các phần tử trong một mảng. Ở đây, chúng ta có thể thấy hiệu ứng trăng tròn và khuyết nhờ phương pháp happy1 let moon = ['🌒', '🌓', '🌔', '🌕'];moon.reverse();moon 6. . nối() Phương thức happy3 rất mạnh, vì nó có thể lấy bao nhiêu đối số tùy thích và thay đổi mảng bằng cách thêm và/hoặc thay thế (các) mục trong mảng Trong ví dụ về mảng three-wise-monkeys bên dưới, chúng ta triển khai phương thức happy3 bằng cách truyền vào ba loại đối số
let monkeys = ['🙈', '🙉', '🙊'];monkeys.splice(1, 1, '😈', '😈', '😈'); Bây giờ con khỉ không nghe thấy gì đã biến mất và thay vào đó là ba khuôn mặt xấu xa monkeysBạn cũng có thể chọn chỉ thêm các mục vào một vị trí cụ thể bên trong mảng. Ở đây, chúng tôi đã chèn khuôn mặt ác quỷ vào chỉ mục 2 nhưng giữ lại cả ba con khỉ (bằng cách chuyển vào happy5 làm đối số thứ hai) let monkeys = ['🙈', '🙉', '🙊'];monkeys.splice(2, 0, '😈');monkeys Mẹo. Coi chừng phương pháp happy6. Nhìn bề ngoài thì có vẻ như là _ happy7, nhưng phương thức ___ happy8 tạo ra một mảng mới và do đó không làm thay đổi mảng ban đầu 7. . loại() Đây là một doozy. Theo mặc định, phương thức happy9 sẽ sắp xếp các mục trong mảng theo thứ tự giảm dần, nhưng nó không nhất thiết phải hoạt động theo cách mà những người bình thường chúng ta mong đợi Giả sử chúng ta có một dãy số. Điều gì xảy ra nếu chúng ta áp dụng phương pháp happy9? let numbers = [3, 25, 99];numbers.sort();numbers Kỳ lạ, phải không? Hóa ra, phương thức happy9 chuyển đổi từng mục thành một chuỗi và so sánh chúng theo các điểm mã Unicode của chúng Chúng ta có thể kiểm tra các điểm mã Unicode của giá trị đầu tiên của chuỗi bằng cách gọi phương thức let moon = ['🌒', '🌓', '🌔', '🌕'];moon.reverse();moon2 Sau khi ép buộc những con số này thành các chuỗi, chúng ta hiểu tại sao happy9 coi let moon = ['🌒', '🌓', '🌔', '🌕'];moon.reverse();moon4 nhỏ hơn let moon = ['🌒', '🌓', '🌔', '🌕'];moon.reverse();moon5 Đừng quên rằng biểu tượng cảm xúc cũng được truyền vào dưới dạng chuỗi Tận cùng đen đủi Nếu bạn thực sự muốn sắp xếp các số theo thứ tự hợp lý với con người, bạn có thể chuyển vào một hàm so sánh làm đối số trong phương thức happy9 Và nếu đầu bạn vẫn chưa nổ tung, hãy xem bài viết tuyệt vời này đi sâu vào phương pháp happy9 8. . copyWithin() Như tên gợi ý, phương thức này sao chép một phần của mảng và đặt nó vào một phần khác trong cùng một mảng Phải mất ba đối số
Để minh họa, đây là cách chúng ta có thể sử dụng phương pháp let moon = ['🌒', '🌓', '🌔', '🌕'];moon.reverse();moon8 Đây là một ví dụ khác để giúp làm rõ mục đích của từng đối số Lưu ý cách mục cuối cùng (“🙏”) được thay thế sau khi chúng tôi sao chép hai mục (“👌”, “✋”) Mặc dù tôi chưa có cơ hội sử dụng let moon = ['🌒', '🌓', '🌔', '🌕'];moon.reverse();moon9 trong chương trình của mình, nhưng phương pháp này dường như hoạt động tương tự như happy3. Dựa trên các loại đối số mà cả hai phương thức đều sử dụng, phương thức sau linh hoạt hơn vì chúng ta có thể chèn các mục mới thay vì sao chép từ bên trong. Vì vậy, chọn chất độc của bạn 9. . lấp đầy() Cuối cùng, phương thức let monkeys = ['🙈', '🙉', '🙊'];monkeys.splice(1, 1, '😈', '😈', '😈');1 thay đổi một số hoặc tất cả các mục trong mảng thành giá trị được truyền vào Nó cũng có 3 đối số
Ví dụ, bạn có thể sửa chữa một trái tim tan vỡ let spreadTheLove = ["<3", "💔", "love", "heart"];spreadTheLove.fill("❤️", 1, 2);spreadTheLove Hay chỉ lấp đầy tất cả bằng tình yêu happy0 Một đặc điểm nổi bật của phương pháp let monkeys = ['🙈', '🙉', '🙊'];monkeys.splice(1, 1, '😈', '😈', '😈');1 là nó chỉ nhận một giá trị tĩnh duy nhất. Nếu bạn muốn chèn nhiều giá trị vào một mảng, hãy tìm nơi khác Tóm tắt lại Một lần nữa, đây là chín phương thức mảng thiết yếu thay đổi mảng ban đầu
Bằng cách ghi nhớ chín phương pháp này, tôi đã có thể đẩy nhanh quá trình viết mã của mình. Nó cũng làm giảm bớt lo lắng của tôi về việc vô tình sao chép hoặc thay đổi mảng. Hy vọng bạn thấy nó hữu ích quá Làm cách nào để xóa một phần tử cụ thể khỏi một mảng trong JavaScript?Nếu bạn muốn xóa một phần tử khỏi mảng, bạn có thể sử dụng phương thức pop() để xóa phần tử cuối cùng hoặc phương thức shift() để xóa phần tử đầu tiên< . .
Làm cách nào để xóa khóa khỏi đối tượng JavaScript mà không bị biến đổi?const removeKey = (key, {[key]. _,. nghỉ}) => nghỉ ngơi; Giải thích. Đây là chức năng mũi tên chung để xóa một khóa cụ thể.
Cách hiệu quả nhất để loại bỏ một phần tử khỏi một mảng là gì?Tất cả những gì chúng ta cần làm là đảm bảo rằng phần tử cuối cùng nằm ở vị trí của phần tử chúng ta muốn xóa. Chúng ta chỉ cần sao chép nó vào vị trí đó và sau đó sử dụng Array. nguyên mẫu. pop() để xóa phần tử cuối cùng.
Làm cách nào để xóa phần tử khỏi mảng trong JavaScript bằng chỉ mục?Hàm bật () trong JavaScript. Phương thức này dùng để loại bỏ các phần tử ở cuối mảng. Hàm shift() trong JavaScript. Phương thức này được sử dụng để loại bỏ các phần tử từ đầu của một mảng. Hàm nối JavaScript (). Phương pháp này được sử dụng để xóa các phần tử khỏi chỉ mục cụ thể của một mảng |
