7 Trik Optimasi Ampuh JavaScript Yang Perlu Kamu Ketahui

Setiap bahasa memiliki keunikan, begitu juga JavaScript, bahasa pemrograman yang paling banyak digunakan.

Postingan blog ini akan membahas beberapa trik Optimasi Generik JavaScript yang akan membantu Anda menulis kode yang lebih baik dan memastikan bahwa berikut ini bukan respons Anda saat Anda melihatnya:

1. Nilai Fallback

Tempat fallback untuk menampilkan beberapa penyesuaian.

Jika nilainya [] atau 0, gunakan logika OR || tidak memberikan hasil yang diharapkan.

Simbiosis nol akan menjadi solusi yang lebih baik?? Jika nilai yang ditentukan adalah null atau tidak ditentukan, gunakan hanya nilai fallback.

// Lengthy
let name;
if (user?.name) {
  name = user.name;
} else {
  name = "Anonymous";
}

// Shortly
const name = user?.name ?? "Anonymous";

2. Shortly For Switching

Case switch longly biasanya dimaksimalkan dengan menggunakan objek dengan tombol yang bertindak sebagai switch dan nilai yang mencoba bertindak sebagai nilai kembalian.

const dayNumber = new Date().getDay();

// Lengthy
let day;
switch (dayNumber) {
  case 0:
    day = "Sunday";
    break;
  case 1:
    day = "Monday";
    break;
  case 2:
    day = "Tuesday";
    break;
  case 3:
    day = "Wednesday";
    break;
  case 4:
    day = "Thursday";
    break;
  case 5:
    day = "Friday";
    break;
  case 6:
    day = "Saturday";
}

// Shortly
const days = [
    "Sunday",
    "Monday",
    "Tuesday",
    "Wednesday",
    "Thursday",
    "Friday",
    "Saturday",
];

// Or
const days = `Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday`.split(
    ","
);

const day = days[dateNumber];

3. Call to Function

Anda juga dapat menggunakan operator biner untuk memutuskan fungsi mana yang akan dipanggil berdasarkan kondisi.

Function call patterns harus sama atau Anda akan menghadapi kesalahan.

function f1() {
  // ...
}
function f2() {
  // ...
}

// Lengthy
if (condition) {
  f1();
} else {
  f2();
}

// Shortly
conditon ? f1() : f2();

4. Beberapa Pemeriksaan String

Sangat populer untuk memeriksa apakah sebuah string sama dengan salah satu dari beberapa nilai, yang dapat dengan cepat menjadi menjengkelkan.

Untungnya, JavaScript memiliki cara untuk membantu Anda dalam hal ini.

// Lenghty
cconst isVowel = (letter) => {
  return (
    letter === "a" ||
    letter === "e" ||
    letter === "i" ||
    letter === "o" ||
    letter === "u"
  );
};

// Shortly
const isVowel = (letter) =>

5. For-Of & For-In Loops

For-of dan For-in loop bermanfaat untuk mengulang array atau objek tanpa harus melacak indeks kunci objek secara manual.

For-of

const arr = [1, 2, 3, 4, 5];

// Lengthy
for (let i = 0; i < arr.length; i++) {
  const element = arr[i];
  // ...
}

// Shortly
for (const element of arr) {
  // ...
}

For-in

const obj = {
  a: 1,
  b: 2,
  c: 3,
};

// Lengthy
const keys = Object.keys(obj);
for (let i = 0; i < keys.length; i++) {
  const key = keys[i];
  const value = obj[key];
  // ...
}

// Shortly
for (const key in obj) {
  const value = obj[key];
  // ...
}

6. Cek Palsu

Jika Anda ingin memeriksa apakah suatu variabel adalah null, undefined, 0, false, NaN, atau string kosong, Anda dapat menggunakan operator Logical Not (!) untuk melakukannya tanpa memerlukan banyak efek.

Ini membuatnya mudah untuk memverifikasi apakah suatu variabel berisi data yang valid.

// Lengthy
const isFalsey = (value) => {
  if (
    value === null ||
    value === undefined ||
    value === 0 ||
    value === false ||
    value === NaN ||
    value === ""
  ) {
    return true;
  }
  return false;
};

// Shortly
const isFalsey = (value) => !value;

7. Operator Sekunder

Anda pasti menemukan operator ternary sebagai developer JavaScript.

Ini adalah metode yang sangat baik untuk menulis pernyataan if-else yang ringkas.

Namun, Anda dapat menggunakannya untuk menulis kode ringkas dan bahkan merangkainya untuk memeriksa beberapa kondisi.

// Lengthy
let info;
if (value < minValue) {
  info = "Value is too small";
} else if (value > maxValue) {
  info = "Value is too large";
} else {
  info = "Value is in range";
}

// Shortly
const info =
  value < minValue
    ? "Value is too small"
    : value > maxValue ? "Value is too large" : "Value is in range";

Hanya itu saja, teman-teman! Terima kasih telah meluangkan waktu untuk membaca ini.