Apa itu JavaSkrip? Pendahuluan dengan Contoh Hello World
⚡ Ringkasan Cerdas
JavaScript adalah bahasa pemrograman yang membuat halaman web menjadi interaktif. Pendahuluan ini menjelaskan apa itu Script. JavaScript mencakup asal-usulnya, bagaimana browser dan Node.js mengeksekusinya, serta cara menulis dan menjalankan skrip Hello World pertama.

Apa itu JavaNaskah?
JavaScript adalah bahasa pemrograman tingkat tinggi yang menambahkan perilaku pada halaman web. Ini adalah salah satu dari tiga teknologi inti web: HTML menyediakan struktur, CSS menyediakan tampilan, dan JavaSkrip menyediakan interaksi. Setiap kali kotak pencarian menampilkan saran saat Anda mengetik, carousel foto bergeser, atau formulir pendaftaran memperingatkan Anda tentang kolom yang belum diisi, JavaScript tersebut melakukan pekerjaan itu di latar belakang.
Diagram di bawah ini menunjukkan bagaimana sebuah skrip berada di samping markup halaman web biasa.
Sepanjang sebagian besar masa hidupnya JavaScript awalnya digambarkan sebagai bahasa skrip sisi klien, karena hanya berjalan di dalam browser. Deskripsi tersebut kini tidak lengkap. Sejak Node.js muncul pada tahun 2009, bahasa yang sama juga telah mendukung server web, utilitas baris perintah, aplikasi desktop, dan aplikasi seluler. Deskripsi yang lebih akurat saat ini adalah bahwa JavaScript adalah bahasa pemrograman serbaguna yang memiliki kehadiran luar biasa kuat di peramban web.
Ciri-ciri yang mendefinisikan bahasa tersebut adalah:
- Bertipe dinamis: Sebuah variabel dapat menyimpan angka sekarang dan string beberapa saat kemudian, jadi tipe data diperiksa saat program berjalan.
- Diinterpretasikan dan disusun tepat waktu: Mesin seperti V8 di Chrome dan Node.js mengkompilasi kode yang sering dieksekusi menjadi kode mesin untuk meningkatkan kecepatan.
- Multiparadigma: Gaya imperatif, fungsional, dan berorientasi objek semuanya didukung.
- Berbasis peristiwa: Kode tersebut bereaksi terhadap klik, penekanan tombol, pengatur waktu, dan respons jaringan, alih-alih berjalan dari atas ke bawah dan berhenti.ping.
- Berjalan dalam satu thread dengan event loop: Pekerjaan yang lambat seperti panggilan jaringan akan dimasukkan ke dalam antrian, alih-alih membekukan halaman.
💡 Kiat: JavaScript dan ECMAScript bukanlah bahasa yang bersaing. ECMAScript adalah spesifikasi tertulis, dan JavaScript adalah implementasi dari spesifikasi tersebut yang sebenarnya disertakan oleh browser dan Node.js.
Sejarah JavaNaskah
Brendan Eich menciptakan JavaScript di Netscape Communications pada tahun 1995, menghasilkan prototipe kerja pertama dalam waktu sekitar sepuluh hari. Secara internal proyek ini disebut MokaFitur ini dirilis dalam versi beta Netscape Navigator 2.0 sebagai... LiveScript pada bulan September 1995, dan berganti nama. JavaNaskah pada bulan Desember 1995 sebagai bagian dari perjanjian pemasaran antara Netscape dan Sun Microsystems, perusahaan yang memiliki Java pada saat itu.
Penggantian nama itulah satu-satunya alasan mengapa begitu banyak pemula masih berasumsi demikian. JavaScript adalah edisi ringan dari JavaKedua bahasa tersebut tidak terkait dalam hal desain, kepemilikan, dan waktu eksekusi. Netscape menyerahkan bahasa tersebut ke Ecma International pada tahun 1996, dan edisi pertama standar ECMA-262 diterbitkan pada Juni 1997. Tabel di bawah ini mencantumkan tonggak-tonggak penting yang paling berpengaruh saat membaca kode lama.
| Tahun | Batu | Mengapa itu penting |
|---|---|---|
| 1995 | Mocha, lalu LiveScript, lalu JavaNaskah | Bahasa pemrograman ini dibuat di Netscape oleh Brendan Eich. |
| 1997 | ECMA-262 edisi pertama | Bahasa tersebut memperoleh standar tertulis yang netral terhadap vendor. |
| 2009 | ES5 dan rilis pertama Node.js | Mode ketat tiba, dan JavaSkrip tersebut lolos dari pengawasan browser. |
| 2015 | ES6 (ECMAScript 2015) | Kata kunci `let`, `const`, fungsi panah, kelas, modul, dan promise ditambahkan. |
| 2016 ke depan | Edisi ECMAScript tahunan | Fitur-fitur yang lebih kecil dirilis setiap bulan Juni, bukan dalam rilis besar yang jarang terjadi. |
Karena siklus rilis tahunan, kode yang ditulis sebelum tahun 2015 terlihat sangat berbeda dari kode modern. Tutorial lama menggunakan var di mana-mana, sementara kode saat ini lebih menyukai let ke const ketika mendeklarasikan variabel di JavaNaskah.
Apa itu JavaSkrip ini digunakan untuk apa?
JavaScript tidak lagi terbatas pada trik-trik kecil di halaman web. Sintaks yang sama kini muncul di empat tempat yang sangat berbeda, itulah sebabnya Script secara konsisten menempati peringkat sebagai salah satu bahasa yang paling banyak digunakan dalam survei pengembang.
| Daerah | Apa JavaSkripnya ada di sana | Alat-alat umum |
|---|---|---|
| Ujung depan peramban | Menangani klik, memperbarui halaman tanpa memuat ulang, memvalidasi formulir, dan menggambar grafik. | React, Vue, Angular, Svelte |
| Sisi server | Melayani permintaan HTTP, berkomunikasi dengan basis data, dan membangun API REST atau GraphQL. | Node.js, Deno, Bun, Express |
| Aplikasi seluler | membangun Android dan aplikasi iOS dari satu basis kode bersama. | Bereaksi Asli, IonicKapasitor |
| Aplikasi desktop | Membungkus antarmuka web dalam jendela asli dengan akses ke sistem file. | Elektron, Tauri |
| Peralatan dan otomatisasi | Menggabungkan aset, menjalankan rangkaian pengujian, dan mengontrol browser untuk pengujian ujung-ke-ujung. | Vite, webpack, Jest, Penulis Drama |
Game, visualisasi data, ekstensi browser, dan proyek perangkat keras kecil semuanya juga bergantung padanya. Bagi pemula, konsekuensi praktisnya sederhana: upaya yang Anda curahkan pada sintaks sekarang langsung ditransfer ke pekerjaan server, pekerjaan seluler, dan otomatisasi pengujian di kemudian hari. Jika Anda ingin melihat bahasa tersebut diterapkan pada masalah nyata, kerjakan serangkaian latihan berikut. praktis JavaContoh kode skrip setelah dasar-dasarnya dikuasai.
Bagaimana Menjalankan JavaNaskah?
JavaSkrip tidak berjalan dengan sendirinya. Ia membutuhkan lingkungan host yang berisi sebuah JavaNaskah mesinChrome dan Edge menggunakan V8, Firefox menggunakan SpiderMonkey, dan Safari menggunakan JavaScriptCore. Ketika sebuah browser mengunduh halaman HTML dan menemukan sebuah skrip, browser tersebut menyerahkan skrip itu ke mesinnya, yang kemudian mengurai, mengkompilasi, dan menjalankannya.
Lingkungan host kedua adalah Node.js, yang menyematkan mesin V8 yang sama di luar browser. Dengan cara ini, bahasa yang identik dapat berjalan di server atau di terminal. Keuntungan praktisnya adalah... JavaNaskahnya itu setiap browser modern mendukungnya on Windows, Linux, dan macOS, jadi Anda jarang perlu khawatir tentang browser apa yang digunakan pengunjung. Ini merupakan peningkatan nyata dibandingkan VBScript, yang hanya berfungsi di Internet Explorer saja. Windows dan sekarang sudah usang bersamaan dengan Internet Explorer itu sendiri.
⚠️ Peringatan: Browser JavaSkrip dan Node.js JavaScript tersebut memiliki bahasa inti yang sama tetapi tidak memiliki objek-objek di sekitarnya. document ke window hanya ada di browser, dan require dan modul sistem file hanya ada di Node.js. Menyalin kode di antara keduanya tanpa memeriksanya akan menimbulkan kesalahan referensi.
Alat yang Anda Butuhkan
Anda memerlukan editor teks untuk menulis kode dan browser untuk melihat hasilnya. Notepad++, Visual Studio Code, Sublime Text, dan editor lain apa pun yang Anda sukai akan berfungsi, meskipun editor dengan penyorotan sintaks dan pencocokan tanda kurung akan sangat menghemat waktu debugging Anda. Semua browser saat ini dapat digunakan: Google Chrome, Firefox, Microsoft Edgeatau Safari. Tidak ada yang perlu dibeli atau diinstal selain kedua hal tersebut.
Sederhana JavaProgram Skrip
Jika Anda menyimpannya JavaSkrip berada di dalam dokumen HTML itu sendiri, semua kode harus berada di antara tanda kurung buka/tutup. <script> tag dan penutup </script> tag. Inilah cara browser membedakan kode Anda dari markup di sekitarnya. Halaman-halaman lama juga menetapkan sebuah tag. type atribut, ditulis sebagai <script type="text/javascript">, yang dibutuhkan ketika bahasa sisi klien saingan seperti VBScript ada. Halaman modern menghilangkannya, karena HTML5 memperlakukannya text/javascript sebagai default. Kedua versi di bawah ini secara fungsional identik, dan keduanya masih valid.
Contoh Halo Dunia
Program pertama tradisional menampilkan pesan. Tempatkan markup berikut dalam file bernama hello.html lalu buka di browser.
<html>
<head>
<title>My First JavaScript code!!!</title>
<script type="text/javascript">
alert("Hello World!");
</script>
</head>
<body>
</body>
</html>
Keluaran:
A browser dialog box opens containing the text: Hello World!
Catatan: type="text/javascript" tidak diperlukan di HTML5. Kode berikut ini berfungsi dengan cara yang sama persis.
<html>
<head>
<title>My First JavaScript code!!!</title>
<script>
alert("Hello World!");
</script>
</head>
<body>
</body>
</html>
Keluaran:
A browser dialog box opens containing the text: Hello World!
Begitu sebuah halaman bertambah panjang hingga lebih dari beberapa baris, pindahkan naskah ke bagiannya sendiri. .js File tersebut menjaga agar markup tetap terbaca dan memungkinkan browser untuk menyimpan kode dalam cache. Perbedaan-perbedaan tersebut dibahas secara detail dalam perbandingan ini. internal dan eksternal JavaNaskah.
Cara Menulis dan Menjalankan Skrip Pertama Anda
Ada tiga cara praktis untuk melaksanakannya. JavaScript, dan seorang pemula sebaiknya mencoba ketiganya karena masing-masing cocok untuk situasi yang berbeda.
1. Konsol peramban. Ini adalah opsi tercepat dan tidak memerlukan file sama sekali. Buka halaman web apa pun, tekan F12 (atau Ctrl+)Shift+Saya pada Windows dan Linux, Cmd+Option+I aktif macOS), dan pilih konsul Tab. Ketik satu baris, tekan Enter, dan hasilnya akan langsung muncul. Ini adalah tempat yang ideal untuk menguji satu ekspresi atau memeriksa apa yang dikembalikan oleh suatu fungsi.
// Type each line into the browser console and press Enter console.log(2 + 2); console.log("Guru" + 99); console.log(Math.max(4, 12, 7)); console.log(typeof "hello");
Keluaran:
4 Guru99 12 string
Perhatikan baris kedua. Menambahkan angka 99 ke string “Guru” menghasilkan string “Guru"99" dan bukan sebuah kesalahan, karena JavaSkrip ini secara otomatis mengubah angka menjadi teks. Perilaku ini memang praktis, tetapi juga merupakan sumber kesalahan umum bagi pemula.
2. Sebuah file HTML. Ini adalah contoh "Hello World" yang ditunjukkan di atas. Gunakan contoh ini setiap kali kode harus berinteraksi langsung dengan halaman, misalnya membaca nilai formulir atau mengubah elemen.
3. Node.js dari terminal. Instal Node.js, simpan kode dalam sebuah file dengan nama yang sesuai. .js ekstensi, lalu jalankan node first-script.jsTidak ada yang ditampilkan, jadi console.log menjadi saluran keluaran Anda. Ini adalah jalur yang tepat jika Anda ingin mempraktikkan fitur bahasa murni tanpa HTML di sekitarnya.
// first-script.js const language = "JavaScript"; const createdBy = "Brendan Eich"; const releaseYear = 1995; console.log(language + " was created by " + createdBy + " in " + releaseYear + "."); const usedFor = ["Interactive web pages", "Server apps with Node.js", "Mobile apps"]; usedFor.forEach(function (item, index) { console.log(index + 1 + ". " + item); });
Keluaran:
JavaScript was created by Brendan Eich in 1995. 1. Interactive web pages 2. Server apps with Node.js 3. Mobile apps
Skrip singkat ini sudah menggunakan tiga ide yang akan sering Anda temui: konstanta yang dideklarasikan dengan const, Sebuah susunan menyimpan daftar nilai, dan fungsi callback yang diteruskan ke forEachMenulis ulang loop yang sama dengan for Menyusun pernyataan adalah latihan yang bermanfaat setelah Anda mempelajarinya. lingkaran di JavaNaskah.
JavaNaskah vs Java
Penamaan tersebut merupakan kecelakaan terbesar dalam sejarah pemrograman, dan kebingungan yang ditimbulkannya perlu diluruskan sejak awal. JavaScript diubah namanya dari LiveScript murni karena alasan pemasaran pada tahun 1995, pada saat itu Java merupakan teknologi yang paling banyak dibicarakan di web. Kedua bahasa tersebut dirancang oleh orang yang berbeda, di perusahaan yang berbeda, untuk masalah yang berbeda.
| Aspek | JavaNaskah | Java |
|---|---|---|
| Dibuat oleh | Brendan Eich di Netscape, 1995 | James Gosling di Sun Microsystems, 1995 |
| Typing | Dinamis dan bertipe lemah | Statis dan bertipe kuat |
| Berjalan | Mesin peramban dan Node.js | The Java Mesin virtual |
| Kompilasi | Dikompilasi tepat waktu oleh mesin saat dijalankan. | Dikompilasi terlebih dahulu menjadi bytecode |
| Model objek | Berbasis prototipe, dengan sintaks kelas ditambahkan di ES6. | Berbasis kelas sejak awal |
| Ekstensi file | . Js | .java dikompilasi menjadi .class |
| Penggunaan umum | Antarmuka web, API, dan perangkat bantu. | Sistem back-end perusahaan, Androiddata besar |
Satu-satunya kesamaan nyata adalah keduanya meminjam sintaks kurung kurawal dari C. Mempelajari satu bahasa tidak akan mengajarkan Anda bahasa lainnya, meskipun sintaks yang sama membuat bahasa kedua sedikit lebih mudah dibaca. Jika tipe data yang ketatping menarik bagi Anda, TypeScript menambahkan lapisan tipe statis di atasnya JavaSkrip saat dikompilasi menjadi teks biasa JavaNaskah, dan perbedaannya dijelaskan di sini. TypeScript ke JavaPerbandingan skrip.
Setelah hal-hal mendasar terpenuhi, langkah selanjutnya yang wajar adalah... interaktif JavaLatihan skrip, kemudian variabel dan tipe data, Diikuti oleh array ke loop. Setelah itu, Berorientasi pada objek JavaNaskah menjelaskan bagaimana objek, prototipe, dan kelas saling berkaitan, dan pemformatan string Mencakup penanganan teks yang akan Anda gunakan di hampir setiap naskah.


