Αποδόμηση Αντικειμένου σε

Σχετικά με την έννοια Αποδόμηση Αντικειμένου

Η αποδόμηση αντικειμένων είναι ένας συνοπτικός τρόπος εξαγωγής ιδιοτήτων από ένα αντικείμενο. Η σύνταξή της μοιάζει με μια έκφραση κυριολεκτικού αντικειμένου, αλλά βρίσκεται στην αριστερή πλευρά της ανάθεσης αντί για τη δεξιά.

const weather = {
  sun: '☀️',
  sun_behind_small_cloud: '🌤️',
  sun_behind_cloud: '⛅',
  sun_behind_large_cloud: '🌥️',
  sun_behind_rain_cloud: '🌦️',
  cloud: '☁️',
  cloud_with_rain: '🌧️',
  cloud_with_snow: '🌨️',
  cloud_with_lightning: '🌩️',
  cloud_with_lightning_and_rain: '⛈️',
};

const { sun, cloud, cloud_with_lightning } = weather;

sun;
// => '☀️'

cloud;
// => '☁️'

cloud_with_lightning;
// => '🌩️'

Μετονομασία στην ανάθεση

Η σύνταξη μπορεί να εξάγει τις ιδιότητες με το κλειδί τους, όπως sun, cloud και cloud_with_lightning, αλλά μπορεί επίσης να διαλέξει ένα διαφορετικό όνομα για τη μεταβλητή:

const { sun: sunny, cloud: cloudy, cloud_with_rain: rainy } = weather;

typeof cloud_with_rain;
// => 'undefined'

typeof rainy;
// => 'string'

rainy;
// => 🌧️

Επίσης, δεν είναι απαραίτητο η ανάθεση να χρησιμοποιεί όλες τις τιμές.

Προεπιλεγμένες τιμές

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

const { sun = '🌞', tornado = '🌪️', cloud_with_snow: snowy = '❄️' } = weather;

sun;
// => '☀️'

tornado;
// => '🌪️'

snowy;
// => '🌨️'

Παρατηρούμε τα εξής:

• Το sun εξήχθη από το αντικείμενο weather χωρίς να αντικατασταθεί, αφού υπάρχει στο αντικείμενο weather,
• Το tornado δεν υπάρχει στο αντικείμενο weather, οπότε χρησιμοποιήθηκε η προεπιλεγμένη τιμή,
• Το cloud_with_snow εξήχθη ως η μεταβλητή snowy, χωρίς να αντικατασταθεί, αφού το cloud_with_snow υπάρχει στο αντικείμενο weather.

Αποδόμηση παραμέτρων συνάρτησης

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

function weatherReport({ sun }) {
  console.log(sun);
}

weatherReport(sun);
// => '☀️'

Αποδόμηση στην επανάληψη for of

Όταν διατρέχεις έναν array (ή άλλο iterable) και τα στοιχεία του είναι αντικείμενα, μπορείς να κάνεις αποδόμηση μέσα στην εντολή for (...) of iterable:

const { sun: sunny, cloud: cloudy, cloud_with_rain: rainy } = weather;

const prediction = [
  {
    chance: 0.8,
    weather: sunny,
    description: 'There is a 80% chance it will remain sunny.',
  },
  {
    chance: 0.15,
    weather: cloudy,
    description:
      'There is a 15% chance the clouds will keep the sun from poking through.',
  },
  {
    chance: 0.05,
    weather: rainy,
    description: 'There is a small chance of rain.',
  },
];

for (const { weather: symbol, description } of prediction) {
  console.log(`${symbol}: ${description}`);
}

//  '☀️: There is a 80% chance it will remain sunny.'
// '☁️: There is a 15% chance the clouds will keep the sun from poking through.'
// '🌧️: There is a small chance of rain.'

Σχετικές έννοιες

array-destructuring rest-and-spread