مرکزی مواد پر جائیں
ماڈیول 3 · سبق 3 از 4کورس میں 11/32~12 min
ماڈیول اسباق (3/4)

تباہی اور پھیلاؤ

ایک ہی خاندان کے دو بہن بھائی نحو، ES6 کے ذریعے متعارف کرائے گئے اور اب روزانہ جدید جے ایس لکھنے والے کسی کے لئے روٹی:

  • ڈیسٹرکچرنگ: ایک ہی میں صفوں/آبجیکٹس سے متعدد قدریں نکالیں۔ لائن
  • اسپریڈ ...: ایک صف یا کسی چیز کو دوسرے کے اندر "پھیلتا" ہے۔

وہ مل کر کوڈ کو کہیں زیادہ جامع اور پڑھنے کے قابل بناتے ہیں۔

آبجیکٹ کی تخریب کاری

بلند آواز سے پڑھیں: "مستقل nome اور eta کی اقدار کے ساتھ بنائیں utente" کی اسی نام کی خصوصیات۔

JS
const utente = { nome: 'Anna', eta: 28, ruolo: 'admin' };

const { nome, eta } = utente;
console.log(nome); // 'Anna'
console.log(eta); // 28

نام بدلنا

کلید کے بعد : newName شامل کریں:

JS
const { nome: n, eta: years } = utente;
// creates the variables n and years

پہلے سے طے شدہ قدر

اگر پراپرٹی غائب ہے (یا undefined ہے)، ڈیفالٹ استعمال کیا جاتا ہے:

JS
const { ruolo = 'reader', telefono = 'n/d' } = utente;
// ruolo = 'admin' (present), telefono = 'n/d' (missing)

صف کی تباہی

یہ پوزیشن کے مطابق کام کرتا ہے:

JS
const colori = ['rosso', 'verde', 'blu'];
const [primo, secondo] = colori;
// primo = 'rosso', secondo = 'verde'

const [, , terzo] = colori; // skips the first two
const [a, ...resto] = colori; // a = 'rosso', resto = ['verde','blu']

صفوں پر پھیلائیں۔

...arr عناصر کو "پھیلتا" ہے:

JS
const a = [1, 2, 3];
const b = [4, 5];

const unione = [...a, ...b]; // [1, 2, 3, 4, 5]
const copia = [...a]; // shallow copy of a
const conPiu = [0, ...a, 4]; // [0, 1, 2, 3, 4]

اشیاء پر پھیلانا

بعد کی کلیدیں اوور رائڈ پہلے والی کلیدیں — ناقابل تغیر اپ ڈیٹس کے لیے بنیادی:

JS
const utente = { nome: 'Anna', eta: 28 };

const aggiornato = { ...utente, eta: 29 };
// { nome: 'Anna', eta: 29 } — utente was NOT touched

const con = { ...utente, attivo: true };
// { nome: 'Anna', eta: 28, attivo: true }

اسے آزمائیں

ورزش#js.m3.l3.e1
کوششیں: 0لوڈ ہو رہا ہے…

`صارف = { نام: 'مارکو'، عمر: 34، شہر: 'Torino' }`، صرف `نام` اور `city` کو دو مستقلوں میں نکالنے اور `\`${name} di ${city}\`` (مساوات 'Marco di Torino') کو واپس کرنے کے لئے destructuring کا استعمال کریں۔

ایڈیٹر لوڈ ہو رہا ہے…
اشارہ دکھائیں۔

const {نام، شہر } = صارف؛ پھر ایک ٹیمپلیٹ لفظی دو اقدار کے ساتھ۔

3 کوششوں کے بعد حل دستیاب ہے۔

ورزش کا جائزہ لیں۔

ورزش#js.m3.l3.e2
کوششیں: 0لوڈ ہو رہا ہے…

دی گئی `base = { تھیم: 'ڈارک'، سائز: 'md' }`، ایک نئی ایک جیسی آبجیکٹ واپس کریں لیکن اسپریڈ کا استعمال کرتے ہوئے `size` کو 'lg' پر سیٹ کریں۔

ایڈیٹر لوڈ ہو رہا ہے…
اشارہ دکھائیں۔

آخری اظہار اعتراض ہونا چاہیے۔ اسے قوسین میں لپیٹیں: ({ ...بیس، ... })۔

3 کوششوں کے بعد حل دستیاب ہے۔