Computer >> Máy Tính >  >> Lập trình >> Javascript

Cách lấy phần tử cuối cùng của một mảng với Vanilla JavaScript

Hãy cùng tìm hiểu cách lấy phần tử cuối cùng của một mảng bằng JavaScript thuần túy, sử dụng 3 phương pháp khác nhau. Trước tiên, hãy thiết lập một loạt các mục, vì vậy chúng tôi có một số thứ để làm việc. Trong trường hợp này, chúng tôi sẽ sử dụng một danh sách các bài tập.

Tạo mảng bài tập

const exercises = ['pull-up', 'push-up', 'squat', 'deadlift']

Nếu chúng ta muốn lấy cái đầu tiên trong danh sách của mình, chúng ta sử dụng exercises[0] , để lấy exercises[1] sử dụng thứ hai nhưng nếu chúng ta không biết tổng số bài tập trong danh sách của mình thì sao?

Không sao, có một số cách chúng ta có thể làm điều đó.

1. Tìm phần tử cuối cùng với array.length

Trong phương pháp đầu tiên, chúng tôi sẽ sử dụng array.length của JavaScript bất động sản. Để sử dụng nó, trước tiên chúng ta cần thiết lập một biến, sau đó gán mảng của chúng ta cho nó:

const lastExercise = exercises[exercises.length - 1]

Bây giờ nếu bạn chạy console.log(lastExercise) bảng điều khiển của bạn sẽ xuất ra phần tử cuối cùng của mảng, trong trường hợp của anh ta là deadlift .

2. Tìm phần tử cuối cùng bằng pop ()

Chúng tôi cũng có thể sử dụng một phương thức mảng JavaScript được gọi là pop() cũng nhận được phần tử cuối cùng của một mảng nhưng theo một cách khác. Hãy dùng thử:

exercises.pop()

Phương thức pop () thực sự nhắm mục tiêu đến phần tử cuối cùng trong mảng của chúng ta, nhưng hãy lưu ý rằng nó không chỉ tìm thấy phần tử cuối cùng trong mảng của bạn mà còn loại bỏ nó.

Nếu bạn console.log(exercises) ngay bên dưới exercises.pop() bạn sẽ thấy rằng mảng của bạn hiện có 3 phần tử thay vì 4 phần tử ban đầu. Đây có thể là điều bạn muốn hoặc không, tùy thuộc vào trường hợp sử dụng của bạn.

3. Tìm phần tử cuối cùng bằng phương thức Array Slice ()

Phương pháp cuối cùng mà tôi muốn chỉ cho bạn tương tự với length nhưng ở đây chúng tôi sử dụng slice() thay vào đó, như thế này:

const lastExercise = exercises.slice(-1)

Bây giờ nếu bạn console.log(lastExercise) bạn sẽ nhận được kết quả tương tự như trong length ví dụ. Rất nhiều nhà phát triển tìm thấy slice để thân thiện với người đọc hơn length nhưng tiếc là nó cũng chậm hơn nhiều, hiệu suât khôn ngoan.

Để xem ý tôi là gì, hãy thử chạy thử nghiệm so sánh phần này với chiều dài trên jsperf.com

Vì vậy, bạn nên sử dụng phương thức mảng hiệu quả nhất hoặc dễ đọc nhất? Không có câu trả lời đúng hay sai, nó phụ thuộc vào ngữ cảnh của bạn.

Nói chung, tôi có xu hướng hướng đến việc lựa chọn hiệu suất thay vì sự tiện lợi như một quy tắc chung, ví dụ:khi làm việc với hình ảnh. Đó không phải là một câu hỏi trắng đen. Về việc tìm phần tử cuối cùng trong một mảng đơn giản, bạn thậm chí sẽ không nhận thấy sự khác biệt về hiệu suất giữa slicelength trong ứng dụng của bạn, trừ khi bạn đang thực thi hàng triệu chức năng mỗi giây.

Luôn đưa ra quyết định dựa trên ngữ cảnh.