Tips Array di dalam JavaScript Bahagian 1

<Tutorial >

Salam. Setuju tak yang mana Array dalah sesuatu yang wajib kita tahu? Array berada di mana-mana. Tak kira la apa programming language yang kau guna, pasti kita akan berdepan dengan Array. Post ini aku akan kongsikan beberapa tips untuk mengendali Array. Kau tak perlukan 3rd party library untuk mencapai sesuatu dengan Array.

Destructure array

Digunakan untuk kita extract element dari array JS. Secara tradisional, kita akan gunakan index array itu untuk extract 1 element dari array JS. Contoh di bawah:

const haiwan = ["ayam", "kucing", "lembu"];
const ayam = haiwan[0];
console.log(ayam); // "ayam"
const kucing = haiwan[1];
console.log(kucing); // "kucing"
const lembu = haiwan[2];
console.log(lembu); // "lembu"

Dengan adanya desctructure Array mulai dari ES6 (aku rasa la mula di version ni), nak extract element dari array jadi lebih mudah”

const [ayam, , lembu] = ["ayam", "kucing", "lembu"];
console.log(ayam); // "ayam"
console.log(lembu); // "lembu"

Salin array

Seperti yang kita tahu, array & object di JavaScript bukanlah primitive data type tetapi complex data type. Jadi setiap variable baharu yang di ‘assign’ adalah reference pointer kepada variable asas:

// primitive data type
let a = "ayam";
let b = a;
console.log(b); // "ayam"
b = "lembu";
console.log(a); // "ayam"
console.log(b); // "lembu"
// complex data type;
let a = ["a", "b", "c"];
let b = a;
b[1] = "z";
console.log(a); // ["a", "z", "c"];
console.log(b); // ["a", "z", "c"];

Jadi untuk salin value pada complex data type secara betul (bukan hanya reference pada variable asal) adalah dengan menggunakan spread operator:

let a = ["a", "b", "b" "c"];
let b = [...a];
b[1] = "z";
console.log(a); // ["a", "b", "b" "c"];
console.log(b); // ["a", "z", "b", "c"];

Salin array dengan value yang unik

let a = ["a", "b", "b" "c"];
let b = [...new Set(a)];
console.log(a); // ["a", "b", "b" "c"];
console.log(b); // ["a", "b", "c"];

Setakat ini saja tips untuk post kali ini. Part 2 akan menyusul secepat mungkin 🙂

Belanja saya kopi

Artikel lain

Fahami React Context API

Sebagai developer reactjs yang baharu macam aku, aku selalu gunakan teknik prop drilling untuk pass prop ke child component yang aku buat. Cara ini tak bagus kalau projek kita itu adalah projek yang besar. Aku tahu mengenai kewujudan react context API atau state management library lain seperti redux, mobx, recoil dan banyak lagi library untuk… Continue reading Fahami React Context API

Asas Node.js – Built-in module

Dalam Node.js terdapat tidaklah terlalu banyak built-in module. Tapi aku tak akan bincangkan kesemua module tersebut. Aku hanya akan bincangkan beberapa built-in module yang agak penting & digunakan agak kerap ketika pembangunan aplikasi node.js. Antaranya adalah: Path module OS module File System Module Events Module HTTP Module Path module Digunakan untuk handle file path. Contohnya… Continue reading Asas Node.js – Built-in module