Tutorial JS

JS RUMAH Pengenalan JS JS Dimana Keluaran JS Pernyataan JS Sintaks JS Komentar JS Variabel JS JS Let JS Const Operator JS JS Aritmatika Tugas JS Tipe Data JS Fungsi JS Objek JS Acara JS String JS Metode String JS Pencarian String JS Template String JS Nomor JS Metode Nomor JS JS Array Metode Array JS Sortir Array JS Iterasi Array JS JS Array Const Tanggal JS Format Tanggal JS Metode Dapatkan Tanggal JS Metode Penetapan Tanggal JS JS Matematika JS Acak JS Boolean Perbandingan JS Ketentuan JS Beralih JS JS Loop Untuk JS Loop Untuk Masuk JS Loop Untuk Of JS Loop Sementara Istirahat JS JS Iterable JS Set Peta JS Tipe JS Konversi Tipe JS JS Bitwise JS RegExp Kesalahan JS Lingkup JS Pengangkatan JS Mode Ketat JS JS Kata Kunci ini Fungsi Panah JS Kelas JS JS JSON Debug JS Panduan Gaya JS Praktik Terbaik JS Kesalahan JS Kinerja JS Kata-kata Cadangan JS

Versi JS

Versi JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Tepi Sejarah JS

Objek JS

Definisi Objek Properti Objek Metode Objek Tampilan Objek Aksesor Objek Konstruktor Objek Prototipe Objek Obyek Iterable Set Objek Peta Objek Referensi Objek

Fungsi JS

Definisi Fungsi Parameter Fungsi Panggilan Fungsi Panggilan Fungsi Fungsi Terapkan Penutupan Fungsi

Kelas JS

Perkenalan Kelas Warisan Kelas Kelas Statis

JS Asinkron

Panggilan Balik JS JS Asinkron JS Janji JS Async/Menunggu

JS HTML DOM

Pengenalan DOM Metode DOM Dokumen DOM Elemen DOM HTML DOM Formulir DOM CSS DOM Animasi DOM Acara DOM Pendengar Acara DOM Navigasi DOM Node DOM Koleksi DOM Daftar Node DOM

JS Browser BOM

Jendela JS Layar JS Lokasi JS Sejarah JS JS Navigator Peringatan Munculan JS Waktu JS JS Cookies

JS Web API

Pengantar API Web API Formulir Web API Riwayat Web API Penyimpanan Web API Pekerja Web API Pengambilan Web API Geolokasi Web

JS AJAX

Pengenalan AJAX AJAX XMLHttp Permintaan AJAX Tanggapan AJAX File XML AJAX AJAX PHP AJAX ASP Basis Data AJAX Aplikasi AJAX Contoh AJAX

JS JSON

Perkenalan JSON Sintaks JSON JSON vs XML Tipe Data JSON Penguraian JSON Stringify JSON Objek JSON Array JSON Server JSON JSON PHP JSON HTML JSON JSONP

JS vs jQuery

Pemilih jQuery jQuery HTML jQuery CSS jQuery DOM

Grafik JS

Grafik JS JS Kanvas JS Plotly JS Chart.js Bagan Google JS JS D3.js

Contoh JS

Contoh JS JS HTML DOM Masukan HTML JS Objek HTML JS Acara HTML JS JS Browser Editor JS Latihan JS kuis JS Sertifikat JS

Referensi JS

Objek JavaScript Objek DOM HTML


Kesalahan Umum JavaScript


Bab ini menunjukkan beberapa kesalahan umum JavaScript.


Tidak Sengaja Menggunakan Operator Penugasan

Program JavaScript dapat menghasilkan hasil yang tidak diharapkan jika seorang programmer secara tidak sengaja menggunakan operator penugasan ( =), alih-alih operator perbandingan ( ==) dalam pernyataan if.

ifPernyataan ini kembali false(seperti yang diharapkan) karena x tidak sama dengan 10:

let x = 0;
if (x == 10)

ifPernyataan ini kembali true(mungkin tidak seperti yang diharapkan), karena 10 benar:

let x = 0;
if (x = 10)

ifPernyataan ini kembali false(mungkin tidak seperti yang diharapkan), karena 0 salah:

let x = 0;
if (x = 0)

Tugas selalu mengembalikan nilai tugas.


Mengharapkan Perbandingan Longgar

Dalam perbandingan biasa, tipe data tidak masalah. Pernyataan ini ifmengembalikan true:

let x = 10;
let y = "10";
if (x == y)

Dalam perbandingan yang ketat, tipe data memang penting. Pernyataan ini ifmengembalikan false:

let x = 10;
let y = "10";
if (x === y)

Adalah kesalahan umum untuk melupakan bahwa switchpernyataan menggunakan perbandingan ketat:

Ini case switchakan menampilkan peringatan:

let x = 10;
switch(x) {
  case 10: alert("Hello");
}

Ini case switchtidak akan menampilkan peringatan:

let x = 10;
switch(x) {
  case "10": alert("Hello");
}


Penambahan & Penggabungan yang Membingungkan

Penambahan adalah tentang menambahkan angka .

Penggabungan adalah tentang menambahkan string .

Dalam JavaScript kedua operasi menggunakan +operator yang sama.

Karena itu, menambahkan angka sebagai angka akan menghasilkan hasil yang berbeda dari menambahkan angka sebagai string:

let x = 10;
x = 10 + 5;       // Now x is 15

let y = 10;
y += "5";        // Now y is "105"

Saat menambahkan dua variabel, mungkin sulit untuk mengantisipasi hasilnya:

let x = 10;
let y = 5;
let z = x + y;     // Now z is 15

let x = 10;
let y = "5";
let z = x + y;     // Now z is "105"

Kesalahpahaman Mengambang

Semua angka dalam JavaScript disimpan sebagai 64-bit angka Floating point (Floats).

Semua bahasa pemrograman, termasuk JavaScript, memiliki kesulitan dengan nilai floating point yang tepat:

let x = 0.1;
let y = 0.2;
let z = x + y            // the result in z will not be 0.3

Untuk mengatasi masalah di atas, ada baiknya mengalikan dan membagi:

Contoh

let z = (x * 10 + y * 10) / 10;       // z will be 0.3

Memecahkan String JavaScript

JavaScript akan memungkinkan Anda untuk memecah pernyataan menjadi dua baris:

Contoh 1

let x =
"Hello World!";

Tetapi, melanggar pernyataan di tengah string tidak akan berfungsi:

Contoh 2

let x = "Hello
World!";

Anda harus menggunakan "garis miring terbalik" jika Anda harus mematahkan pernyataan dalam sebuah string:

Contoh 3

let x = "Hello \
World!";

Salah Tempatkan Titik Koma

Karena titik koma yang salah tempat, blok kode ini akan dieksekusi terlepas dari nilai x:

if (x == 19);
{
  // code block 
}

Melanggar Pernyataan Pengembalian

Ini adalah perilaku JavaScript default untuk menutup pernyataan secara otomatis di akhir baris.

Karena itu, kedua contoh ini akan mengembalikan hasil yang sama:

Contoh 1

function myFunction(a) {
  let power = 10 
  return a * power
}

Contoh 2

function myFunction(a) {
  let power = 10;
  return a * power;
}

JavaScript juga akan memungkinkan Anda untuk memecah pernyataan menjadi dua baris.

Karena itu, contoh 3 juga akan mengembalikan hasil yang sama:

Contoh 3

function myFunction(a) {
  let
  power = 10; 
  return a * power;
}

Tapi, apa yang akan terjadi jika Anda mematahkan pernyataan return menjadi dua baris seperti ini:

Contoh 4

function myFunction(a) {
  let
  power = 10; 
  return
  a * power;
}

Fungsi akan kembali undefined!

Mengapa? Karena JavaScript mengira yang Anda maksud:

Contoh 5

function myFunction(a) {
  let
  power = 10; 
  return;
  a * power;
}

Penjelasan

Jika pernyataan tidak lengkap seperti:

let

JavaScript akan mencoba melengkapi pernyataan dengan membaca baris berikutnya:

power = 10;

Tapi karena pernyataan ini selesai:

return

JavaScript akan secara otomatis menutupnya seperti ini:

return;

Ini terjadi karena pernyataan penutup (pengakhiran) dengan titik koma adalah opsional dalam JavaScript.

JavaScript akan menutup pernyataan kembali di akhir baris, karena itu adalah pernyataan yang lengkap.

Jangan pernah melanggar pernyataan pengembalian.


Mengakses Array dengan Indeks Bernama

Banyak bahasa pemrograman mendukung array dengan indeks bernama.

Array dengan indeks bernama disebut array asosiatif (atau hash).

JavaScript tidak mendukung array dengan indeks bernama.

Dalam JavaScript, array menggunakan indeks bernomor :  

Contoh

const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length;       // person.length will return 3
person[0];           // person[0] will return "John"

Dalam JavaScript, objek menggunakan indeks bernama .

Jika Anda menggunakan indeks bernama, saat mengakses array, JavaScript akan mendefinisikan ulang array menjadi objek standar.

Setelah pendefinisian ulang otomatis, metode array dan properti akan menghasilkan hasil yang tidak terdefinisi atau salah:

Contoh:

const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length;      // person.length will return 0
person[0];          // person[0] will return undefined

Mengakhiri Definisi dengan Koma

Tanda koma dalam definisi objek dan array legal di ECMAScript 5.

Contoh Objek:

person = {firstName:"John", lastName:"Doe", age:46,}

Contoh Array:

points = [40, 100, 1, 5, 25, 10,];

PERINGATAN !!

Internet Explorer 8 akan macet.

JSON tidak mengizinkan tanda koma.

JSON:

person = {"firstName":"John", "lastName":"Doe", "age":46}

JSON:

points = [40, 100, 1, 5, 25, 10];

Tidak terdefinisi Bukan Null

Objek JavaScript, variabel, properti, dan metode dapat berupa undefined.

Selain itu, objek JavaScript kosong dapat memiliki nilai null.

Ini bisa membuatnya sedikit sulit untuk menguji apakah suatu objek kosong.

You can test if an object exists by testing if the type is undefined:

Example:

if (typeof myObj === "undefined") 

But you cannot test if an object is null, because this will throw an error if the object is undefined:

Incorrect:

if (myObj === null) 

To solve this problem, you must test if an object is not null, and not undefined.

But this can still throw an error:

Incorrect:

if (myObj !== null && typeof myObj !== "undefined") 

Because of this, you must test for not undefined before you can test for not null:

Correct:

if (typeof myObj !== "undefined" && myObj !== null)