JavaScript at() method có gì hay? Tìm hiểu về method at() trong Javascript

Khi làm việc với array trong JavaScript, chúng ta có rất nhiều method để xử lý array 😁. Hôm nay mình xin giới thiệu tới các bạn một method khá hay ho, method mình muốn giới thiệu là method at(). Method này có gì hay thì chúng ta cùng tìm hiểu trong bài viết này nhé 🎉.

Để hiểu về method at() chúng ta sẽ xem một ví dụ để xem method này giúp ích gì cho chúng ta nhé ^^.

const animal = ['🦄', '🐭', '🦬', '🦘', '🦭', '🐔', '🐍'];

Mình có một mảng animal chứa các con vật ở trên, bây giờ mình sẽ thử lấy con chuột (🐭) ra bằng cách:

animal[1]; // 🐭

Cách lấy phần tử khá đơn giản mà các bạn có lẽ đã rất quen thuộc đúng không ^^, tương tự ta sẽ lấy phần tử cuối mảng bằng cách:

animal[animal.length - 1]; // 🐍

Với cách này chúng ta gặp một vấn đề nhỏ, đó là việc truy vấn các phần tử đầu của mảng khá dễ dàng. Đối với các phần tử gần cuối chúng ta sẽ sử dụng đến animal.length - index khá dài dòng đúng không ^^.

Tại sao mình nói đoạn code trên khá dài dòng? lý do là chúng ta có một method mới là at() với cú pháp khá ngắn gọn, chúng ta cùng xem nó ngắn gọn thế nào nhé!

Method at() trong JavaScript

Method at(index) có đối số là một số nguyên, được sử dụng để truy xuất phần tử tại index và trả về phần tử tại index đó. Nó tương đương như khi chúng ta sử dụng cú pháp dấu ngoặc vuông [] ở ví dụ trên. Tuy nhiên method at() có một số điểm khác biệt khi sử dụng.

• Method at(index) với index có thể là số dương hoặc số âm.
• Chỉ số index âm sẽ đếm ngược lại bắt từ phần tử cuối trong mảng, index dương sẽ đếm từ đầu mảng như khi sử dụng [].

Bây giờ chúng ta sẽ áp dụng method at() vào mảng ở trên và lấy phần tử tại vị trí cho trước thử nhé:

const animal = ['🦄', '🐭', '🦬', '🦘', '🦭', '🐔', '🐍'];

animal.at(1); // 🐭
animal.at(3); // 🦘
animal.at(-1); // 🐍
animal.at(-2); // 🐔

Các bạn có thể thấy, bây giờ chúng ta truy xuất các phần tử trong mảng khá dễ dàng và ngắn gọn đúng không ^^.

Khi chúng ta truy xuất bằng phần tử trong mảng bằng index, nếu không tìm thấy index, method at() sẽ return undefined, tương tự như khi sử dụng ngoặc vuông [].

animal.at(100); // undefined

Đây là một method chúng ta nên sử dụng vì nó ngắn gọn, tường minh. Tuy nhiên đây là một method mới nên một số trình duyệt chưa hỗ trợ method at().

Method at(index) hiện có thể sử dụng trên Google Chrome version 92, Firefox version 90, Edge version 92.

Kết luận

Như vậy là chúng ta đã tìm hiểu xong về method at() trong JavaScript. Hy vọng bài viết giúp ích cho các bạn 😁.

Hẹn gặp các bạn trong các bài viết tiếp theo. Chúc các bạn học tốt ^^.