Những phương thích hữu ích của mảng và đối tượng trong JavaScript [Phần 1]

Phiên bản ES6  của JavaScript có bổ sung một số phương để thao tác với mảng và đối tượng rất thú vị

Tất cả những phương thức ở đây đều có thể gọi kết hợp với một phương thức khác và chúng không làm thay đổi dữ liệu ban đầu. Đó gọi là "chainable"!

Với những phương thức này, bạn sẽ không cần phải động đến vòng lặp for và while nữa. Code của bạn sẽ sáng sủa và dễ độc hơn nhiều vì tên của các phương thức cũng rất dễ hiểu.

Trong phần 1 này chúng ta cùng làm quen với các phương thức liên quan đến mảng.

  • .filter()
    • Tạo mảng mới dựa trên những phần tử của một mảng thỏa mãn những điều kiện nhất định.
    • Ví dụ: Tạo mảng chứa những học sinh trên 18 tuổi ( tuổi hợp pháp để abcxyz như uống rượu chẳng hạn)​
const studentAge= [17,16,18,19,21,15]
const ableToDrink = studentsAge.filter( age => age > 18 );
//kết quả: ableToDrink= [19,21]
  • .map()
    • ​​​Tạo mảng mới bằng cách copy và sửa đổi dữ liệu đã copy của 1 mảng ( khác với filter, map tạo ra mảng có kích thước (số phần tử) bằng với mảng cũ
    • ví dụ: Tạo mảng mới và thêm đấu $ vào phía trước mỗi số:
const numbers = [2, 3, 4, 5];
const dollars = numbers.map( number => '$' + number);
// mảng dollars =  ['$2', '$3', '$4', '$5']
  • .reduce()
    • phương thức này thường được dùng để chuyển tất cả các phần tử của một mảng về một giá trị ( có thể cách dịch này không chuẩn lắm nhưng đại ý như tính tổng của 1 mảng)
    • ​​ví dụ: tính tổng các số trong mảng:
const numbers = [5, 10, 15];
const total = numbers.reduce( (accumulator, currentValue) => accumulator + currentValue);
// kết quả sẽ là 30
  • .forEach()
    • ​​Thực hiện các thao tác trên mỗi phần tử của mảng
    • ví dụ: hiển thị các phần tử của mảng ra màn hình:
const emotions = ['happy', 'sad', 'angry'];
emotions.forEach( emotion => console.log(emotion) );
// hiển thị lần lượt:
// 'happy'
// 'sad'
// 'angry'
  • .some()
    • ​​kiểm tra xem có bất kỳ đối tượng nào của mảng thỏa mãn điều kiện không, nếu có trả về true, nếu không có bất kỳ phần tử nào thỏa mãn thì trả về false
const userPrivileges = ['user', 'user', 'user', 'admin'];
const containsAdmin = userPrivileges.some( element => element === 'admin');
// containsAdmin = true, do trong mảng có chứa phần tử admin 
  • .every()
    • ​​Phương thức này gần giống với some() nhưng là kiểm tra xem tất cả các phần tử của mảng có thỏa mãn điều kiện hay không
    • Ví dụ:
const ratings = [3, 5, 4, 3, 5];
const goodOverallRating = ratings.every( rating => rating >= 3 );
// goodOverallRating = true, mọi phần tử trong mảng đều lớn hơn hoặc bằng 3

Bài viết được dịch từ: https://codeburst.io/useful-javascript-array-and-object-methods-6c7971d93230

Lập trình Javascript trong năm 2017 Lập trình Javascript trong năm 2017 Đinh Thiên Phúc Blog Home Tạo website tĩnh với Github Tạo website tĩnh với Github Đặng Quang Huy
Vũ Văn Quyền