Belajar JavaScript (Objek dan UI) -Praktikum 16

-

Assalamualaikum WR.WB


Hai kembali lagi ke blog saya,Pada postingan kali ini saya akan memberikan tutorial membuat Pemograman Berbasis Objek dan User Interface menggunakan JavaScript.
Sebelumnya saya akan menjelaskan apa itu Pemograman Berbasis Objek dan Pemograman Berbasis Prototype.Oke kita langsung ke pembahasan yang pertama

1. Pemrograman Berorientasi Objek

    Pemrograman berorientasi obyek adalah sebuah paradigma dalam pemrograman yang mengelompokkan fungsi, prosedur, variabel ataupun konstanta terkait dalam satu kesatuan (kelas) seperti obyek dalam dunia nyata.
    Obyek sendiri merupakan wujud dari kelas, secara umum dikenal dengan nama instan. Teknik-teknik dalam pemrograman ini merupakan pengembangan dari teknik sebelumnya seperti modularitas, polimorfisme, dan enkapsulasi. Saat ini ada banyak bahasa pemrograman yang telah mendukung pemrograman berorientasi obyek ini, seperti C++, C#, Java, Javascript, PHP, Python, Ruby, dan Objective C.

2. Pemrograman Berbasis Prototype
    Javascript memiliki banyak obyek bawaan seperti Math, Array, String dan Object. Setiap obyek dalam Javascript adalah instan dari obyek Object, sehingga memiliki semua properti dan metode yang ada.
    Javascript merupakan bahasa PBO yang menggunakan kata kunci function untuk mendefinisikan suatu kelas. Oleh karena itu, pembuatan kelas sama dengan pembuatan fungsi dalam Javascript. Berikut ini merupakan format yang dapat digunakan untuk mendefinisikan kelas pada javascript.

Nah,untuk lebih jelasnya kita langsung ke contoh codingan nya:



Hasil Outputnya:



Setelah di klik



Contoh kedua:





Hasil Outputnya:





3. Interaksi User

•Adanya interaktifitas dalam aplikasi akan membantu menarik minat pengguna untuk menggunakan aplikasi yang dikembangkan.
•Di banyak bahasa pemrograman pengolahan interaksi ini dikenal sebagai teknik penanganan event.
•Event dalam Javascript adalah sebuah kejadian interaksi antara user dengan halaman web. 

Contoh Pertama:



Hasil outputnya:

 

 Lalu akan muncul:

 


Contoh Kedua:



Hasil codinganya:



Setelah di klik:



Contoh Ketiga:





Hasil codinganya:



Contoh keempat:





Hasil codinganya:




Setelah di klik:

Setelah Klik OK















Komentar

Posting Komentar

Postingan populer dari blog ini

Laravel : Create Data, Validation, dan Old Input

-
Gambar
Assalamualaikum WR.WB     Hai! kembali lagi ke blog saya,pada postingan kali ini saya akan memberikan materi Laravel yaitu Membuat data di Laravel (Create Read Update Delete)  atau disebut juga dengan CRUD.Nah mari kita langsung ke pembahasannya!      Di postingan  sebelumnya , kita telah membuat beberapa tabel diantaranya tabel siswa dan juga kelas, jadi sekarang kita akan membuat create data di tabel siswa caranya sebagai berikut: 1. Buat link untuk menghubungkan form utama dengan form tambah data buka file  resources/views/belajar.blade.php  kemudian tambahkan ini di bawah tulisan data siswa <a class="btn btn-sm btn-success" href="{{ url('/siswa/create') }}">Tambah Data</a> 2. Ubah Routes buka file file  routes/web.php  lalu tambakan Route::get('/siswa/create','SiswaController@create'); 3. Menampilkan view dengan nama form yang terdapat pada folder siswa buka file  app/Http/Controllers/SiswaControlle
Baca selengkapnya

Belajar PHP (Nested Looping) -Praktikum 24

-
Gambar
Assalamualaikum WR.WB Hai!Kembali lagi ke blog saya,pada postingan kali ini saya akan memberikan tutorial menggunakan Nested Loop di PHP.Tapi sebelum kita ke materi apa sih yang disebut Nested Loop? Pengertian Nested Loop 1. Nested Looping Nested Looping adalah istilah dimana kita menggunakan beberapa kali pengulangan dalam 1 codingan, istilahnya tidak jauh berbedadengan Nested If . Seperti yang telah kita ketahui, jenis jenis pengulangan ada 3, yaitu : For, While, dan Do - While. Dalam Nested Looping kita dapat menggunakannya dengan bersamaan, sekarang saya akan mencontohkan penggunakan Nested Looping. <html> <head> <title> Ammar taradifa - XI RPL 3</title> </head> <link href="Loop.css" rel="stylesheet" type = "text/css" > <body> <center> <?php $jumlah = 5; for ($i = 1; $i <= $jumlah; $i++) { for ($j = 1; $j <= $i; $j++) { echo 'X'; }
Baca selengkapnya

Program Menentukan Hari Menggunakan If Dan Switch Case dan

-
Gambar
Assalamualaikum WR WB Pada postingan akan kali ini saya akan membahas program untuk menentukan kode hari dan menentukan kelulusan seseorang. 1. Program Menentukan Hari If Program ini akan menentukan hari berdasarkan kode yang user input,yang nanti akan dieksekusi oleh program.contohnya user menginput angka 7 maka program akan mengoutput hari senin. Berikut codingan programnya: Jadi apabila user menginput kode dari 1 - 7  maka program akan mengoutput dari hari minggu - hari senin.Berikut rincianya: -Kode 1 = Hari Minggu -Kode 2 = Hari Senin -Kode 3 = Hari Selasa -Kode 4 = Hari Rabu -Kode 5 = Hari Kamis -Kode 6 = Hari Jumat -Kode 7 = Hari  Sabtu  Berikut hasil programnya: 2. Program Menentukan Hari Switch Case Program ini sama seperti program di atas akan tetapi kali ini menguunakan switch case,Apa itu switch case? Switch-case merupakan pernyataan yang dirancangan khusus untuk menangani pengambilan keputusan yang melibatkan sejumlah atau banyak alternatif
Baca selengkapnya