Apa bantuan javascript?

Pada artikel ini, kita membahas kegunaan JavaScript di web, kelemahannya, dan cara menggunakannya secara bertanggung jawab

pengantar

Sekarang Kurikulum Standar Web telah membawa Anda melalui konsep-konsep inti penting pemrograman, sekarang saatnya untuk mengambil langkah mundur dari detail dan melihat tingkat tinggi pada apa yang sebenarnya dapat Anda lakukan dengan JavaScript — mengapa Anda ingin mengambil

Ini adalah waktu yang menarik, karena penggunaan JavaScript telah beralih dari masalah pengetahuan pinggiran ke keterampilan pengembangan web utama selama beberapa tahun terakhir. Saat ini, sulit mendapatkan pekerjaan sebagai pengembang web tanpa keterampilan JavaScript

Bagaimana orang menyukai JavaScript

Komputer dulu jauh lebih lambat dan browser buruk dalam menafsirkan JavaScript. Sebagian besar pengembang berasal dari dunia pengembangan back-end. Saat itu, JavaScript sepertinya ide yang buruk

Di sisi lain, biaya hosting file sangat tinggi. Di sinilah JavaScript masuk. JavaScript dijalankan di komputer pengguna saat mereka mengakses halaman, artinya apa pun yang dapat Anda lakukan di JavaScript tidak akan menambah beban pemrosesan ke server Anda. Oleh karena itu, ini adalah sisi klien. Ini membuat situs jauh lebih responsif bagi pengguna akhir dan lebih murah dalam hal lalu lintas server

Lewati hari ini – browser modern memiliki JavaScript yang diimplementasikan dengan baik, komputer jauh lebih cepat, dan bandwidth jauh lebih murah, sehingga banyak hal negatif yang kurang kritis. Namun, mengurangi perjalanan bolak-balik server dengan melakukan hal-hal dalam JavaScript tetap menghasilkan aplikasi web yang lebih responsif dan pengalaman pengguna yang lebih baik

Kelemahan dari JavaScript

Bahkan dengan semua peningkatan ini, masih ada kendala. JavaScript tidak stabil. Bukan bahasa itu sendiri tetapi lingkungan tempat implementasinya. Anda tidak tahu komputer mana yang menerima halaman web Anda, Anda tidak tahu seberapa sibuk komputer dengan hal-hal lain, dan Anda tidak tahu apakah beberapa JavaScript lain di tab lain dari browser sedang menggiling semuanya menjadi . Sampai browser mulai memiliki sumber pemrosesan yang berbeda untuk tab dan jendela yang berbeda (juga dikenal sebagai utas), ini akan selalu menjadi masalah. Beberapa threading tersedia sampai tingkat tertentu dengan fitur HTML5 baru yang disebut pekerja Web, dan ini memiliki dukungan browser yang wajar

Selain itu, JavaScript sering dinonaktifkan di browser karena masalah keamanan, atau karena JavaScript sering digunakan untuk mengganggu orang daripada meningkatkan pengalaman mereka. Misalnya, banyak situs masih mencoba memunculkan jendela baru yang bertentangan dengan keinginan Anda, atau menutupi konten dengan iklan hingga Anda mengeklik tautan untuk menghapusnya.

Apa yang dapat dilakukan JavaScript untuk Anda

Mari mundur selangkah dan hitung manfaat JavaScript

• JavaScript sangat mudah diimplementasikan. Yang perlu Anda lakukan hanyalah memasukkan kode Anda ke dalam dokumen HTML dan memberi tahu browser bahwa itu adalah JavaScript
• JavaScript berfungsi di komputer pengguna web — bahkan saat mereka offline
• JavaScript memungkinkan Anda membuat antarmuka yang sangat responsif yang meningkatkan pengalaman pengguna dan menyediakan fungsionalitas dinamis, tanpa harus menunggu server bereaksi dan menampilkan halaman lain
• JavaScript dapat memuat konten ke dalam dokumen jika dan ketika pengguna membutuhkannya, tanpa memuat ulang seluruh halaman — ini biasanya disebut sebagai Ajax
• JavaScript dapat menguji apa yang mungkin dilakukan di browser Anda dan bereaksi sesuai — ini disebut Prinsip JavaScript yang tidak mengganggu atau terkadang skrip defensif
• JavaScript dapat membantu memperbaiki masalah browser atau menambal lubang pada dukungan browser — misalnya memperbaiki masalah tata letak CSS di browser tertentu

Itu banyak untuk bahasa yang sampai saat ini ditertawakan oleh programmer yang menyukai "bahasa pemrograman yang lebih tinggi". Salah satu bagian dari kebangkitan JavaScript adalah bahwa kita sedang membangun aplikasi web yang semakin kompleks akhir-akhir ini, dan interaktivitas yang tinggi memerlukan Flash (atau plugin lain) atau skrip. JavaScript bisa dibilang adalah cara terbaik, karena ini adalah standar web, didukung secara native di seluruh browser (kurang lebih — beberapa hal berbeda di seluruh browser, dan perbedaan ini dibahas di tempat yang tepat di artikel yang mengikuti ini),

Penggunaan umum JavaScript

Penggunaan JavaScript telah berubah selama bertahun-tahun kami menggunakannya. Pada awalnya, interaksi JavaScript dengan situs sebagian besar terbatas pada interaksi dengan formulir, memberikan umpan balik kepada pengguna, dan mendeteksi ketika mereka melakukan hal-hal tertentu. Kami menggunakan alert() untuk memberi tahu pengguna tentang sesuatu (lihat Gambar 1), confirm() untuk menanyakan apakah ada yang boleh dilakukan dan prompt() atau bidang formulir untuk mendapatkan input pengguna

Gambar 1. Memberi tahu pengguna akhir tentang kesalahan menggunakan pernyataan alert() adalah satu-satunya yang dapat kami lakukan di masa-masa awal JavaScript. Tidak cantik atau halus

Hal ini sebagian besar menyebabkan skrip validasi yang menghentikan pengguna untuk mengirim formulir ke server ketika ada kesalahan, dan pengonversi dan kalkulator sederhana. Selain itu, kami berhasil membuat hal-hal yang sangat tidak berguna seperti petunjuk yang menanyakan nama pengguna hanya untuk mencetaknya segera setelah itu

Hal lain yang kami gunakan adalah document.write()_ untuk menambahkan konten ke dokumen. Kami juga bekerja dengan jendela dan bingkai pop-up dan kehilangan banyak keberanian dan mencabut rambut mencoba membuat mereka berbicara satu sama lain. Memikirkan sebagian besar teknologi ini seharusnya membuat pengembang mana pun maju dan mundur dan meringkuk ke posisi janin terbata-bata "buat mereka pergi", jadi jangan memikirkan hal-hal ini — ada cara yang lebih baik untuk menggunakan JavaScript

Masukkan skrip DOM

Ketika browser mulai mendukung dan mengimplementasikan Document Object Model (DOM), yang memungkinkan kita untuk berinteraksi lebih kaya dengan halaman web, JavaScript mulai menjadi lebih menarik

DOM adalah representasi objek dari dokumen. Misalnya, paragraf sebelumnya (periksa sumbernya menggunakan sumber tampilan) dalam bahasa DOM adalah simpul elemen dengan nodeName dari p. Ini berisi tiga child nodes

• simpul teks yang berisi "Ketika browser mulai mendukung dan mengimplementasikan " sebagai nodeValue;
• simpul elemen dengan nodeName dari confirm()0;
• node teks lain dengan nodeValue_ dari ", yang memungkinkan kita untuk berinteraksi lebih kaya dengan halaman web, JavaScript mulai menjadi lebih menarik. "

Simpul anak confirm()0 juga memiliki simpul atribut yang disebut confirm()3 dengan nilai "http. // www. w3. org/DOM/" dan simpul anak yang merupakan simpul teks dengan nodeValue dari "Document Object Model(DOM)"

Anda juga dapat merepresentasikan paragraf ini secara visual menggunakan diagram pohon, seperti yang terlihat pada Gambar 2

Gambar 2. Representasi visual dari pohon DOM sampel kami

Dengan kata-kata manusia, Anda dapat mengatakan bahwa DOM menjelaskan tipe, nilai, dan hierarki segala sesuatu dalam dokumen — Anda tidak perlu mengetahui apa pun lagi untuk saat ini. Untuk informasi selengkapnya tentang DOM, lihat artikel Melintasi DOM nanti dalam kursus ini

Menggunakan DOM Anda bisa

• Akses setiap elemen dalam dokumen dan manipulasi tampilan, konten, dan atributnya
• Buat elemen dan konten baru dan terapkan ke dokumen kapan dan jika diperlukan

Ini berarti bahwa kita tidak lagi harus bergantung pada jendela, bingkai, formulir, dan peringatan buruk, dan dapat memberikan umpan balik kepada pengguna dalam dokumen dengan gaya yang baik, seperti yang ditunjukkan pada Gambar 3

Gambar 3. Dengan menggunakan DOM, Anda dapat membuat pesan kesalahan yang lebih bagus dan tidak terlalu mengganggu

Bersama dengan penanganan acara, ini adalah senjata yang sangat kuat untuk membuat antarmuka yang interaktif dan indah

Penanganan acara berarti bahwa kode kami bereaksi terhadap hal-hal yang terjadi di browser. Ini bisa jadi hal-hal yang terjadi secara otomatis — seperti halaman menyelesaikan pemuatan — tetapi sebagian besar waktu kita bereaksi terhadap apa yang dilakukan pengguna terhadap browser

Pengguna dapat mengubah ukuran jendela, menggulir halaman, menekan tombol tertentu, atau mengeklik tautan/tombol/elemen menggunakan mouse. Dengan penanganan peristiwa, kita dapat menunggu hal-hal ini terjadi dan memberi tahu halaman web untuk merespons tindakan ini sesuai keinginan. Jika di masa lalu, mengeklik tautan apa pun akan membawa pengunjung situs ke dokumen lain, kini kami dapat membajak fungsi ini dan melakukan hal lain seperti menampilkan dan menyembunyikan panel atau mengambil informasi di tautan dan menggunakannya untuk terhubung ke layanan web

Peristiwa dibahas lebih detail dalam artikel Menangani peristiwa di JavaScript nanti dalam kursus ini

Penggunaan JavaScript modern lainnya

Dan pada dasarnya inilah yang kami lakukan hari ini dengan JavaScript. Kami menyempurnakan antarmuka web yang lama, teruji, dan benar — mengeklik tautan, memasukkan informasi, dan mengirimkan formulir, dll. — agar lebih responsif terhadap pengguna akhir. Sebagai contoh

• Formulir pendaftaran dapat memeriksa apakah nama pengguna Anda tersedia saat Anda memasukkannya, mencegah Anda dari keharusan memuat ulang halaman yang membuat frustrasi
• Kotak telusur dapat memberikan hasil yang disarankan saat Anda mengetik, berdasarkan apa yang telah dimasukkan sejauh ini (misalnya "bi" dapat memunculkan saran untuk dipilih yang berisi string ini, seperti "burung", "besar", dan " . Pola penggunaan ini disebut pelengkapan otomatis
• Informasi yang terus berubah dapat dimuat secara berkala tanpa memerlukan interaksi pengguna, misalnya hasil pertandingan olahraga atau ticker pasar saham
• Informasi yang bagus untuk dimiliki dan berisiko menjadi berlebihan bagi beberapa pengguna dapat dimuat kapan dan jika pengguna memilih untuk mengaksesnya. Misalnya menu navigasi sebuah situs dapat terdiri dari 6 link tetapi menampilkan link ke halaman yang lebih dalam sesuai permintaan saat pengguna mengaktifkan item menu
• JavaScript dapat memperbaiki masalah tata letak. Menggunakan JavaScript, Anda dapat menemukan posisi dan area elemen apa pun di halaman, dan dimensi jendela browser. Dengan menggunakan informasi ini, Anda dapat mencegah elemen yang tumpang tindih dan masalah serupa lainnya. Katakanlah misalnya Anda memiliki menu dengan beberapa level;
• JavaScript dapat meningkatkan antarmuka yang diberikan HTML kepada kita. Meskipun bagus untuk memiliki kotak input teks, Anda mungkin ingin memiliki kotak kombo yang memungkinkan Anda memilih dari daftar nilai prasetel atau memasukkan nilai Anda sendiri. Dengan menggunakan JavaScript, Anda dapat menyempurnakan kotak input biasa untuk melakukan itu
• Anda dapat menggunakan JavaScript untuk menganimasikan elemen pada halaman — misalnya untuk menampilkan dan menyembunyikan informasi, atau menyorot bagian halaman tertentu — ini dapat membuat pengalaman pengguna menjadi lebih bermanfaat dan lebih kaya. Ada lebih banyak informasi tentang ini di artikel animasi JavaScript nanti di kursus

Menggunakan JavaScript dengan bijaksana dan bertanggung jawab

Tidak banyak yang tidak dapat Anda lakukan dengan JavaScript — terutama jika Anda menggabungkannya dengan teknologi lain seperti Canvas atau SVG. Namun, dengan kekuatan besar datanglah tanggung jawab yang besar, dan Anda harus selalu mengingat hal berikut saat menggunakan JavaScript

• JavaScript mungkin tidak tersedia — ini mudah untuk diuji, jadi bukan masalah. Namun, hal-hal yang bergantung pada JavaScript harus dibuat dengan mempertimbangkan hal ini, dan Anda harus berhati-hati agar situs Anda tidak rusak (i. e. fungsionalitas esensial tidak tersedia) jika JavaScript tidak tersedia
• Jika penggunaan JavaScript tidak membantu pengguna mencapai tujuan dengan lebih cepat dan efisien, Anda mungkin salah menggunakannya
• Dengan menggunakan JavaScript, kami sering melanggar konvensi yang sudah biasa dilakukan orang selama bertahun-tahun menggunakan web (misalnya, mengeklik tautan untuk membuka laman lain, atau ikon keranjang kecil yang berarti "keranjang belanja"). Meskipun pola penggunaan ini mungkin sudah ketinggalan zaman dan tidak efisien, mengubahnya tetap berarti membuat pengguna mengubah cara mereka — dan ini membuat manusia merasa tidak nyaman. Kami suka memegang kendali dan begitu kami memahami sesuatu, sulit bagi kami untuk menghadapi perubahan. Solusi JavaScript Anda seharusnya terasa lebih baik secara alami daripada interaksi sebelumnya, tetapi tidak terlalu berbeda sehingga pengguna tidak dapat menghubungkannya melalui pengalaman mereka sebelumnya. Jika Anda berhasil membuat pengunjung situs mengatakan "ah ha — ini berarti saya tidak perlu menunggu" atau "Keren — sekarang saya tidak perlu mengambil langkah ekstra yang menyebalkan ini" — Anda telah memanfaatkan JavaScript dengan baik
• JavaScript seharusnya tidak pernah menjadi ukuran keamanan. Jika Anda perlu mencegah pengguna mengakses data atau Anda cenderung menangani data sensitif, jangan mengandalkan JavaScript. Perlindungan JavaScript apa pun dapat dengan mudah direkayasa ulang dan diatasi, karena semua kode tersedia untuk dibaca di mesin klien. Selain itu, pengguna dapat mematikan JavaScript di browser mereka

Kesimpulan

JavaScript adalah teknologi luar biasa untuk digunakan di web. Ini tidak sulit untuk dipelajari dan sangat fleksibel. Ini bekerja dengan baik dengan teknologi web lainnya — seperti HTML dan CSS — dan bahkan dapat berinteraksi dengan plugin seperti Flash. JavaScript memungkinkan kami membuat antarmuka pengguna yang sangat responsif, mencegah pemuatan ulang halaman yang membuat frustrasi, dan bahkan memperbaiki masalah dukungan untuk CSS. Menggunakan add-on browser yang tepat (seperti Google Gears atau Yahoo Browser Plus), Anda bahkan dapat menggunakan JavaScript untuk membuat sistem online tersedia secara offline dan menyinkronkan secara otomatis setelah komputer online

JavaScript juga tidak terbatas pada browser. Kecepatan dan jejak memori kecil JavaScript dibandingkan dengan bahasa lain membawa lebih banyak kegunaannya — dari mengotomatiskan tugas berulang dalam program seperti Illustrator, hingga menggunakannya sebagai bahasa sisi server dengan pengurai mandiri. Masa depan terbuka lebar

Apa 5 hal yang dapat dilakukan JavaScript?

Apa manfaat terbesar menggunakan JavaScript?

Apa kegunaan JavaScript yang paling umum?