Κατανόηση συνόλων σε JavaScript

Τα σύνολα είναι ένα νέο πρόσθετο στο JavaScript στο ES6. Ας το μάθουμε.

Ποια είναι τα σετ;

Πώς να τα χρησιμοποιήσω σε JavaScript;

Και ποιες μέθοδοι παρέχουν για την επίλυση προβλημάτων;

Ας μάθουμε τις απαντήσεις σε όλα τα ερωτήματα σε αυτό το σεμινάριο.

Σκηνικά

Όπως υποδηλώνει το όνομα, ένα σύνολο είναι μια συλλογή μοναδικών στοιχείων. Δεν αποθηκεύει τις επαναλαμβανόμενες τιμές.

Τα σύνολα σε JavaScript θα αποθηκεύουν τα στοιχεία με τη σειρά εισαγωγής. Έτσι, παραγγέλνονται σε JavaScript. Και θα αποθηκεύει πρωτόγονους τύπους δεδομένων ή αντικείμενα.

Ας δούμε τη σύνταξη των συνόλων σε JavaScript.

Ελπίζω να έχετε IDE για να εξασκήσετε τα παρακάτω.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(names);

const randomWord = new Set("Hiiiiiii");
console.log(randomWord);

const numbers = new Set([5, 5, 5, 2, 1, 1, 2, 3]);
console.log(numbers);

Ιδιότητες και Μέθοδοι

Τα σύνολα έχουν διαφορετικές ιδιότητες και μεθόδους που μας βοηθούν να εργαστούμε μαζί τους για την επίλυση διαφορετικών προβλημάτων. Οι ιδιότητες και οι μέθοδοι είναι τόσο απλές όσο και η δημιουργία τους. Μπορείτε εύκολα να δείτε τη λειτουργικότητα των μεθόδων με τα ίδια τα ονόματά τους. Ας τα δούμε ένα προς ένα.

  Μπορούν οι ομάδες της Microsoft να παρακολουθούν το τηλέφωνό μου;

Μέγεθος

Το μέγεθος της ιδιότητας επιστρέφει τον αριθμό των στοιχείων που υπάρχουν στο σύνολο.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(`Size: ${names.size}`);

Προσθήκη

Η μέθοδος προσθήκη χρησιμοποιείται για την προσθήκη ενός νέου στοιχείου στο σύνολο. Εάν το νέο στοιχείο υπάρχει ήδη στο σύνολο, τότε δεν θα το προσθέσει.

// empty set
const names = new Set();

names.add("John");
names.add("Harry");
names.add("Wick");
names.add("Jack");
names.add("Harry");

console.log(names);

έχει

Η μέθοδος παίρνει ένα όρισμα και επιστρέφει true αν το στοιχείο υπάρχει στο σύνολο, αλλιώς επιστρέφει false.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

console.log(names.has("Harry"));
console.log(names.has("Alley"));

διαγράφω

Όπως περιμένετε, η μέθοδος delete παίρνει ένα όρισμα και το διαγράφει από το σύνολο. Δεν εκπέμπει κανένα σφάλμα ακόμα κι αν το συγκεκριμένο όρισμα δεν υπάρχει στο σύνολο.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.delete("John");

console.log(names);

καταχωρήσεις

Οι καταχωρήσεις μεθόδου επιστρέφουν έναν επαναλήπτη που περιέχει πίνακες ζευγών κλειδιού-τιμής με τη σειρά εισαγωγής. Εδώ, το κλειδί και η τιμή είναι το ίδιο.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const entries = names.entries();

console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);

κλειδιά

Τα πλήκτρα μεθόδου επιστρέφουν έναν επαναλήπτη στοιχείων συνόλου στη σειρά εισαγωγής.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const keys = names.keys();

console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);

αξίες

Οι τιμές της μεθόδου επιστρέφουν έναν επαναλήπτη στοιχείων συνόλου με τη σειρά εισαγωγής παρόμοια με τα κλειδιά μεθόδου.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const values = names.values();

console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);

Σαφή

Η μέθοδος διαγραφή αφαιρεί όλα τα στοιχεία από το σετ.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.clear();

console.log(names);

για κάθε

Η μέθοδος forEach χρησιμοποιείται για επανάληψη πάνω από το σύνολο και λήψη όλων των στοιχείων ένα προς ένα από αυτό.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.forEach((element) => {
   console.log(element);
});

Διάφορα

Ας δούμε μια απλή εφαρμογή συνόλων με πρόγραμμα. Με δεδομένο έναν πίνακα, αφαιρέστε όλες τις διπλότυπες τιμές από αυτόν. Για να λύσουμε το πρόβλημα, μπορούμε να χρησιμοποιήσουμε την ιδιότητα set.

  21 Συχνές ερωτήσεις και απαντήσεις συνέντευξης OOP που πρέπει να γνωρίζετε σήμερα

Ας δούμε το βήμα για να το λύσουμε.

  • Αρχικοποιήστε έναν πίνακα με εικονικά δεδομένα.
  • Αρχικοποιήστε ένα κενό σύνολο.
  • Επανάληψη πάνω από τον πίνακα των στοιχείων.
    • Προσθέστε κάθε στοιχείο στο σετ.
    • Θα αφαιρέσει αυτόματα τα διπλά στοιχεία.
  • Αρχικοποιήστε έναν κενό πίνακα.
  • Επαναλάβετε το σύνολο και προσθέστε κάθε στοιχείο στον νέο πίνακα.
  • Εκτυπώστε τον νέο πίνακα.

Ελπίζω να μπορείτε να το λύσετε μόνοι σας. Εάν δυσκολεύεστε να κωδικοποιήσετε, ρίξτε μια ματιά στην παρακάτω λύση.

const arr = ["John", "Harry", "Wick", "Jack", "Harry"];

const temp = new Set();

arr.forEach((element) => {
   temp.add(element);
});

const newArr = [];

temp.forEach((element) => {
   newArr.push(element);
});

console.log(newArr);

συμπέρασμα

Τώρα, έχετε όλες τις γνώσεις που χρειάζονται για να εργαστείτε με σύνολα σε JavaScript. Μπορείτε να τα χρησιμοποιήσετε στο επόμενο έργο σας. Προχωρήστε και αξιοποιήστε κάθε κομμάτι του.

  Πώς να αντιγράψετε και να επικολλήσετε επίπεδα μεταξύ αρχείων PSD μέσω συντομεύσεων πληκτρολογίου

Καλή κωδικοποίηση 👨‍💻