Java Script Notes

JavaScript Spread Operator & Array Methods

Spread Operator (...) allows you to copy or merge arrays and objects easily.
Syntax:

• [...array]
• {...object}

Spread Operator Demo

const x = [10, 20, 30, 40, 50];
const y = [...x]; // copying x to y
document.write(`X ${x}`);
document.write(`Y ${y}`);

Appending Multiple Arrays

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const arr3 = [7, 8, 9];
const appendedArray = [...arr1, ...arr2, ...arr3];
document.write(`Appended Array: ${appendedArray}`);

Merging Language Arrays

let ft = ['html','css'];
let bt = ['js','java'];
let lang = ['php','python'];
let all = [...ft, ...bt, ...lang];
document.write(`All ${all}`);

Array Destructuring

Destructuring extracts values from arrays or objects into variables.
Syntax:

let [a, b, c] = [10, 20, 30];
document.write(`A ${a}`);
document.write(`B ${b}`);
document.write(`C ${c}`);

Destructuring Example

const z = ['html','css','js','java','php','python'];
let [i, j, k, l, m, n] = z;
document.write(`I ${i} J ${j} K ${k} L ${l} M ${m} N ${n}`);
let [p, , , ...q] = z;
document.write(`P ${p} Q ${q}`);

Swapping Variables

let v1 = 100, v2 = 200;
[v2, v1] = [v1, v2];
document.write(`V1 ${v1} V2 ${v2}`);

Array Methods

• Push & Pop
• Unshift & Shift
• Includes, IndexOf, LastIndexOf
• Sort, Reverse, Join, Splice, Slice

Push & Pop

const arr = [];
arr.push(10, 20, 30, 40, 50);
let d = arr.pop();
arr.pop();
arr.push(11, 22, 33);

Unshift & Shift

const arr4 = [];
arr4.unshift(10, 20, 30, 40, 50);
arr4.shift();

Array Methods Demo

• includes()
• indexOf()
• lastIndexOf()
• sort()
• reverse()
• join()
• splice()
• slice()

const arr7 = [10,20,30,40,50,60,70,30,93];
let str = "notepad plus plus";
arr7.includes(20);
arr7.indexOf(30);
arr7.lastIndexOf(30);
arr7.reverse();
arr7.sort();
arr7.join(" % ");
arr7.splice(3,3);
arr7.splice(4,2,101,202);
arr7.splice(1,0,111,222,333);
arr7.slice(0,6);