Media Pengembangan Web & App | by APPKEY

Pembuatan AplikasiBuat yang Belum Familiar! Ini 13 Style Guide Javascript...

Buat yang Belum Familiar! Ini 13 Style Guide Javascript Versi Google

-

JavaScript adalah salah satu bahasa pemrograman yang paling banyak digunakan saat ini. Untuk memudahkan Anda yang masih awam, Google mengeluarkan 13 Style Guide dalam mengoperasikan JavaScript. Style Guide ini dapat membantu Anda agar tidak menghabiskan banyak waktu dalam menulis Javascript.

Artikel Terkait  10 Hal yang Perlu Dipertimbangkan Saat Membangun Blog WordPress

1. Menggunakan Spasi.

Guide pertama Javascript mengharuskan Anda menggunakan dua spasi, alih-alih empat spasi untuk indentasi. Karakter spasi horizontal ASCII (0x20) adalah satu-satunya karakter spasi yang muncul pada file mana pun. Hal ini menandakan, tab tidak digunakan untuk indentasi.

// tidak seperti ini
function foo() {
∙∙∙∙let name;
}

// tidak juga begini
function bar() {
∙let name;
}

// yang benar begini
function baz() {
∙∙let name;
}

2. Wajib menambahkan titik koma (semicolon).

semicolonTitik koma harus ditambahkan pada setiap akhir pernyataan. Jangan hanya mengandalkan penyisipan titik koma secara otomatis. Selama ini penggunaan titik koma pada setiap akhir pernyataan di JavaScript masih menjadi perdebatan. Namun, Google tetap menegaskan untuk konsisten menggunakan titik koma pada akhiran kode. Berikut contoh penerapan titik koma pada JavaScript.

// jangan lakukan ini
let luke = {}
let leia = {}
[luke, leia].forEach(jedi => jedi.father = 'vader')

// lakukan seperti ini
let luke = {};
let leia = {};
[luke, leia].forEach((jedi) => {
jedi.father = 'vader';
});

3. Penggunaan Modul ES yang perlu diperhatikan.

Modul ES terdiri dari export dan import. Berikut masing-masing penjelasannya:

a. Import

Pernyataan import tidak boleh terhimpit baris dan dikecualikan untuk batas 80 kolom. File modul ES harus menggunakan pernyataan import untuk mengimpor file modul ES lainnya. Jangan lakukan goog.requires modul ES lainnya.

import’./sideeffects.js’;
import * as goog from’../closure/goog/goog.js’;
import * as parent from’../parent.js’;
import {name} from ‘./sibling.js’;

Selain itu, file ekstensi .js harus disertakan pada import paths.

import’../directory/file’;
import’../directory/file.js’;

Perlu diperhatikan, Anda tidak dapat mengimport file yang sama berulang kali. Hal ini akan membuat Anda kesulitan untuk menentukan agregat import dari suatu file.

b. Export

jsSimbol hanya akan diekspor apabila digunakan di luar modul. Simbol modul lokal yang tidak diekspor dinyatakan dengan @private serta tidak diakhiri dengan underscore. Gunakan export yang telah dinamai pada seluruh kode. Anda dapat menerapkan kata kunci ekspor ke pernyataan atau menggunakan sintaksis ekspor {name}. Jangan menggunakan export default. Anda harus memberi nama pada modul yang diimpor, jika tidak, dapat menyebabkan ketidakkonsistenan dalam penamaan di seluruh modul.

Contoh penamaan export

//Use named exports
export class foo {...}

atau

//Alternate style name exports
Class Foo {...}
Export {Foo};

Perlu diperhatikan, Anda tidak dapat melakukan export pada container yang berisi kelas atau objek dengan metode dengan metode atau properti statis hanya untuk namespacing. Variabel yang akan dilakukan export juga tidak boleh dimutasi di luar inisialisasi modul. Terdapat alternatif lain jika perlu dilakukan.

//Good: Rather than export the mutable variables foo and mutate foo directly,
//instead make them module scoped and export a getter for foo and export a getter for foo and wrapper for
//mutateFooFunc
let /**number*/foo=0
let /**function(number):number*/mutateFooFunc=foo=>foo=1:
/**@return {number} */
export function get Foo(){
return foo;
}
export function mutateFoo(){
foo=mutateFooFunc(foo);
}
/** @param {function(number): number} mutateFoo */
export function setMutateFoo(mutateFoo) {
mutateFooFunc = mutateFoo;

4. Horizontal alignment tidak disarankan.

Horizontal Alignment adalah tindakan menambah sejumlah variabel spasi tambahan dalam kode untuk membuat token tertentu muncul tepat di bawah token tertentu lainnya pada baris sebelumnya. Penggunaan horizontal alignment diizinkan, namun Google Style tidak menyarankan penggunaan ini pada Javascript. Menurut JavaScript Guide versi Google, tidak diperlukan tempat-tempat yang sudah digunakan.

// tidak
{
tiny:   42,
longer: 435,
};
// ya
{
tiny: 42,
longer: 435,
};

5. Jangan menggunakan kata kunci ‘var’

Banyak orang masih menggunakan ‘var’ dalam kode. Namun, JavaScript Style Guide versi Google menyarakan menggunakan semua variabel lokal dengan ‘const’ atau ‘let’. Gunakan ‘const’ secara default, terkecuali variabel tersebut perlu ditetapkan kembali.

// tidak
var example = 42;
// iya
let example = 42;

6. Penggunaan arrow function lebih disarankan

Penulisan arrow function memiliki beberapa kelebihan seperti; lebih ringkas dan memiliki nilai estetika ketika dipandang. Arrow function juga bertujuan untuk menyederhanakan penulisan dibanding menulis kata kunci ‘function()’.

// tidak
[1, 2, 3].map(function (x) {
const y = x + 1;
return x * y;  });

// iya
[1, 2, 3].map((x) => {
const y = x + 1;
return x * y;
});

7. Gunakan String Template

Pada penggabungan string kompleks sebaiknya gunakan template string (‘’) terlebih jika beberapa literal string terlibat.

// tidak
function sayHi(name) {
return 'How are you, ' + name + '?';
}
// tidak
function sayHi(name) {
return ['How are you, ', name, '?'].join();
}
// tidak
function sayHi(name) {
return `How are you, ${ name }?`;
}
// ya
function sayHi(name) {
return `How are you, ${name}?`;
}

8. Untuk string yang panjang jangan gunakan line continuations

Mengakhiri baris di dalam string literal dengan backslash, jangan gunakan line continuations baik dalam literal string biasa maupun template. Meski dapat dilakukan pada ES5, namun hal ini dapat menyebabkan kesalahan rumit apabila ada spasi tambahan yang muncul setelah backslash.

// bad (sorry, this doesn't show up well on mobile)
const longString = 'This is a very long string that \
far exceeds the 80 column limit. It unfortunately \
contains long stretches of spaces due to how the \
continued lines are indented.';

//good
const longString = 'This is a very long string that ' +
'far exceeds the 80 column limit. It does not contain ' +
'long stretches of spaces since the concatenated ' +
'string are cleaner.';

9. Tipe lain dari ‘for loop’ yang disarankan adalah ‘for… of’

JavaScript memiliki tiga jenis ‘for’ loop. Seluruhnya dapat digunakan, namun yang lebih diutamakan adalah pengulangan ‘for-of’.

10. Hindari menggunakan ‘eval’

Sebaiknya jangan menggunakan ‘eval’ atau konstruktor ‘function(…string)’ terkecuali untuk code loader.

// bad
let obj = { a: 20, b: 30 };
let propName = getPropName();  // returns "a" or "b"
eval( 'var result = obj.' + propName );

//good
let obj = { a: 20, b: 30 };
let propName = getPropName();  // returns "a" or "b"
let result = obj[ propName ];  //  obj[ "a" ] is the same as obj.a

11. Konstanta mesti diberi nama dengan All-Upercase yang dipisah dengan underscore.

Jika Anda ingin memastikan variabel Anda tidak berubah, Anda dapat mengeceknya menggunakan dengan mengkapitalisasi nama dari konstanta. Hal ini membuat kekekalan konstanta menjadi jelas saat digunakan di seluruh kode Anda. Kecuali jika konstanta memiliki cakupan fungsi. Dalam hal ini harus ditulis dalam camelCase.

//salahconst number = 5
//benarconst NUMBER = 5

12. Satu variabel tiap pernyataan.

Setiap pernyataan variabel lokal hanya terdapat satu variabel seperti ‘let a = 1, b = 2;’ tidak digunakan.

//salah
let a = 1, b = 2, c = 3;
//benar
let a = 1;
let b = 2;
let c = 3;

13. Ingat untuk menggunakan tanda petik satu (‘)

Literal string biasa dipisahkan dengan tanda petik satu. Jika dalam sebuah string berisi karakter petik satu, gunakan template string untuk menghindari keluar dari petik.

/ bad
let directive = "No identification of self or mission."
// bad
let saying = 'Say it ain\u0027t so.';
// good
let directive = 'No identification of self or mission.';
// good
let saying = `Say it ain't so`;

Demikian 13 Style Guide Javascript versi Google yang dapat memudahkan Anda para pemula maupun professional dalam menyelesaikan kode-kode di JavaScript.  Namun, perlu diperhatikan untuk menyesuaikan Style Guide yang sesuai dengan diri Anda.


Jasa Pembuatan Aplikasi, Website dan Internet Marketing | PT APPKEY
PT APPKEY adalah perusahaan IT yang khusus membuat aplikasi Android, iOS dan mengembangkan sistem website. Kami juga memiliki pengetahuan dan wawasan dalam menjalankan pemasaran online sehingga diharapkan dapat membantu menyelesaikan permasalahan Anda.

Jasa Pembuatan Aplikasi

Jasa Pembuatan Website

Jasa Pembuatan Paket Aplikasi

Jasa Pembuatan Internet Marketing

Subscribe Sekarang

Dapatkan beragam informasi menarik tentang Website, Aplikasi, Desain, Video dan API langsung melalui email Anda. Subscribe sekarang dan terus belajar bersama kami!

Kategori

Blog Post Ranking 10

Rekomendasi 10 Aplikasi Pembuat Animasi 3D Terbaik. Ayo Cek!

Apakah Anda bercita-cita untuk menjadi seorang animator profesional? Belajar membuat animasi kini sudah menjadi hal mudah yang bisa dilakukan...

Cara Mudah Menambahkan Lokasi Alamat Bisnis Anda di Google Maps

Saat ingin hunting tempat makan atau tempat nongkrong terbaru, tak jarang beberapa dari Anda biasanya mendapatkan informasi terkini melalui...

Encoding Adalah : Proses Komunikasi Encoding dan Decoding

Jika kita dapat melihat percakapan antar komputer, mungkin akan terlihat seperti ini: "010110111011101011010010110". Bahasa ini disebut dengan biner, encoding...

Metadata Adalah? Fungsi dan Jenis-Jenis Metadata

Pernah mendengar istilah metadata? Mungkin, kita sering mendengar istilah metadata. Tetapi, banyak dari kita yang belum tahu arti dari metadata...

Cara Membuat Aplikasi di Playstore dengan Mudah

Membuat aplikasi di Playstore bisa Anda lakukan dengan mudah. Terdapat beberapa situs yang bisa membantu Anda untuk membuat aplikasi...

Pengertian Internet & Dampak Positif dan Negatif Internet

Internet mungkin bukan sesuatu yang asing lagi, sebab semua kalangan pasti tahu apa itu internet. Hanya saja jika ditanya...

10 Aplikasi Coding Android Terbaik

Ketersediaan aplikasi coding Android memang banyak dicari oleh orang-orang yang sedang atau akan memulai untuk membuat aplikasi android. Jika...

Domain Google? Apa Bedanya Dengan Domain Biasa?

Saat memutuskan untuk membuat website menjadi salah satu bentuk media digital marketing Anda dalam bersaing di zaman digital ini,...

7 Aplikasi Membuat Aplikasi Android Secara Offline

Aplikasi membuat aplikasi android saat ini banyak dicari penekun IT untuk membuat aplikasi Android secara offline tanpa harus menggunakan...

Looping Adalah Algoritma Perulangan: Berikut Contohnya

Jika anda sudah mendalami atau sedang mendalami dunia pemrograman terdapat sebuah konsep yang dapat memudahkan anda dalam menyusun struktur...

Bisnis

Online Service

Peluang Bisnis

Model Bisnis

Entrepreneurship

Uang

Ketrampilan

Outsourcing

Monetize

Pemasaran

SEO

Internet Marketing

Dasar Pemasaran

Strategi Pemasaran

Situs Web Analitik

Iklan

Teknologi

Teknologi Terbaru

AI

Komputer

Jaringan

Paling Sering dibaca
Mungkin Anda Menyukainya