Điều gì là duy nhất trong Javascript?

Khi bạn có một mảng với các giá trị trùng lặp, bạn có thể lấy các giá trị duy nhất bằng cách gọi hàm tạo Set trên mảng. new Set([])

Ảnh của Igor Starkov trên BaptXóa các giá trị trùng lặp khỏi một mảng

Một trong những phần yêu thích của tôi về ES6 (còn được gọi là ECMAScript 2015 hoặc chỉ là “JavaScript hiện đại”) là việc bổ sung Set, một loại đối tượng mới sẽ chỉ cho phép bạn thêm bất kỳ giá trị nào vào nó một lần.

Thoạt nhìn, Set có một số điểm tương đồng với các đối tượng JavaScript thông thường, yêu cầu các khóa đối tượng duy nhất (còn được gọi là thuộc tính hoặc tên thuộc tính). Các đối tượng chỉ cho phép bạn thêm bất kỳ tên thuộc tính cụ thể nào một lần, vì vậy có vẻ như bạn có thể sử dụng chúng để nhận các giá trị duy nhất từ ​​một mảng JavaScript

Tuy nhiên, khóa đối tượng JavaScript phải là chuỗi; . Ngoài ra, các khóa đối tượng không nhớ “thứ tự chèn” của chúng — thứ tự ban đầu chúng được thêm vào đối tượng

Điều đó làm cho các đối tượng không phù hợp để tìm các giá trị duy nhất từ ​​một mảng, đặc biệt nếu bạn muốn nhận các giá trị duy nhất theo cùng thứ tự mà chúng xuất hiện bên trong mảng. Đó là lý do tại sao bây giờ chúng ta có Set

Như chúng ta sẽ thấy trong bài viết này, bởi vì các đối tượng Set có thể lặp lại, nên rất dễ chuyển đổi các mảng thành các đối tượng Set và ngược lại

Tìm các giá trị mảng duy nhất với Set

Hãy lấy một ví dụ về mã của một mảng chứa các loại khác nhau, một số số trùng lặp, chuỗi và booleans

Trong khi tôi đang sử dụng các kiểu nguyên thủy phổ biến hơn, thì Set thực sự hoạt động tốt với các giá trị Set1, Set2 và Set3

Xem mã thô dưới dạng GitHub Gist

Trong ví dụ này, chúng ta thấy rằng thứ tự chèn của các mục được duy trì, chẳng hạn như Set4 vẫn đứng trước Set5 trong mảng kết quả gồm 6 giá trị duy nhất sau khi 7 giá trị trùng lặp đã bị xóa

Làm cách nào để lấy các giá trị riêng biệt từ mảng?

“Hàm tạo Set9 cho phép bạn tạo các đối tượng Set lưu trữ các giá trị duy nhất thuộc bất kỳ loại nào, cho dù là giá trị nguyên thủy hay tham chiếu đối tượng. ” — Tài liệu MDN

Chúng ta có thể chuyển đổi trở lại một mảng bằng cách sử dụng new Set([])1 hoặc, cách khác, toán tử trải rộng new Set([])2 với dấu ngoặc vuông new Set([])3. Cái sau còn được gọi là sử dụng cú pháp trải rộng new Set([])4 với “ký hiệu theo nghĩa đen của mảng. ”

Đặt cả hai lại với nhau, chúng ta có thể nhận được các giá trị duy nhất từ ​​​​mảng bằng một lớp lót. new Set([])5. Mã tương đương sử dụng cú pháp trải rộng new Set([])4 là. new Set([])7

Lưu ý rằng việc sử dụng new Set([])8 với các đối tượng JavaScript hoạt động hơi khác một chút, tùy thuộc vào việc bạn cần các tham chiếu đối tượng duy nhất hay để so sánh nội dung của các đối tượng đó

Hành vi mặc định sử dụng các tham chiếu đối tượng duy nhất, chẳng hạn như Set sẽ xóa mọi bản sao của các đối tượng được tìm thấy nhiều lần. Bạn phải thực hiện một cách tiếp cận khác để so sánh nội dung của các đối tượng

Để biết thêm thông tin về cách tiếp cận này để tìm các giá trị duy nhất, vui lòng đọc hướng dẫn đầy đủ của tôi về cách sử dụng Set trong JavaScript

Cách sử dụng Đặt để lọc các mục duy nhất trong JavaScript ES6

Cần các giá trị duy nhất trong JavaScript? . Đây là cách sử dụng Đặt để lọc danh sách…

trung bình. com

Tôi hy vọng bài viết này đã giúp bạn hiểu tại sao Set là công cụ để sử dụng khi bạn cần lấy các giá trị duy nhất từ ​​một mảng

Mã hóa vui vẻ. 🎭👔🎠🎄🎁

Tiến sĩ. Derek Austin là tác giả của Lập trình nghề nghiệp. Làm thế nào bạn có thể trở thành một lập trình viên có thân hình 6 con số thành công trong 6 tháng, hiện đã có trên Amazon

Bạn đã bao giờ muốn lấy các phần tử riêng biệt từ một mảng chưa?

hình ảnh từ pexels Các phần tử riêng biệt của một mảng các giá trị nguyên thủy

là các giá trị bất biến trong tất cả các loại ngoại trừ các đối tượng. Các loại giá trị nguyên thủy bao gồm Boolean, Null, Undefined, Number, String và Symbol. Mảng giá trị nguyên thủy thường được sử dụng làm tùy chọn chọn và chúng tôi không muốn các giá trị tùy chọn trùng lặp. Ví dụ: chúng tôi có một mảng số đại diện cho năm tài chính [2016, 2017, 2017, 2016, 2019, 2018, 2019] và chúng tôi muốn hiển thị tất cả các năm tài chính có sẵn ([2016, 2017, 2018, 2019]) để người dùng có thể chọn một giá trị để lọc dữ liệu. Trong kịch bản này, chúng ta cần lấy các phần tử riêng biệt từ mảng ban đầu

có một câu trả lời có giá trị. Có hai cách phổ biến (tương ứng trong ES5 và ES6) để nhận các giá trị duy nhất trong các mảng giá trị nguyên thủy của JavaScript. Về cơ bản, trong ES5, trước tiên bạn xác định một hàm gọi lại distinct để kiểm tra xem giá trị có xuất hiện lần đầu trong mảng ban đầu hay không, sau đó lọc mảng ban đầu để chỉ các phần tử xuất hiện đầu tiên được giữ lại

Trong ES6, mã đơn giản hơn nhiều. Đoạn mã bên dưới sử dụng đối tượng Set để lưu trữ một tập hợp các giá trị duy nhất, sau đó sử dụng toán tử trải rộng để tạo một mảng mới

Tuy nhiên, chúng ta cần hết sức cẩn thận rằng giải pháp trên chỉ hoạt động đối với các giá trị nguyên thủy. Nếu bạn có một mảng ngày, thì bạn cần một số phương thức tùy chỉnh hơn. Ảnh chụp màn hình bên dưới cho thấy rằng Set có thể không hoạt động như bạn mong đợi, vì Set so sánh các đối tượng theo tham chiếu

Các giá trị thuộc tính riêng biệt của một mảng các đối tượng

Rất thường xuyên, mảng mà chúng ta đang xử lý bao gồm các đối tượng JSON được lấy từ phía máy chủ. Bây giờ, chúng tôi muốn lấy các giá trị riêng biệt của một thuộc tính nhất định từ mảng đối tượng. Ví dụ: mảng là [ {"name":"Joe", "age":17}, {"name":"Bob", "age":17}, {"name":"Tom", "age":35} ] và chúng tôi muốn lấy các độ tuổi khác nhau từ mảng

Giải pháp thực sự rất dễ dàng. Trước tiên, chúng tôi ánh xạ mảng thành một mảng mới chỉ chứa các giá trị nguyên thủy, sau đó chúng tôi có thể sử dụng các giải pháp trên. Ảnh chụp màn hình bên dưới hiển thị một ví dụ

Các đối tượng khác biệt theo giá trị thuộc tính từ một mảng các đối tượng

Đôi khi chúng ta muốn lấy một mảng các đối tượng riêng biệt theo giá trị thuộc tính từ mảng ban đầu. Ví dụ chúng ta có một mảng đối tượng như bên dưới. Đối với mỗi đối tượng, các thuộc tính id và name nằm trong 1. 1 mối quan hệ

[
  { id: 3, name: 'Central Microscopy', fiscalYear: 2018 },
  { id: 5, name: 'Crystallography Facility', fiscalYear: 2018 },
  { id: 3, name: 'Central Microscopy', fiscalYear: 2017 },
  { id: 5, name: 'Crystallography Facility', fiscalYear: 2017 }
]

Chúng tôi muốn có được một mảng các đối tượng có cả thuộc tính id và name bởi vì các tùy chọn được chọn hiển thị tốt hơn ở định dạng

const array = [
    { id: 3, name: 'Central Microscopy', fiscalYear: 2018 },
    { id: 5, name: 'Crystallography Facility', fiscalYear: 2018 },
    { id: 3, name: 'Central Microscopy', fiscalYear: 2017 },
    { id: 5, name: 'Crystallography Facility', fiscalYear: 2017 }
  ];
const result = [];
const map = new Map();
for (const item of array) {
    if(!map.has(item.id)){
        map.set(item.id, true);    // set any value to Map
        result.push({
            id: item.id,
            name: item.name
        });
    }
}
console.log(result)

2 so với chỉ ở định dạng id hoặc name

Điều này có thể được thực hiện trong hai bước. đầu tiên, chúng tôi tạo ra một mảng gồm các id riêng biệt; . Đoạn mã như sau

Tuy nhiên, phương pháp trên không hiệu quả nếu bạn có một mảng lớn? . Ví dụ,

const array = [
    { id: 3, name: 'Central Microscopy', fiscalYear: 2018 },
    { id: 5, name: 'Crystallography Facility', fiscalYear: 2018 },
    { id: 3, name: 'Central Microscopy', fiscalYear: 2017 },
    { id: 5, name: 'Crystallography Facility', fiscalYear: 2017 }
  ];
const result = [];
const map = new Map();
for (const item of array) {
    if(!map.has(item.id)){
        map.set(item.id, true);    // set any value to Map
        result.push({
            id: item.id,
            name: item.name
        });
    }
}
console.log(result)

Hi vọng điêu nay co ich. Cảm ơn vì đã đọc

✉️ Đăng ký Email Blast hàng tuần một lần của CodeBurst, 🐦 Theo dõi CodeBurst trên Twitter, xem 🗺️ Lộ trình dành cho nhà phát triển web năm 2018 và 🕸️ Tìm hiểu về phát triển web Full Stack

Làm cách nào để lấy dữ liệu duy nhất trong js?

Để nhận các giá trị duy nhất từ ​​một mảng, bạn có thể sử dụng vòng lặp “for”, hàm tạo “Set()” và “Array. phương pháp lọc()” . Vòng lặp for là phương pháp được sử dụng phổ biến nhất để lấy các phần tử duy nhất bằng cách lặp lại mảng.

Giá trị duy nhất trong một mảng là gì?

Bạn có thể tìm các giá trị riêng biệt trong một mảng bằng hàm Distinct. Hàm Distinct lấy mảng làm tham số đầu vào và trả về một mảng khác chỉ bao gồm các phần tử duy nhất hoặc không trùng lặp . Ví dụ sau đây cho thấy cách tìm các giá trị riêng biệt trong một mảng.

Được đặt JavaScript duy nhất?

Đối tượng tập hợp là tập hợp các giá trị. Một giá trị trong Tập hợp chỉ có thể xảy ra một lần; . it is unique in the Set 's collection.

Làm cách nào để tạo một mảng duy nhất trong JavaScript?

Với JavaScript 1. 6/ ECMAScript 5, bạn có thể sử dụng phương thức lọc gốc của Mảng theo cách sau để lấy một mảng có các giá trị duy nhất. .

hàm onlyUnique(value, index, self) { return self. .

// ví dụ sử dụng. var myArray = ['a', 1, 'a', 2, '1'];