Pemrograman Web Dasar ~ PBO dan Interaksi User

September 10, 2019

Pemrograman Web Dasar ~ PBO dan Interaksi User

Assalamualaikum warohmatullahi wabarokatu

halo kembail lagi dengan saya dengan materi yang sama mengenai bahasa javaScript. kali ini kita akan mempelajari tentang PBO(Pemrograman Berorientasi Objek) dan Interaksi User dalam JavaScript.

PBO

PBO adalah sebuah paradigma dalam pemrograman yang mengelempokkan fungsi,prosudur,variable ataupun konstanta terkait dalam satu kesatuan seperti objek.

Js menggunakan PBO dengan model pemrograman berbasis prototipe. Model ini tidak mengenal kelas yang ada adalah obyek. Js memililiki banyak obyek bawaan seperti Math,Array,String dan object. sehingga memiliki semua properti dan metode yang ada.

Interaksi User

Adanya Interaktifitas dalam aplikasi akan membantu menarik minat pengguna untuk menggunakan aplikasi yang dikembankan.Event dalam Js adalah bentuk sebuah kejadian interaksi antara user dengan halaman web

Berikut ini merupakkan daftar atribut yang dapat digunakkan untuk mengolag interaksi user :

dan unutuk Atribut pengaksessan Obyek pada halanab Web sebagai berikut :

Berikut Contoh Pengkodingan dari PBO dan Interaksi User :

1. Interaksi face Text dan Box to Alert

See the Pen intrfacetxtandbxalert by taufik (@fikmr) on CodePen.

2.Fungsi PBO 1

See the Pen FungsiPbo1 by taufik (@fikmr) on CodePen.

3. Fungai PBO 2

<!DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <meta http-equiv="X-UA-Compatible" content="ie=edge">
            <title>TaufikRPL1</title>
        </head>
        <body>
            <p id="coba">
<script>
                function segiempat(){ 
                    this.panjang = 0;
                    this.lebar = 0;
                    this.hitungungluas = function(){
                        var luas = this.panjang * this.lebar;
                        return luas;
                    }
                    this.hitungkeliling = function(){
                        var kel = 2 * (this.panjang + this.lebar);
                        return kel;
                    }
                }
                var s= new segiempat();
                s.panjang= 4;
                s.lebar = 3;
                alert("Luas adalah " +s.hitungungluas()+"cm");
                alert("dan keliling adalah " + s.hitungkeliling() + "cm");
                </script>
            </p>
</body>
        </html>

4.Interface Textbox and Button Alert

See the Pen interfacetxtbxandbttnalrt by taufik (@fikmr) on CodePen.

5. Interface Textbox and Button Alert 2

See the Pen interfacetxtbxandbttnalrt2 by taufik (@fikmr) on CodePen.

6. Interface TextBox and Button to alert Array

See the Pen interfacetxtbxandbtnarray by taufik (@fikmr) on CodePen.

7. Interface getElementByTagName

See the Pen Interfacegetelementbytagname by taufik (@fikmr) on CodePen.

Search This Blog

Taufik MR