Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. JavaScript

Belajar Ilmu Komputer Dengan JavaScript: Bagian 4, Fungsi

by
Difficulty:BeginnerLength:MediumLanguages:
This post is part of a series called Learn Computer Science with JavaScript.
Learn Computer Science With JavaScript: Part 2, Conditionals
Learn Computer Science With JavaScript: Part 3, Loops

Indonesian (Bahasa Indonesia) translation by Hasannudin Amin (you can also view the original English article)

Pengantar

Misalkan Anda memiliki file yang panjangnya 82 baris dan hanya terdiri dari serangkaian pernyataan. (Saya harap ini tidak benar, tetapi semuanya mungkin.) Bagaimana Anda akan memahami apa yang dilakukan oleh program? Bagaimana Anda akan mengubahnya atau menggunakannya? Akan sangat sulit untuk melakukan apa pun dengan kode ini karena tidak ada struktur untuk itu.

Untuk mengatasi masalah ini, Anda bisa menggunakan fungsi. Fungsi adalah sekelompok pernyataan yang melakukan tugas tertentu. Fungsi memungkinkan kita memecah program menjadi program yang lebih kecil, membuat kode kita lebih mudah dibaca, dapat digunakan kembali, dan dapat diuji.

Konten

  • Fungsi Void
  • Fungsi pengembalian nilai
  • Scope
  • Parameter
  • Modul

Fungsi Void

Fungsi semacam ini mencantumkan langkah-langkah untuk program untuk melakukan. Pertimbangkan kita menulis program untuk memasukkan pengguna ke situs web. Program mungkin terdiri dari tugas-tugas berikut:

  • Mendapatkan nama pengguna
  • Mendapatkan kata sandi
  • Periksa apakah nama pengguna dan kata sandi ada
  • Alihkan pengguna ke dashboard mereka

Masing-masing langkah ini mungkin terkandung di dalam fungsi login. Ini adalah contoh fungsi:

Ini adalah bentuk umum dari suatu fungsi:

Untuk menjalankan fungsi (juga dikenal sebagai memanggil fungsi, atau menjalankan fungsi), Anda menulis pernyataan yang memanggilnya.

() adalah tempat kita memberikan input ke fungsi. Ketika kita mendefinisikan fungsi, input disebut parameter. Ketika kita memanggil fungsi, input akan menjadi nilai aktual dan disebut argumen. Contoh:

Dengan JavaScript ES6, Anda dapat mendefinisikan fungsi menggunakan sintaks panah. Berikut adalah fungsi sapaan kami yang didefinisikan menggunakan sintaks panah:

Fungsi dengan satu parameter:

Fungsi dengan lebih dari satu parameter:

Fungsi dengan beberapa pernyataan:

Karena fungsi arrow adalah fungsi anonim, kita memberikan nama fungsi kita dengan menugaskannya ke variabel. Fungsi arrow bisa berguna ketika tubuh fungsi Anda hanya memiliki satu pernyataan.

Fungsi Pengembalian Nilai

Fungsi semacam ini mengembalikan nilai. Fungsi harus diakhiri dengan pernyataan return. Contoh ini mengembalikan jumlah dari dua angka.

Ini adalah bentuk umum yang mendefinisikan fungsi pengembalian nilai:

Nilai exspression adalah apa yang dihasilkan oleh fungsi. Fungsi semacam ini berguna ketika disimpan dalam variabel.

Scope

Ruang lingkup variabel adalah bagian dari program tempat variabel dapat diakses. Variabel dapat bersifat lokal atau global. Cakupan variabel lokal ada di dalam fungsi yang dibuat. Tidak ada kode di luar fungsi yang dapat mengakses variabel lokalnya.

Juga, ketika Anda menggunakan let atau const untuk mendeklarasikan variabel, mereka memiliki ruang lingkup blok. Blok adalah serangkaian pernyataan yang dimiliki bersama sebagai grup. Blok bisa sesederhana membungkus kode kita di kurung kurawal:

Variabel a adalah lokal untuk blok itu. Blok A juga bisa menjadi loop atau pernyataan if. Contoh:

Karena pernyataan konsol kami berada dalam lingkup yang sama dengan variabel a pertama kita, ia menampilkan nilai itu, yaitu 1. Ini tidak memiliki akses ke variabel di dalam blok if. Sekarang, perhatikan contoh ini:

Sekarang 2 akan ditampilkan karena ruang lingkup variabel yang memiliki akses ke konsol kita berada dalam blok if. Parameter fungsi juga merupakan variabel lokal dan hanya dapat diakses oleh kode di dalam fungsi. Variabel global, di sisi lain, dapat diakses oleh semua pernyataan dalam file program. Contoh:

Dalam contoh ini, a adalah variabel global, dan kita memiliki akses ke dalamnya di dalam fungsi foo. Pernyataan konsol pertama akan menampilkan 1. Setelah memanggil foo, nilai a diatur ke 2, membuat tampilan konsol kedua ditampilkan 2.

Variabel global harus digunakan sangat sedikit, idealnya tidak sama sekali. Karena variabel global dapat diakses oleh setiap bagian dari program, mereka menjalankan risiko diubah dengan cara yang tidak dapat diprediksi. Dalam program besar dengan ribuan baris kode, itu membuat program lebih sulit dipahami karena Anda tidak dapat dengan mudah melihat bagaimana variabel tersebut digunakan. Lebih baik untuk membuat dan menggunakan variabel lokal.

Namun, jika Anda perlu menggunakan variabel di banyak tempat dalam program Anda, boleh saja menggunakan konstanta global. Mendeklarasikan variabel dengan kata kunci const mencegahnya diubah, membuatnya lebih aman untuk digunakan. Anda hanya perlu khawatir tentang memperbarui nilai konstanta di tempat itu dinyatakan.

Parameter

Ingat bahwa parameter adalah variabel yang digunakan fungsi untuk menerima data. Parameter diberikan nilai argumen fungsi ketika fungsi dipanggil. Pada ES6, parameter juga dapat diberikan nilai default dengan format parameterName=value. Dalam hal ini, Anda dapat memanggil fungsi tanpa argumen, dan itu akan menggunakan nilai default. Contoh:

Operator spread/rest adalah baru untuk ES6 dan dapat digunakan untuk memperluas suatu array atau objek ke dalam nilai-nilai individual atau mengumpulkan parameter dari suatu fungsi ke dalam suatu array. Ini adalah contoh penggunaan parameter istirahat:

Modul

Misalkan sekarang Anda memiliki file yang memiliki 1.082 baris. (Saya telah melihat ini, dan Anda harus berjalan jika Anda menemukan hal semacam itu.) File ini diatur ke dalam fungsi, tetapi sulit untuk melihat bagaimana mereka berhubungan satu sama lain.

Untuk mengelompokkan perilaku terkait, kita harus menempatkan kode kita di modul. Modul dalam ES6 adalah file yang berisi fungsi dan variabel terkait. Modul membiarkan kita menyembunyikan properti pribadi dan mengekspos properti publik yang ingin kita gunakan dalam file lain. Nama file akan menjadi nama modul. Modul juga memiliki ruang lingkup sendiri. Untuk menggunakan variabel di luar cakupan modul, mereka harus diekspor. Variabel yang tidak diekspor akan menjadi pribadi dan hanya dapat diakses dalam modul.

Properti individu dapat diekspor seperti ini:

Sebagai alternatif, semua properti dapat diekspor dengan satu pernyataan ekspor:

Untuk menggunakan variabel modul, Anda mengimpornya ke file. Anda dapat menentukan apa yang ingin Anda impor dari modul seperti ini:

Anda juga dapat mengganti nama impor Anda:

Atau Anda dapat mengimpor semua properti dari modul:

Ulasan

Fungsi memungkinkan kami membagi program kita menjadi program yang lebih kecil yang dapat kita kelola dengan mudah. Praktek ini dikenal sebagai modularizing. Fungsi memungkinkan kami membagi program kami menjadi program yang lebih kecil yang dapat kita kelola dengan mudah. Praktek ini dikenal sebagai modularizing.

Cakupan adalah bagian dari program di mana variabel dapat diakses. Variabel yang dideklarasikan di dalam fungsi, termasuk parameter fungsi, bersifat lokal. Blok juga memiliki ruang lingkup, dan variabel lokal dapat dibuat di dalamnya.

Variabel yang tidak dilampirkan dalam blok atau modul akan bersifat global. Jika Anda membutuhkan variabel global, dapat diterima untuk memiliki konstanta global. Jika tidak, cobalah untuk memuat kode Anda ke modul karena modul memiliki ruang lingkup sendiri. Tetapi yang lebih baik lagi, modul memberikan struktur kode dan organisasi Anda.

Sumber daya

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.