Video học lập trình mỗi ngày

Dùng Recude, filter hay indexOf trong javascript để giải quyết remove duplicates from an array. Mỗi bạn một cách khác nhau, nhưng hãy xem những cách nào dưới đây mang lại hiệu quả cao trong cách giải quyết ở trường hợp này.

Là một lập trình viên bất cứ ngôn ngữ nào thì bạn cũng phải biết nhiều phương pháp để tiếp cận giải quyết một vấn đề. Code của bạn nhanh hay chậm cũng phụ thuộc vào nhiều yếu tố trong đó có yếu tố là phải sử dụng nhiều cách để giải quyết.

Ngoài ra biết nhiều cách cũng có thể giúp bạn đọc và hiểu hơn nhiều code của các thành viên trong group. Từ đó có thể giúp chúng ta đúc kết được những phương pháp tối ưu hơn. Bài viết này là chủ đề cũng không mới, nhưng tôi cá là vẫn còn nhiều developer js vẫn chưa hết biết đến. Đó là "Làm thế nào remove duplicates from an array".

Bài tập 1:

Có một Array:

const array = [1, 1, 1, 3, 3, 2, 2];

Yêu cầu return về array. remove duplicates from an array.

1 - Sử dụng Set

Nếu thật sự bạn là một người trong số những bạn lập trình vẫn chưa thực sự hiểu hết về set trong es6 thì nên tham khảo thêm bài viết này, mất 1 phút nhưng cũng đủ giúp các bạn hiểu sâu hơn về new set in es6

Tips: Khi nào sử dụng Set Es6

const array = [1, 1, 1, 3, 3, 2, 2];
const unique = [...new Set(array)];
console.log(unique); //return [1, 3, 2]

2 - Recude trong javascript

Recude trong javascript đây chính là một method không phức tạp nhưng thật sự là khó hiểu và không biết áp dụng khi nào trong ứng dụng của developers. Các bạn nên xem qua bài viết này để hiểu hơn nhiều về cách sử dụng reduce:

Tips: Tìm hiểu sâu về JavaScript Reduce Method

const array = [1, 1, 1, 3, 3, 2, 2];
const unique = array.reduce((result, element) => {
  return result.includes(element) ? result : [...result, element];
}, []);
console.log(unique); //return [1, 3, 2]

3 - Remove Duplicates from an Array using Filter javascript

Filter trong javascript cũng có thể cung cấp cho bạn nhiều giải pháp giải quyết vấn đề trong đó chúng ta có thể áp dụng cho vấn đề này.

const array = [1, 1, 1, 3, 3, 2, 2];
const unique = array.filter((element, index) => {
  return array.indexOf(element) === index;
});
console.log(unique); //return [1, 3, 2]

4 - Remove Duplicates from an Array using indexOf javascript

Nếu bạn không phải là fan của ES6 thì việc sử dụng indexOf cũng có thể giải quyết được vấn đề này. Cùng xem cách giải quyết bên dưới.

const array = [1, 1, 1, 3, 3, 2, 2];

// Defining function to get unique values from an array
function getUnique(array){
  var uniqueArray = [];

  // Loop through array values
  for(i=0; i < array.length; i++){
    if(uniqueArray.indexOf(array[i]) === -1) {
      uniqueArray.push(array[i]);
    }
  }
  return uniqueArray;
}

var uniqueNames = getUnique(array);
console.log(uniqueNames); //return [1, 3, 2]

5 - Remove Duplicates from an Array using forEach()

forEach cũng có thể giúp chúng ta về vấn đề này, tiếp cận nhanh, nhưng việc sử dụng forEach cũng có nhược điểm rất nhiều

Tips: For loop và forEach trong javascript

const array = [1, 1, 1, 3, 3, 2, 2];
function removeDups(names) {
  let unique = {};
  names.forEach(function(i) {
    if(!unique[i]) {
      unique[i] = true;
    }
  });
  return Object.keys(unique);
}

console.log(removeDups(array)); 

Giải quyết bài tập 1:

Đây chỉ là một vài cách để thực hiện và giải quyết vấn đề Remove Duplicates from an Array. Nhưng như bạn có thể thấy, rất khác nhau về bản chất và cách thực hoạt động. Cho nên việc lựa chọn cẩn thận từng phương pháp đó là tuỳ thuộc vào bạn.

Bài tập 2 - remove duplicate object in array javascript

Với bài tập 1 thì mới array đơn giản chúng ta có thể sử dụng những phương pháp trên, nhưng với ví dụ này thì sẽ phức tạp hơn:

const arr = [
 { id: 1, name: "king" },
 { id: 2, name: "master" },
 { id: 3, name: "lisa" },
 { id: 4, name: "ion" },
 { id: 5, name: "jim" },
 { id: 6, name: "gowtham" },
 { id: 1, name: "jam" },
 { id: 1, name: "lol" },
 { id: 2, name: "kwick" },
 { id: 3, name: "april" },
 { id: 7, name: "sss" },
 { id: 8, name: "brace" },
 { id: 8, name: "peiter" },
 { id: 5, name: "hey" },
 { id: 6, name: "mkl" },
 { id: 9, name: "melast" },
 { id: 9, name: "imlast" },
 { id: 10, name: "glow" }
]

remove duplicate object in array javascript

Ở phần giải quyết vấn đề này thì chúng tôi có nói  ở bài viết "What's vanillajs? How to remove duplicate objects from an array with vanilla JavaScript". Các bạn tham khảo về cũng tìm hiểu thêm về vanilla js. Một khái niệm rất hay.

Kết luận

Như đầu bài viết, chúng ta là những người lập trình viên, cho nên việc tiếp cận mỗi người đều khác nhau để giải quyết cũng một vấn đề, nhưng khác nhau ở code nhanh hay chậm, code tường minh hay rối rắm... Do đó, điều cần làm là nên học cách tiếp cận nhiều phương pháp khác nhau. Bài viết xin dừng taị đây.

Thanks for reading!