cara membuat kalkulator sederhana dengan javascript

Daftar Isi:

Persiapan
Membuat Struktur HTML
Membuat Fungsi JavaScript

Membuat kalkulator sederhana merupakan proyek yang bagus untuk mempelajari kode JavaScript. Dengan mengikuti tutorial ini, kamu akan mengetahui bagaimana cara membikin kalkulator yang dapat menjalankan operasi dasar seperti penjumlahan, pengurangan, perkalian, dan pembagian. Mari kita mulai!

Persiapan

Sebelum memulai, kamu perlu menyiapkan perangkat lunak teks editor seperti Notepad++, Sublime Text, atau Visual Studio Code. Software ini digunakan untuk menulis dan mengedit kode.

Membuat Struktur HTML

Langkah pertama dalam membuat kalkulator adalah membuat struktur dasar HTML nya.

<!DOCTYPE html>
<html>
<head>
   <title> Kalkulator Sederhana JavaScript </title>
</head>
<body>
   <input type="text" id="hasil" disabled>
   <br/>
   <input type="button" value="1" onclick="tambahAngka('1')">
   <!--Tombol tersisa-->
   <input type="button" value="C" onclick="bersihkan()">
   <br/>
</body>
</html>

Kode di atas hanya menampilkan input dan beberapa tombol sederhana. Kamu perlu membuat tombol lainnya dan memastikan tiap tombol memiliki fungsi onclick() yang tersambung dengan fungsi JavaScript.

Membuat Fungsi JavaScript

Setelah membuat HTML, selanjutnya membuat fungsi JavaScript.

<script type="text/javascript">
   function tambahAngka(angka) {
     var tampil = document.getElementById("hasil").value;
     document.getElementById("hasil").value = tampil + angka;
   }

   function bersihkan() {
     document.getElementById("hasil").value = "";
   }

   function hasilAkhir() {
     var hasil = document.getElementById("hasil").value;
     document.getElementById("hasil").value = eval(hasil);
   }
</script>

Kode JavaScript di atas berisi tiga fungsi:

`tambahAngka()`

Fungsi ini ditambahkan ke setiap tombol angka dan operator dalam kalkulator kita. Fungsi ini mengambil satu parameter yaitu “angka”, yang digunakan untuk menampilkan angka atau operator yang diklik.

`bersihkan()`

Fungsi ini bertugas untuk membersihkan atau mereset tampilan kalkulator saat tombol “C” di-klik.

`hasilAkhir()`

Fungsi ini dipanggil ketika tombol ”=” ditekan. Fungsi ini menghitung hasil dari ekspresi matematika yang telah dimasukkan pengguna.

Setelah membikin fungsi-fungsi tersebut, tambahkan ke dalam kode HTML kamu. Dan selamat, kalkulator sederhana dengan JavaScript telah selesai! Kamu bisa mencoba menjalankan program tersebut melalui browser dan menekan setiap tombol untuk memastikan semuanya bekerja dengan baik.

Membuat kalkulator JavaScript adalah proyek yang menyenangkan dan edukatif. Kamu bisa mencoba menambahkan fungsi dan fitur lainnya untuk meningkatkan keterampilan kode kamu. Selamat mencoba!

CARA MEMBUAT KALKULATOR SEDERHANA DENGAN JAVASCRIPT

Panduan langkah demi langkah dalam membuat kalkulator sederhana menggunakan JavaScript, yang cocok untuk pemula yang ingin meningkatkan keterampilan kode mereka.