Destructuring arrays

const [var1, var2, var3] = array;

const colors = ['red', 'green', 'blue'];

const [firstColor, secondColor, thirdColor] = colors;

console.log(firstColor); // red
console.log(secondColor); // green
console.log(thirdColor); // blue

const numbers = [10, 20];
const [a, b] = numbers;
console.log(a); // 10
console.log(b); // 20

const colors = ['red', 'green', 'blue'];
const [first, second] = colors;
console.log(first);  // red
console.log(second); // green

const userData = ['Yasin', 'Programmer', 'Egypt'];

const [name, job, country] = userData;

console.log(`Name: ${name}, Job: ${job}, Country: ${country}`);

const numbers = [1, 2, 3, 4];

const [first, , third] = numbers;

console.log(first); // 1
console.log(third); // 3

const letters = ['A', 'B', 'C', 'D'];
const [, , , last] = letters;
console.log(last); // D

const fruits = ['apple'];

const [firstFruit, secondFruit = 'banana'] = fruits;

console.log(firstFruit);  // apple
console.log(secondFruit); // banana (لأنه لم يتم تحديد عنصر ثاني)

const [a = 5, b = 10] = [undefined];
console.log(a); // 5
console.log(b); // 10

const [x = 'default', y = 'fallback'] = ['real'];
console.log(x); // real
console.log(y); // fallback

let a = 10;
let b = 20;

[a, b] = [b, a];

console.log(a); // 20
console.log(b); // 10

let a = 1, b = 2;
[a, b] = [b, a];
console.log(a); // 2
console.log(b); // 1

let x = 'left', y = 'right';
[x, y] = [y, x];
console.log(x); // right
console.log(y); // left

const names = ['Ali', 'Omar', 'Sami', 'Yasin'];

const [first, ...rest] = names;

console.log(first); // Ali
console.log(rest);  // ['Omar', 'Sami', 'Yasin']

const [first, ...rest] = [1, 2, 3, 4];
console.log(first); // 1
console.log(rest);  // [2, 3, 4]

const [lang1, lang2, ...otherLangs] = ['HTML', 'CSS', 'JS', 'PHP', 'Python'];
console.log(otherLangs); // ['JS', 'PHP', 'Python']

function printNames(arr) {
  const first = arr[0];
  const second = arr[1];
  console.log(first, second);
}

//////////////////////

function printNames([first, second]) {
  console.log('First:', first);
  console.log('Second:', second);
}

printNames(['Ahmed', 'Sara']);

const [first, ...rest] = [1, 2, 3, 4];
console.log(first); // 1
console.log(rest);  // [2, 3, 4]

const [lang1, lang2, ...otherLangs] = ['HTML', 'CSS', 'JS', 'PHP', 'Python'];
console.log(otherLangs); // ['JS', 'PHP', 'Python']

const points = [[1, 2], [3, 4], [5, 6]];

for (const [x, y] of points) {
  console.log(`X: ${x}, Y: ${y}`);
}

const entries = ['a', 'b', 'c'];

for (const [index, value] of entries.entries()) {
  console.log(index, value);
}

const pairs = [[1, 2], [3, 4], [5, 6]];

for (const [x, y] of pairs) {
  console.log(x + y);
}

const data = [[1, 2], [3, 4]];
const [[a1, b1], [a2, b2]] = data;
console.log(a1, b1, a2, b2); // 1 2 3 4

const users = [['Yasin', 25], ['Ali', 30]];
const [[name1, age1], [name2, age2]] = users;
console.log(name1, age2); // Yasin 30

function getCoords() {
  return [5, 10];
}

const [x, y] = getCoords();
console.log(x, y); // 5 10

function splitName(fullName) {
  return fullName.split(' ');
}

const [first, last] = splitName('Yasin Ahmed');
console.log(first); // Yasin
console.log(last);  // Ahmed

function draw([x = 0, y = 0] = []) {
  console.log(`x: ${x}, y: ${y}`);
}

draw();       // x: 0, y: 0
draw([5]);    // x: 5, y: 0

function init([lang = 'JavaScript', level = 'Beginner'] = []) {
  console.log(`${lang} - ${level}`);
}

init();                  // JavaScript - Beginner
init(['Python']);        // Python - Beginner
init(['HTML', 'Pro']);   // HTML - Pro