Pages

Jumat, 07 September 2012

Teknik Shorthand JavaScript

Menyingkat script, memperkecil ukuran kode, ... mempercepat loading

Kita dapat menggunakan sejumlah pernyataan JavaScript dengan metode singkatan untuk memperkecil size kode, setidaknya size kode kita berkurang beberapa byte yang akan memberikan keuntungan mempercepat waktu loading aplikasi kita :)

Perlu diketahui, metode singkatan atau "shorthand" dalam JavaScript (maupun ECMAScript sebagai induk resmi dari Javascript) bukanlah cara yang resmi. Cara ini murni merupakan metode yang ditemukan oleh programmer.

Mari kita mulai, ...

1. Cara Singkat Deklarasi Variable

Metode singkat deklarasi variable dalam javascript ini juga dapat kita temukan dalam banyak bahasa lainnya. Metode ini dapat menghemat banyak waktu dan ruang ketika mendeklarasikan beberapa variabel sekaligus.

Metode Longhand:
var x;
var y;
var z = 3;

Metode Shorthand:
var x, y, z = 3;


2. Cara Singkat Deklarasi Object Array

Metode singkat mendeklarasikan object array dalam satu baris.

Metode Longhand:
var a = new Array();
a[0] = "myString1";
a[1] = "myString2";
a[2] = "myString3";

Metode Shorthand:
var a = ["myString1", "myString2", "myString3"];


3. Cara Singkat Deklarasi Object Array Asosiatif

Bagaimana dengan array asosiatif? Hampir sama dengan cara diatas, array asosiatif juga bisa kita singkat. Contoh seperti berikut...

Metode Longhand:
var mySkill = new Array();
mySkill['Web Programming'] = 'PHP';
mySkill['Desktop Programming'] = 'Java';
mySkill['Database'] = 'MySQL';

Metode Shorthand:
var mySkill= {
    'Web Programming': 'PHP',
    'Desktop Programming': 'Java',
    'Database': 'MySQL'
};


4. If true … else

Ini adalah metode penghemat kode untuk ketika kita ingin melakukan test kondisi. Kita dapat mempersingkat test kondisi satu dengan yang lain dengan menggunakan operator ternary.

Metode Longhand:
var big;
if (x > 10) {
    big = true;
} else {
    big = false;
}

Metode Shorthand:
var big = (x > 10) ? true : false;

Cara singkat untuk test kondisi bercabang (nested if):
var big = (x > 10);
//Contoh kondisi bercabang
x = 3;
var big = (x > 10) ? "besar dari 10" : (x < 5) ? "kurang dari 5" : "antara 5 dan 10";


5. Null, Undefined

Ketika membuat variabel baru kadang-kadang kita perlu memeriksa apakah variabel referensi untuk nilai itu tidak null atau undefined.

Metode Longhand:
if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
     var variable2 = variable1;
}
Metode Shorthand:
var variable2 = variable1  || '';
Bingung dengan metode singkat ini? Mungkin anda perlu membaca post saya sebelumnya Null dan Undefined pada JavaScript.


6. Membandingkan nilai Variable

Cara ini untuk membandingkan nilai variable,.. Contoh kode dibawah ini adalah kode untuk mengembalikan salah satu nilai variable tersebut bergantung pada ada atau tidaknya nilai_awal.

Metode Longhand:
if (!nilai_awal) {
    return nilai_awal;
} else{
   return nilai_akhir('100');
}
Metode Shorthand:
return nilai_awal || nilai_akhir('100');
Baca selengkapnya...