Apa itu Javascript

Apa itu Javascript? Ini Penjelasan Selengkapnya!

Apa itu Javascript? Javascript adalah salah satu bahasa pemrograman yang paling populer dan fleksibel di dunia. bahasa pemrograman ini digunakan untuk membuat halaman web interaktif, aplikasi web, game, dan banyak lagi. Javascript juga dapat berjalan di berbagai platform, seperti browser, server, perangkat mobile, dan IoT.

Dalam artikel ini saya bahas dari apa itu javascript hingga standard librabry.

Sejarah Javascript

Apa itu javascript? Javascript pertama kali dibuat oleh Brendan Eich, seorang insinyur di Netscape, pada tahun 1995. Nama asli Javascript adalah Mocha, kemudian diubah menjadi LiveScript, dan akhirnya menjadi Javascript. Nama Javascript dipilih untuk menarik perhatian pengembang yang tertarik dengan Java, meskipun Javascript tidak memiliki hubungan langsung dengan Java.

Awalnya dirancang untuk membuat halaman web lebih dinamis dan responsif. Javascript dapat menambahkan interaksi, animasi, validasi, dan fungsi lainnya ke halaman web tanpa perlu memuat ulang halaman. Javascript juga dapat berkomunikasi dengan server melalui teknologi AJAX.

Kemudian berkembang menjadi bahasa pemrograman yang lebih kuat dan fleksibel. Javascript dapat digunakan untuk membuat aplikasi web yang kompleks, seperti Gmail, Google Maps, Facebook, dan Twitter. Javascript juga dapat berjalan di luar browser, seperti di server dengan Node.js, di perangkat mobile dengan React Native, dan di IoT dengan Johnny-Five.

Dan saat ini adalah salah satu bahasa pemrograman yang paling banyak digunakan di dunia. Menurut survei Stack Overflow 2020, Javascript adalah bahasa pemrograman yang paling populer di antara pengembang, dengan 67,7% responden menggunakannya. Javascript juga memiliki ekosistem yang besar dan aktif, dengan ribuan pustaka, kerangka kerja, dan alat yang tersedia.

Baca Juga: Apa Itu HTML? Pengertian, Fungsi, Dan Sejarahnya

Tipe Data, Literal, dan Variabel

Apa itu Javascript Tipe data adalah klasifikasi dari nilai yang dapat disimpan dan diproses oleh bahasa pemrograman. Tipe data menentukan karakteristik, ukuran, dan operasi yang dapat dilakukan pada nilai tersebut.

Javascript adalah bahasa pemrograman yang dinamis dan lemah. Ini berarti bahwa Javascript tidak memerlukan deklarasi tipe data secara eksplisit, dan dapat mengubah tipe data secara otomatis sesuai dengan konteks.

Tipe data primitif

  • Number: Tipe data untuk menyimpan nilai numerik, baik bilangan bulat maupun pecahan. Contoh: 42, 3.14, -5.
  • String: Tipe data untuk menyimpan teks atau rangkaian karakter. Contoh: "Hello", 'World', "42".
  • Boolean: Tipe data untuk menyimpan nilai logika, yaitu true atau false. Contoh: true, false.
  • Null: Tipe data untuk menyimpan nilai yang tidak ada atau kosong. Contoh: null.
  • Undefined: Tipe data untuk menyimpan nilai yang belum ditentukan atau tidak memiliki nilai. Contoh: undefined.
  • Symbol: Tipe data untuk menyimpan nilai unik yang tidak dapat diubah. Contoh: Symbol("foo"), Symbol("bar").
  • BigInt: Tipe data untuk menyimpan nilai numerik yang sangat besar, melebihi batas Number. Contoh: 1234567890123456789012345678901234567890n.

Tipe data objek

  • Object: Tipe data untuk menyimpan kumpulan dari pasangan properti dan nilai, atau pasangan kunci dan nilai. Contoh: {name: "Alice", age: 20}, {x: 1, y: 2}.
  • Array: Tipe data untuk menyimpan kumpulan dari nilai yang diindeks berdasarkan nomor urut. Contoh: [1, 2, 3], ["red", "green", "blue"].
  • Function: Tipe data untuk menyimpan blok kode yang dapat dieksekusi. Contoh: function add(a, b) {return a + b;}, () => console.log("Hello").
  • Date: Tipe data untuk menyimpan nilai tanggal dan waktu. Contoh: new Date(), new Date("2020-01-01").
  • RegExp: Tipe data untuk menyimpan pola ekspresi reguler yang dapat digunakan untuk pencocokan teks. Contoh: /[a-z]+/, /^\d{4}-\d{2}-\d{2}$/.
  • Map: Tipe data untuk menyimpan kumpulan dari pasangan kunci dan nilai, di mana kunci dapat berupa tipe data apa saja. Contoh: new Map([["a", 1], ["b", 2]]), new Map([[{}, "foo"], [Symbol("bar"), "baz"]]).
  • Set: Tipe data untuk menyimpan kumpulan dari nilai yang unik, tanpa duplikasi. Contoh:new Set([1, 2, 3, 2, 1]), new Set(["foo", "bar", "baz", "foo"]).

Literal

Literal adalah cara untuk menulis nilai secara langsung dalam kode. Literal dapat berupa angka, teks, logika, atau objek. Contoh literal adalah:

  • 42: Literal untuk tipe data Number dengan nilai 42.
  • "Hello": Literal untuk tipe data String dengan nilai “Hello”.
  • true: Literal untuk tipe data Boolean dengan nilai true.
  • null: Literal untuk tipe data Null dengan nilai null.
  • undefined: Literal untuk tipe data Undefined dengan nilai undefined.
  • Symbol("foo"): Literal untuk tipe data Symbol dengan nilai Symbol(“foo”).
  • 1234567890123456789012345678901234567890n: Literal untuk tipe data BigInt dengan nilai 1234567890123456789012345678901234567890n.
  • {name: "Alice", age: 20}: Literal untuk tipe data Object dengan nilai {name: “Alice”, age: 20}.
  • [1, 2, 3]: Literal untuk tipe data Array dengan nilai [1, 2, 3].
  • function add(a, b) {return a + b;}: Literal untuk tipe data Function dengan nilai function add(a, b) {return a + b;}.
  • new Date(): Literal untuk tipe data Date dengan nilai tanggal dan waktu saat ini.
  • /[a-z]+/: Literal untuk tipe data RegExp dengan nilai pola ekspresi reguler /[a-z]+/.
  • new Map([["a", 1], ["b", 2]]): Literal untuk tipe data Map dengan nilai new Map([[“a”, 1], [“b”, 2]]).
  • new Set([1, 2, 3, 2, 1]): Literal untuk tipe data Set dengan nilai new Set([1, 2, 3]).

Variabel

Variabel adalah nama yang digunakan untuk menyimpan dan merujuk nilai dalam kode. Variabel dapat diberi nama apa saja, asalkan mengikuti aturan berikut:

  • Nama variabel harus dimulai dengan huruf, garis bawah (_), atau tanda dolar ($).
  • Nama variabel tidak boleh mengandung spasi atau karakter khusus, kecuali garis bawah (_) atau tanda dolar ($).
  • Nama variabel tidak boleh menggunakan kata kunci yang telah ditentukan oleh Javascript, seperti var, let, const, if, for, function, dll.

Untuk membuat variabel, kita dapat menggunakan salah satu dari tiga kata kunci berikut:

  • var: Kata kunci untuk mendeklarasikan variabel secara global atau lokal dalam fungsi. Variabel yang dideklarasikan dengan var dapat diubah nilainya dan dapat diinisialisasi tanpa nilai.
  • let: Kata kunci untuk mendeklarasikan variabel secara lokal dalam blok kode. Variabel yang dideklarasikan dengan let dapat diubah nilainya, tetapi harus diinisialisasi dengan nilai.
  • const: Kata kunci untuk mendeklarasikan variabel secara lokal dalam blok kode. Variabel yang dideklarasikan dengan const tidak dapat diubah nilainya, dan harus diinisialisasi dengan nilai.

Contoh deklarasi variabel adalah:

var x; // Mendeklarasikan variabel x tanpa nilai
var y = 10; // Mendeklarasikan variabel y dengan nilai 10
let z = 20; // Mendeklarasikan variabel z dengan nilai 20
const pi = 3.14; // Mendeklarasikan variabel pi dengan nilai 3.14

Untuk mengakses atau mengubah nilai variabel, kita dapat menggunakan nama variabel tersebut. Contoh:

x = 5; // Mengubah nilai variabel x menjadi 5
y = y + 1; // Mengubah nilai variabel y menjadi 11
z = z * 2; // Mengubah nilai variabel z menjadi 40
pi = pi / 2; // Menimbulkan error, karena variabel pi tidak dapat diubah
console.log(x, y, z, pi); // Menampilkan nilai variabel x, y, z, dan pi

Kotak Dialog/Prompt

Apa itu JavascriptKotak dialog/prompt adalah jendela yang muncul di atas halaman web untuk menampilkan pesan, meminta masukan, atau meminta konfirmasi dari pengguna. Javascript memiliki tiga jenis kotak dialog, yaitu:

  • alert: Kotak dialog untuk menampilkan pesan kepada pengguna. Kotak dialog ini hanya memiliki satu tombol OK, dan tidak mengembalikan nilai apa pun.
  • prompt: Kotak dialog untuk meminta masukan dari pengguna. Kotak dialog ini memiliki dua tombol, yaitu OK dan Cancel, dan sebuah bidang teks untuk memasukkan nilai. Kotak dialog ini mengembalikan nilai yang dimasukkan pengguna jika tombol OK ditekan, atau null jika tombol Cancel ditekan.
  • confirm: Kotak dialog untuk meminta konfirmasi dari pengguna. Kotak dialog ini memiliki dua tombol, yaitu OK dan Cancel, dan mengembalikan nilai true jika tombol OK ditekan, atau false jika tombol Cancel ditekan.

Untuk menggunakan kotak dialog, kita dapat menggunakan salah satu dari tiga fungsi berikut:

  • alert(message): Fungsi untuk menampilkan kotak dialog alert dengan pesan yang ditentukan.
  • prompt(message, default): Fungsi untuk menampilkan kotak dialog prompt dengan pesan dan nilai default yang ditentukan.
  • confirm(message): Fungsi untuk menampilkan kotak dialog confirm dengan pesan yang ditentukan.

Contoh penggunaan kotak dialog adalah:

alert("Hello, world!"); // Menampilkan kotak dialog alert dengan pesan "Hello, world!"
var name = prompt("What is your name?", "Alice"); // Menampilkan kotak dialog prompt dengan pesan "What is your name?" dan nilai default "Alice", dan menyimpan nilai yang dimasukkan pengguna ke variabel name
var agree = confirm("Do you agree?"); // Menampilkan kotak dialog confirm dengan pesan "Do you agree?", dan menyimpan nilai yang dikembalikan ke variabel agree

Pengenalan Dunia Pemrograman

Pemrograman adalah proses untuk membuat instruksi yang dapat dipahami dan dijalankan oleh komputer. Instruksi-instruksi ini disebut sebagai kode, dan kumpulan kode yang membentuk sebuah program disebut sebagai skrip.

Untuk membuat kode, kita perlu menggunakan bahasa pemrograman, yaitu sistem simbol dan aturan yang digunakan untuk mengekspresikan ide dan logika. Apa itu Javascript? Bahasa pemrograman dapat berbeda-beda dalam sintaks, struktur, dan fitur, tetapi umumnya memiliki beberapa komponen dasar, yaitu:

  • Komentar: Bagian kode yang tidak dieksekusi oleh komputer, tetapi digunakan untuk memberikan penjelasan, catatan, atau dokumentasi tentang kode. Komentar biasanya diawali dengan tanda khusus, seperti // atau /* ... */ dalam Javascript.
  • Ekspresi: Bagian kode yang menghasilkan nilai, seperti operasi aritmatika, logika, atau perbandingan. Contoh ekspresi adalah 2 + 2, x > y, atau name.length.
  • Statemen: Bagian kode yang mengeksekusi sebuah tindakan, seperti mendeklarasikan variabel, menetapkan nilai, memanggil fungsi, atau mengontrol alur program. Statemen biasanya diakhiri dengan tanda titik koma (;) dalam Javascript. Contoh statemen adalah var x = 10;, console.log("Hello");, atau if (x > y) { ... }.
  • Fungsi: Bagian kode yang dapat dipanggil berulang-ulang untuk melakukan tugas tertentu, dan dapat menerima parameter dan mengembalikan nilai. Fungsi dapat didefinisikan dengan kata kunci function, atau dengan sintaks panah (=>). Contoh fungsi adalah function add(a, b) {return a + b;}, atau (a, b) => a + b.
  • Objek: Bagian kode yang merepresentasikan sebuah entitas yang memiliki properti dan metode. Properti adalah variabel yang terkait dengan objek, dan metode adalah fungsi yang terkait dengan objek. Objek dapat dibuat dengan literal objek ({ ... }), atau dengan konstruktor (new ...). Contoh objek adalah {name: "Alice", age: 20, greet: function() {console.log("Hello, " + this.name);}}, atau new Date().
  • Pustaka: Kumpulan kode yang menyediakan fungsi, objek, atau fitur tertentu yang dapat digunakan oleh program lain. Pustaka dapat berupa bawaan (standar library), atau eksternal (third-party library). Pustaka dapat diimpor dengan kata kunci import, atau dengan tag <script> dalam HTML. Contoh pustaka adalah Math, Date, Array, atau jQuery.

Untuk memulai pemrograman dengan Javascript, kita perlu memiliki beberapa alat, yaitu:

Memulai pemrograman dengan Javascript

  • Editor teks: Alat untuk menulis dan menyunting kode. Editor teks dapat berupa yang sederhana, seperti Notepad, atau yang canggih, seperti Visual Studio Code, Sublime Text, atau Atom.
  • Browser: Alat untuk menjalankan dan menampilkan kode Javascript di halaman web. Browser dapat berupa yang populer, seperti Chrome, Firefox, atau Edge, atau yang khusus, seperti Node.js, Electron, atau React Native.
  • Konsol: Alat untuk menampilkan dan memeriksa hasil dari kode Javascript. Konsol dapat diakses melalui browser, atau melalui terminal atau command prompt.

Menulis pemrograman dengan Javascript

Untuk menulis kode Javascript, kita perlu mengikuti beberapa langkah, yaitu:

  • Membuat file: Langkah untuk membuat file dengan ekstensi .js yang berisi kode Javascript. File ini dapat disimpan di lokasi yang diinginkan, misalnya di folder C:\Users\Alice\Documents\Javascript.
  • Menulis kode: Langkah untuk menulis kode Javascript dengan menggunakan editor teks. Kode ini dapat berisi komentar, ekspresi, statemen, fungsi, objek, atau pustaka yang dibutuhkan.
  • Menyimpan file: Langkah untuk menyimpan file yang berisi kode Javascript dengan menekan tombol Save atau Ctrl+S pada editor teks.
  • Menjalankan file: Langkah untuk menjalankan file yang berisi kode Javascript dengan menggunakan browser. Ada beberapa cara untuk menjalankan file, yaitu:
  • Menggunakan tag <script>: Cara untuk menjalankan file Javascript dengan menyisipkan tag <script> dalam file HTML yang berisi halaman web. Tag <script> dapat memiliki atribut src yang berisi lokasi file Javascript, atau langsung berisi kode Javascript di antara tag <script> dan </script>. Contoh:<html> <head> <title>My Web Page</title> <!-- Menjalankan file Javascript dengan atribut src --> <script src="C:\Users\Alice\Documents\Javascript\myScript.js"></script> </head> <body> <h1>Hello, world!</h1> <!-- Menjalankan kode Javascript langsung --> <script> console.log("This is a message from Javascript"); </script> </body> </html>
  • Menggunakan Node.js: Cara untuk menjalankan file Javascript dengan menggunakan Node.js, yaitu sebuah platform yang memungkinkan Javascript berjalan di luar browser. Untuk menggunakan Node.js, kita perlu menginstal Node.js terlebih dahulu dari situs resminya. Setelah itu, kita dapat menjalankan file Javascript dengan mengetikkan perintah node namaFile.js di terminal atau command prompt. Contoh:# Menjalankan file Javascript dengan Node.js node C:\Users\Alice\Documents\Javascript\myScript.js
  • Menggunakan alat online: Cara untuk menjalankan file Javascript dengan menggunakan alat online, yaitu sebuah situs web yang menyediakan editor teks, browser, dan konsol secara terintegrasi. Alat online ini dapat digunakan tanpa perlu menginstal atau menyimpan file apapun. Contoh alat online adalah CodePen, JSFiddle, atau Repl.it.
  • Menampilkan hasil: Langkah untuk menampilkan hasil dari kode Javascript dengan menggunakan konsol atau halaman web. Konsol dapat menampilkan pesan, nilai, atau error yang dihasilkan oleh kode Javascript. Halaman web dapat menampilkan elemen, interaksi, atau animasi yang dibuat oleh kode Javascript.

Variable dan Tipe Data

Variable dan tipe data adalah dua konsep penting dalam pemrograman. Variable adalah nama yang digunakan untuk menyimpan dan merujuk nilai dalam kode. Tipe data adalah klasifikasi dari nilai yang dapat disimpan dan diproses oleh bahasa pemrograman.

Apa itu Javascript? Javascript adalah bahasa pemrograman yang dinamis dan lemah. Ini berarti bahwa Javascript tidak memerlukan deklarasi tipe data secara eksplisit, dan dapat mengubah tipe data secara otomatis sesuai dengan konteks.

Tipe data primitif

  • Number: Tipe data untuk menyimpan nilai numerik, baik bilangan bulat maupun pecahan. Contoh: 42, 3.14, -5.
  • String: Tipe data untuk menyimpan teks atau rangkaian karakter. Contoh: "Hello", 'World', "42".
  • Boolean: Tipe data untuk menyimpan nilai logika, yaitu true atau false. Contoh: true, false.
  • Null: Tipe data untuk menyimpan nilai yang tidak ada atau kosong. Contoh: null.
  • Undefined: Tipe data untuk menyimpan nilai yang belum ditentukan atau tidak memiliki nilai. Contoh: undefined.
  • Symbol: Tipe data untuk menyimpan nilai unik yang tidak dapat diubah. Contoh: Symbol("foo"), Symbol("bar").
  • BigInt: Tipe data untuk menyimpan nilai numerik yang sangat besar, melebihi batas Number. Contoh: 1234567890123456789012345678901234567890n.

Tipe data objek

  • Object: Tipe data untuk menyimpan kumpulan dari pasangan properti dan nilai, atau pasangan kunci dan nilai. Contoh: {name: "Alice", age: 20}, {x: 1, y: 2}.
  • Array: Tipe data untuk menyimpan kumpulan dari nilai yang diindeks berdasarkan nomor urut. Contoh: [1, 2, 3], ["red", "green", "blue"].
  • Function: Tipe data untuk menyimpan blok kode yang dapat dieksekusi. Contoh: function add(a, b) {return a + b;}, () => console.log("Hello").
  • Date: Tipe data untuk menyimpan nilai tanggal dan waktu. Contoh: new Date(), new Date("2020-01-01").
  • RegExp: Tipe data untuk menyimpan pola ekspresi reguler yang dapat digunakan untuk pencocokan teks. Contoh: /[a-z]+/, /^\d{4}-\d{2}-\d{2}$/.
  • Map: Tipe data untuk menyimpan kumpulan dari pasangan kunci dan nilai, di mana kunci dapat berupa tipe data apa saja. Contoh: new Map([["a", 1], ["b", 2]]), new Map([[{}, "foo"], [Symbol("bar"), "baz"]]).
  • Set: Tipe data untuk menyimpan kumpulan dari nilai yang unik, tanpa duplikasi. Contoh: new Set([1, 2, 3, 2, 1]), new Set(["foo", "bar", "baz", "foo"]).

Membuat Variable

Untuk membuat variabel, kita dapat menggunakan salah satu dari tiga kata kunci berikut:

  • var: Kata kunci untuk mendeklarasikan variabel secara global atau lokal dalam fungsi. Variabel yang dideklarasikan dengan var dapat diubah nilainya dan dapat diinisialisasi tanpa nilai.
  • let: Kata kunci untuk mendeklarasikan variabel secara lokal dalam blok kode. Variabel yang dideklarasikan dengan let dapat diubah nilainya, tetapi harus diinisialisasi dengan nilai.
  • const: Kata kunci untuk mendeklarasikan variabel secara lokal dalam blok kode. Variabel yang dideklarasikan dengan const tidak dapat diubah nilainya, dan harus diinisialisasi dengan nilai.

Contoh deklarasi variabel adalah:

var x; // Mendeklarasikan variabel x tanpa nilai
var y = 10; // Mendeklarasikan variabel y dengan nilai 10
let z = 20; // Mendeklarasikan variabel z dengan nilai 20
const pi = 3.14; // Mendeklarasikan variabel pi dengan nilai 3.14

Untuk mengakses atau mengubah nilai variabel, kita dapat menggunakan nama variabel tersebut. Contoh:

x = 5; // Mengubah nilai variabel x menjadi 5
y = y + 1; // Mengubah nilai variabel y menjadi 11
z = z * 2; // Mengubah nilai variabel z menjadi 40
pi = pi / 2; // Menimbulkan error, karena variabel pi tidak dapat diubahconsole.log(x, y, z, pi); // Menampilkan nilai variabel x, y, z, dan pi

Untuk mengetahui tipe data dari sebuah nilai atau variabel, kita dapat menggunakan operator typeof. Operator typeof mengembalikan sebuah string yang menunjukkan tipe data dari nilai atau variabel tersebut. Contoh:

typeof 42; // Mengembalikan "number"
typeof "Hello"; // Mengembalikan "string"
typeof true; // Mengembalikan "boolean"
typeof null; // Mengembalikan "object"
typeof undefined; // Mengembalikan "undefined"
typeof Symbol("foo"); // Mengembalikan "symbol"
typeof 1234567890123456789012345678901234567890n; // Mengembalikan "bigint"
typeof x; // Mengembalikan "number"
typeof y; // Mengembalikan "number"
typeof z; // Mengembalikan "number"
typeof pi; // Mengembalikan "number"
typeof {name: "Alice", age: 20}; // Mengembalikan "object"
typeof [1, 2, 3]; // Mengembalikan "object"
typeof function add(a, b) {return a + b;}; // Mengembalikan "function"
typeof new Date(); // Mengembalikan "object"
typeof /[a-z]+/; // Mengembalikan "object"
typeof new Map([["a", 1], ["b", 2]]); // Mengembalikan "object"
typeof new Set([1, 2, 3, 2, 1]); // Mengembalikan "object"

Baca Juga: Apa Itu CSS Dan Mengapa Penting Untuk Web Design?

Conditional

Apa itu Javascript Conditional adalah salah satu cara untuk mengontrol alur program berdasarkan kondisi tertentu. Conditional dapat digunakan untuk mengeksekusi blok kode jika kondisi terpenuhi, atau mengeksekusi blok kode lain jika kondisi tidak terpenuhi.

Javascript memiliki beberapa struktur untuk membuat conditional, yaitu:

  • if…else: Struktur untuk mengeksekusi blok kode jika kondisi bernilai true, atau mengeksekusi blok kode lain jika kondisi bernilai false. Contoh:
var x = 10;
var y = 20;
if (x > y) {
    console.log("x is greater than y");
} else {
    console.log("x is not greater than y");
}
  • if…else if…else: Struktur untuk mengeksekusi blok kode jika kondisi pertama bernilai true, atau mengeksekusi blok kode lain jika kondisi kedua bernilai true, atau mengeksekusi blok kode lain lagi jika kedua kondisi bernilai false. Contoh:
var x = 10;
var y = 20;
if (x > y) {
    console.log("x is greater than y");
} else if (x < y) {
    console.log("x is less than y");
} else {
    console.log("x is equal to y");
}
  • switch…case: Struktur untuk mengeksekusi blok kode berdasarkan nilai dari sebuah ekspresi. Struktur ini memiliki beberapa kasus yang sesuai dengan nilai ekspresi, dan sebuah kasus default yang dieksekusi jika tidak ada kasus yang sesuai. Contoh:
var day = new Date().getDay();
switch (day) {
    case 0:
        console.log("Today is Sunday");
        break;
    case 1:
        console.log("Today is Monday");
        break;
    case 2:
        console.log("Today is Tuesday");
        break;
    case 3:
        console.log("Today is Wednesday");
        break;
    case 4:
        console.log("Today is Thursday");
        break;
    case 5:
        console.log("Today is Friday");
        break;
    case 6:
        console.log("Today is Saturday");
        break;
    default:
        console.log("Invalid day");
}
  • ternary operator: Operator untuk mengeksekusi salah satu dari dua ekspresi berdasarkan kondisi. Operator ini memiliki bentuk condition ? expression1 : expression2, yang berarti jika kondisi bernilai true, maka ekspresi pertama dieksekusi, jika tidak, maka ekspresi kedua dieksekusi. Contoh:
var x = 10;
var y = 20;
var result = x > y ? "x is greater than y" : "x is not greater than y";
console.log(result);

Iteration

Apa itu Javascript Iteration adalah salah satu cara untuk mengulangi eksekusi blok kode selama kondisi tertentu terpenuhi. Iteration dapat digunakan untuk melakukan tugas yang berulang, seperti menghitung, mencari, atau mengurutkan.

Apa itu Javascript memiliki beberapa struktur untuk membuat iteration, yaitu:

  • for: Struktur untuk mengulangi blok kode sejumlah kali yang ditentukan. Struktur ini memiliki bentuk for (initialization; condition; update) { ... }, yang berarti blok kode diulangi selama kondisi bernilai true, dan setiap kali diulangi, nilai variabel yang diinisialisasi diubah sesuai dengan update. Contoh:
for (var i = 0; i < 10; i++) {
    console.log(i);
}
  • while: Struktur untuk mengulangi blok kode selama kondisi bernilai true. Struktur ini memiliki bentuk while (condition) { ... }, yang berarti blok kode diulangi selama kondisi tidak berubah menjadi false. Contoh:
var i = 0;
while (i < 10) {
    console.log(i);
    i++;
}
  • do…while: Struktur untuk mengulangi blok kode setidaknya sekali, dan kemudian selama kondisi bernilai true. Struktur ini memiliki bentuk do { ... } while (condition), yang berarti blok kode diulangi setelah kondisi dicek. Contoh:
var i = 0;
do {
    console.log(i);
    i++;
} while (i < 10);
  • for…in: Struktur untuk mengulangi blok kode untuk setiap properti dari sebuah objek. Struktur ini memiliki bentuk for (variable in object) { ... }, yang berarti variabel berisi nama properti dari objek, dan blok kode diulangi untuk setiap properti tersebut. Contoh:
var person = {name: "Alice", age: 20, gender: "female"};
for (var prop in person) {
    console.log(prop + ": " + person[prop]);
}
  • for…of: Struktur untuk mengulangi blok kode untuk setiap nilai dari sebuah objek yang dapat diiterasi, seperti array, string, map, atau set. Struktur ini memiliki bentuk for (variable of object) { ... }, yang berarti variabel berisi nilai dari objek, dan blok kode diulangi untuk setiap nilai tersebut. Contoh:
var colors = ["red", "green", "blue"];
for (var color of colors) {
    console.log(color);
}

Array & Object

Apa itu Javascript Array dan objek adalah dua tipe data yang dapat menyimpan kumpulan dari nilai dalam Javascript. Array dan objek memiliki beberapa perbedaan dan kesamaan, yaitu:

  • Perbedaan:
    • Array menyimpan nilai yang diindeks berdasarkan nomor urut, mulai dari 0. Objek menyimpan nilai yang diindeks berdasarkan nama properti, yang dapat berupa string atau simbol.
    • Array memiliki properti length yang menunjukkan jumlah elemen yang disimpan. Objek tidak memiliki properti length, tetapi dapat menggunakan fungsi Object.keys(obj).length untuk mendapatkan jumlah properti yang dimiliki.
    • Array memiliki metode bawaan yang dapat digunakan untuk memanipulasi elemen, seperti push, pop, shift, unshift, slice, splice, sort, reverse, map, filter, reduce, dll. Objek tidak memiliki metode bawaan, tetapi dapat menggunakan fungsi Object untuk memanipulasi properti, seperti Object.keys, Object.values, Object.entries, Object.assign, Object.freeze, Object.seal, dll.
  • Kesamaan:
    • Array dan objek sama-sama merupakan tipe data objek, yang berarti mereka dapat memiliki properti dan metode tambahan selain yang bawaan.Array dan objek sama-sama dapat menyimpan nilai dari tipe data apa saja, termasuk array dan objek lainnya.Array dan objek sama-sama dapat diakses atau diubah dengan menggunakan notasi kurung siku ([]) atau notasi titik (.). Contoh:
var arr = [1, 2, 3]; var obj = {a: 1, b: 2, c: 3}; console.log(arr[0]); // Mengakses elemen pertama array dengan notasi kurung siku console.log(arr.length); // Mengakses properti length array dengan notasi titik console.log(obj["a"]); // Mengakses properti a objek dengan notasi kurung siku console.log(obj.b); // Mengakses properti b objek dengan notasi titik arr[0] = 10; // Mengubah elemen pertama array dengan notasi kurung siku obj.c = 30; // Mengubah properti c objek dengan notasi titik

Untuk membuat array atau objek, kita dapat menggunakan literal array ([ ... ]) atau literal objek ({ ... }), atau menggunakan konstruktor new Array() atau new Object(). Contoh:

var arr1 = [1, 2, 3]; // Membuat array dengan literal array
var arr2 = new Array(1, 2, 3); // Membuat array dengan konstruktor
var obj1 = {a: 1, b: 2, c: 3}; // Membuat objek dengan literal objek
var obj2 = new Object({a: 1, b: 2, c: 3}); // Membuat objek dengan konstruktor

Untuk mengakses atau mengubah nilai array atau objek, kita dapat menggunakan notasi kurung siku ([]) atau notasi titik (.). Contoh:

console.log(arr1[0]); // Mengakses elemen pertama array dengan notasi kurung siku
console.log(arr1.length); // Mengakses properti length array dengan notasi titik
console.log(obj1["a"]); // Mengakses properti a objek dengan notasi kurung siku
console.log(obj1.b); // Mengakses properti b objek dengan notasi titik
arr1[0] = 10; // Mengubah elemen pertama array dengan notasi kurung siku
obj1.c = 30; // Mengubah properti c objek dengan notasi titik

Untuk menambahkan atau menghapus elemen array, kita dapat menggunakan metode bawaan yang disediakan oleh objek Array, seperti push, pop, shift, unshift, splice, slice, dll. Contoh:

arr1.push(4); // Menambahkan elemen 4 ke akhir array
arr1.pop(); // Menghapus elemen terakhir array
arr1.shift(); // Menghapus elemen pertama array
arr1.unshift(0); // Menambahkan elemen 0 ke awal array
arr1.splice(1, 2, 5, 6); // Menghapus dua elemen mulai dari indeks 1, dan menambahkan elemen 5 dan 6
arr1.slice(1, 3); // Mengembalikan array baru yang berisi elemen mulai dari indeks 1 sampai 3 (tidak termasuk)

Untuk menambahkan atau menghapus properti objek, kita dapat menggunakan operator delete, atau menggunakan fungsi Object.defineProperty, Object.assign, Object.create, dll. Contoh:

delete obj1.a; // Menghapus properti a dari objek
Object.defineProperty(obj1, "d", {value: 4, writable: true, enumerable: true, configurable: true}); // Menambahkan properti d ke objek dengan nilai 4 dan atribut tertentu
Object.assign(obj1, {e: 5, f: 6}); // Menyalin properti e dan f dari objek lain ke objek
var obj3 = Object.create(obj1); // Membuat objek baru yang mewarisi properti dari objek

Javascript Standard Library

Apa itu Javascript standar library adalah kumpulan dari objek, fungsi, dan konstanta bawaan yang dapat digunakan oleh program Javascript tanpa perlu mengimpor atau menginstal apapun. Javascript standar library menyediakan fitur-fitur dasar yang umum dibutuhkan oleh program Javascript, seperti manipulasi string, angka, array, objek, tanggal, matematika, reguler ekspresi, JSON, dan lain-lain.

Javascript standar library terdiri dari beberapa objek bawaan, yaitu:

  • Global: Objek yang merepresentasikan lingkungan global di mana program Javascript berjalan. Objek ini memiliki properti dan metode yang dapat diakses tanpa menggunakan nama objek, seperti NaN, Infinity, undefined, eval, parseInt, parseFloat, isNaN, isFinite, encodeURI, decodeURI, encodeURIComponent, decodeURIComponent, dll.
  • Object: Objek yang merepresentasikan dasar dari semua objek lain. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, memodifikasi, atau menghapus properti dari objek lain, seperti Object.prototype, Object.keys, Object.values, Object.entries, Object.assign, Object.create, Object.defineProperty, Object.freeze, Object.seal, Object.is, Object.isExtensible, Object.isFrozen, Object.isSealed, dll.
  • Function: Objek yang merepresentasikan fungsi. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, memanggil, atau mengubah fungsi, seperti Function.prototype, Function.length, Function.name, Function.call, Function.apply, Function.bind, dll.
  • Boolean: Objek yang merepresentasikan nilai logika, yaitu true atau false. Objek ini memiliki properti dan metode yang dapat digunakan untuk mengkonversi, membandingkan, atau mengevaluasi nilai logika, seperti Boolean.prototype, Boolean.valueOf, Boolean.toString, dll.
  • Symbol: Objek yang merepresentasikan nilai unik yang tidak dapat diubah. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, atau membandingkan nilai simbol, seperti Symbol.prototype, Symbol.for, Symbol.keyFor, Symbol.iterator, Symbol.toString, Symbol.valueOf, dll.
  • Error: Objek yang merepresentasikan kesalahan yang terjadi saat program Javascript berjalan. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, atau menangani kesalahan, seperti Error.prototype, Error.name, Error.message, Error.stack, Error.toString, dll. Objek ini juga memiliki beberapa subkelas, seperti EvalError, RangeError, ReferenceError, SyntaxError, TypeError, URIError, dll.
  • Number: Objek yang merepresentasikan nilai numerik. Objek ini memiliki properti dan metode yang dapat digunakan untuk mengkonversi, memformat, membandingkan, atau menghitung nilai numerik, seperti Number.prototype, Number.MAX_VALUE, Number.MIN_VALUE, Number.NaN, Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY, Number.isNaN, Number.isFinite, Number.isInteger, Number.parseFloat, Number.parseInt, Number.toExponential, Number.toFixed, Number.toPrecision, Number.toString, Number.valueOf, dll.
  • BigInt: Objek yang merepresentasikan nilai numerik yang sangat besar, melebihi batas Number. Objek ini memiliki properti dan metode yang dapat digunakan untuk mengkonversi, membandingkan, atau menghitung nilai BigInt, seperti BigInt.prototype, BigInt.asIntN, BigInt.asUintN, BigInt.toString, BigInt.valueOf, dll.
  • Math: Objek yang menyediakan fungsi dan konstanta matematika. Objek ini memiliki properti dan metode yang dapat digunakan untuk melakukan operasi matematika, seperti Math.E, Math.PI, Math.abs, Math.ceil, Math.floor, Math.round, Math.max, Math.min, Math.pow, Math.sqrt, Math.log, Math.exp, Math.sin, Math.cos, Math.tan, Math.asin, Math.acos, Math.atan, Math.atan2, Math.random, dll.
  • Date: Objek yang merepresentasikan nilai tanggal dan waktu. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, memodifikasi, atau memformat nilai tanggal dan waktu, seperti Date.prototype, Date.now, Date.parse, Date.UTC, Date.getDate, Date.getDay, Date.getFullYear, Date.getHours, Date.getMilliseconds, Date.getMinutes, Date.getMonth, Date.getSeconds, Date.getTime, Date.getTimezoneOffset, Date.setDate, Date.setFullYear, Date.setHours, Date.setMilliseconds, Date.setMinutes, Date.setMonth, Date.setSeconds, Date.setTime, Date.toDateString, Date.toISOString, Date.toJSON, Date.toLocaleDateString, Date.toLocaleString, Date.toLocaleTimeString, Date.toString, Date.toTimeString, Date.toUTCString, Date.valueOf, dll.
  • String: Objek yang merepresentasikan rangkaian karakter. Objek ini memiliki properti dan metode yang dapat digunakan untuk mengkonversi, memanipulasi, membandingkan, atau mencari rangkaian karakter, seperti String.prototype, String.fromCharCode, String.fromCodePoint, String.length, String.charAt, String.charCodeAt, String.codePointAt, String.concat, String.endsWith, String.includes, String.indexOf, String.lastIndexOf, String.localeCompare, String.match, String.normalize, String.padEnd, String.padStart, String.repeat, String.replace, String.search, String.slice, String.split, String.startsWith, String.substr, String.substring, String.toLocaleLowerCase, String.toLocaleUpperCase, String.toLowerCase, String.toUpperCase, String.trim, String.trimEnd, String.trimStart, String.toString, String.valueOf, dll.
  • RegExp: Objek yang merepresentasikan pola ekspresi reguler. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, atau mencocokkan pola ekspresi reguler, seperti RegExp.prototype, RegExp.source, RegExp.flags, RegExp.global, RegExp.ignoreCase, RegExp.multiline, RegExp.dotAll, RegExp.unicode, RegExp.sticky, RegExp.lastIndex, RegExp.exec, RegExp.test, RegExp.toString, dll.
  • Array: Objek yang menyediakan fungsi dan metode untuk bekerja dengan array, yaitu kumpulan dari nilai yang diindeks berdasarkan nomor urut. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, memodifikasi, atau mengurutkan array, seperti Array.prototype, Array.from, Array.isArray, Array.of, Array.length, Array.concat, Array.copyWithin, Array.entries, Array.every, Array.fill, Array.filter, Array.find, Array.findIndex, Array.flat, Array.flatMap, Array.forEach, Array.includes, Array.indexOf, Array.join, Array.keys, Array.lastIndexOf, Array.map, Array.pop, Array.push, Array.reduce, Array.reduceRight, Array.reverse, Array.shift, Array.slice, Array.some, Array.sort, Array.splice, Array.toLocaleString, Array.toString, Array.unshift, Array.values, dll.
  • Map: Objek yang menyediakan fungsi dan metode untuk bekerja dengan map, yaitu kumpulan dari pasangan kunci dan nilai, di mana kunci dapat berupa tipe data apa saja. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, memodifikasi, atau menghapus map, seperti Map.prototype, Map.size, Map.clear, Map.delete, Map.entries, Map.forEach, Map.get, Map.has, Map.keys, Map.set, Map.values, dll.
  • Set: Objek yang menyediakan fungsi dan metode untuk bekerja dengan set, yaitu kumpulan dari nilai yang unik, tanpa duplikasi. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, memodifikasi, atau menghapus set, seperti Set.prototype, Set.size, Set.add, Set.clear, Set.delete, Set.entries, Set.forEach, Set.has, Set.keys, Set.values, dll.
  • JSON: Objek yang menyediakan fungsi dan metode untuk bekerja dengan JSON, yaitu format teks yang digunakan untuk menyimpan dan bertukar data. Objek ini memiliki properti dan metode yang dapat digunakan untuk mengkonversi data antara JSON dan objek Javascript, seperti JSON.parse, JSON.stringify, dll.
  • Promise: Objek yang merepresentasikan hasil dari operasi asinkron, yaitu operasi yang tidak selesai secara langsung, tetapi membutuhkan waktu tertentu. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, atau menangani promise, seperti Promise.prototype, Promise.all, Promise.allSettled, Promise.any, Promise.race, Promise.reject, Promise.resolve, Promise.then, Promise.catch, Promise.finally, dll.
  • Generator: Objek yang merepresentasikan fungsi yang dapat dihentikan dan dilanjutkan kembali, dan menghasilkan nilai yang berurutan. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, atau mengontrol generator, seperti Generator.prototype, Generator.next, Generator.return, Generator.throw, dll.
  • Iterator: Objek yang merepresentasikan objek yang dapat diiterasi, yaitu objek yang memiliki elemen yang dapat diakses secara berurutan. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat, mengakses, atau mengontrol iterator, seperti Iterator.prototype, Iterator.next, Iterator.return, Iterator.throw, dll.
  • Reflect: Objek yang menyediakan fungsi dan metode untuk melakukan operasi refleksi, yaitu operasi yang dapat mengakses atau memodifikasi struktur dan perilaku dari objek Javascript. Objek ini memiliki properti dan metode yang dapat digunakan untuk melakukan operasi refleksi, seperti Reflect.apply, Reflect.construct, Reflect.defineProperty, Reflect.deleteProperty, Reflect.get, Reflect.getOwnPropertyDescriptor, Reflect.getPrototypeOf, Reflect.has, Reflect.isExtensible, Reflect.ownKeys, Reflect.preventExtensions, Reflect.set, Reflect.setPrototypeOf, dll.
  • Proxy: Objek yang menyediakan fungsi dan metode untuk membuat objek proxy, yaitu objek yang dapat mengubah perilaku dari objek lain. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat objek proxy, seperti Proxy.prototype, Proxy.revocable, dll.
  • Intl: Objek yang menyediakan fungsi dan metode untuk melakukan operasi internasionalisasi, yaitu operasi yang dapat menyesuaikan format, bahasa, atau mata uang dari data sesuai dengan preferensi lokal. Objek ini memiliki properti dan metode yang dapat digunakan untuk melakukan operasi internasionalisasi, seperti Intl.Collator, Intl.DateTimeFormat, Intl.ListFormat, Intl.Locale, Intl.NumberFormat, Intl.PluralRules, Intl.RelativeTimeFormat, dll.
  • WebAssembly: Objek yang menyediakan fungsi dan metode untuk bekerja dengan WebAssembly, yaitu format biner yang dapat dieksekusi oleh browser dengan kecepatan tinggi. Objek ini memiliki properti dan metode yang dapat digunakan untuk bekerja dengan WebAssembly, seperti WebAssembly.compile, WebAssembly.instantiate, WebAssembly.validate, WebAssembly.Module, WebAssembly.Instance, WebAssembly.Memory, WebAssembly.Table, WebAssembly.Global, dll.
  • ArrayBuffer: Objek yang menyediakan fungsi dan metode untuk membuat dan mengelola buffer array, yaitu objek yang dapat menyimpan data mentah dalam format biner. Objek ini memiliki properti dan metode yang dapat digunakan untuk membuat dan mengelola buffer array, seperti ArrayBuffer.prototype, ArrayBuffer.length, ArrayBuffer.byteLength, ArrayBuffer.isView, ArrayBuffer.slice, ArrayBuffer.toString, ArrayBuffer.valueOf, dll.
  • console: Objek yang menyediakan fungsi dan metode untuk menampilkan dan memeriksa data di konsol. Objek ini memiliki properti dan metode yang dapat digunakan untuk menampilkan dan memeriksa data, seperti console.log, console.info, console.warn, console.error, console.assert, console.clear, console.count, console.countReset, console.debug, console.dir, console.dirxml, console.group, console.groupCollapsed, console.groupEnd, console.table, console.time, console.timeEnd, console.timeLog, console.trace, console.profile, console.profileEnd, dll.
  • setTimeout: Fungsi yang menyediakan fungsi dan metode untuk menjalankan fungsi tertentu setelah waktu tertentu. Fungsi ini memiliki parameter dan nilai kembalian yang dapat digunakan untuk menjalankan dan mengontrol fungsi tertunda, seperti setTimeout(callback, delay, ...args), clearTimeout(timeoutId), dll.
  • setInterval: Fungsi yang menyediakan fungsi dan metode untuk menjalankan fungsi tertentu secara berulang setiap interval waktu tertentu. Fungsi ini memiliki parameter dan nilai kembalian yang dapat digunakan untuk menjalankan dan mengontrol fungsi berulang, seperti setInterval(callback, delay, ...args), clearInterval(intervalId), dll.
  • setImmediate: Fungsi yang menyediakan fungsi dan metode untuk menjalankan fungsi tertentu segera setelah operasi asinkron selesai. Fungsi ini memiliki parameter dan nilai kembalian yang dapat digunakan untuk menjalankan dan mengontrol fungsi segera, seperti setImmediate(callback, ...args), clearImmediate(immediateId), dll.
  • requestAnimationFrame: Fungsi yang menyediakan fungsi dan metode untuk menjalankan fungsi tertentu sebelum browser melakukan rendering frame berikutnya. Fungsi ini memiliki parameter dan nilai kembalian yang dapat digunakan untuk menjalankan dan mengontrol fungsi animasi, seperti requestAnimationFrame(callback), cancelAnimationFrame(animationId), dll.

Baca Juga: Apa Itu Web Development? Penjelasan Selengkapnya!

Kesimpulan

Itulah beberapa yang ada di dalam Javascript. Objek-objek ini dapat membantu kita untuk membuat program Javascript yang lebih mudah, cepat, dan efisien. Untuk informasi lebih lanjut tentang objek-objek tersebut di website mozila atau Blog Dimas.

Terima kasih telah membaca artikel ini. Semoga artikel ini bermanfaat dan menambah wawasan kita tentang Javascript. Jangan lupa untuk terus membaca artikel selanjutnya yang akan membahas topik-topik menarik lainnya tentang Javascript. Sampai jumpa! 😊

Leave a Comment