Tutorial JS

JS RUMAH Pengenalan JS JS Dimana Keluaran JS Pernyataan JS Sintaks JS Komentar JS Variabel JS JS Let JS Const Operator JS JS Aritmatika Tugas JS Tipe Data JS Fungsi JS Objek JS Acara JS String JS Metode String JS Pencarian String JS Template String JS Nomor JS Metode Nomor JS JS Array Metode Array JS Sortir Array JS Iterasi Array JS JS Array Const Tanggal JS Format Tanggal JS Metode Dapatkan Tanggal JS Metode Penetapan Tanggal JS JS Matematika JS Acak JS Boolean Perbandingan JS Ketentuan JS Beralih JS JS Loop Untuk JS Loop Untuk Masuk JS Loop Untuk Of JS Loop Sementara Istirahat JS JS Iterable JS Set Peta JS Tipe JS Konversi Tipe JS JS Bitwise JS RegExp Kesalahan JS Lingkup JS Pengangkatan JS Mode Ketat JS JS Kata Kunci ini Fungsi Panah JS Kelas JS JS JSON Debug JS Panduan Gaya JS Praktik Terbaik JS Kesalahan JS Kinerja JS Kata-kata Cadangan JS

Versi JS

Versi JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Tepi Sejarah JS

Objek JS

Definisi Objek Properti Objek Metode Objek Tampilan Objek Aksesor Objek Konstruktor Objek Prototipe Objek Obyek Iterable Set Objek Peta Objek Referensi Objek

Fungsi JS

Definisi Fungsi Parameter Fungsi Panggilan Fungsi Panggilan Fungsi Fungsi Terapkan Penutupan Fungsi

Kelas JS

Perkenalan Kelas Warisan Kelas Kelas Statis

JS Asinkron

Panggilan Balik JS JS Asinkron JS Janji JS Async/Menunggu

JS HTML DOM

Pengenalan DOM Metode DOM Dokumen DOM Elemen DOM HTML DOM Formulir DOM CSS DOM Animasi DOM Acara DOM Pendengar Acara DOM Navigasi DOM Node DOM Koleksi DOM Daftar Node DOM

JS Browser BOM

Jendela JS Layar JS Lokasi JS Sejarah JS JS Navigator Peringatan Munculan JS Waktu JS JS Cookies

JS Web API

Pengantar API Web API Formulir Web API Riwayat Web API Penyimpanan Web API Pekerja Web API Pengambilan Web API Geolokasi Web

JS AJAX

Pengenalan AJAX AJAX XMLHttp Permintaan AJAX Tanggapan AJAX File XML AJAX AJAX PHP AJAX ASP Basis Data AJAX Aplikasi AJAX Contoh AJAX

JS JSON

Perkenalan JSON Sintaks JSON JSON vs XML Tipe Data JSON Penguraian JSON Stringify JSON Objek JSON Array JSON Server JSON JSON PHP JSON HTML JSON JSONP

JS vs jQuery

Pemilih jQuery jQuery HTML jQuery CSS jQuery DOM

Grafik JS

Grafik JS JS Kanvas JS Plotly JS Chart.js Bagan Google JS JS D3.js

Contoh JS

Contoh JS JS HTML DOM Masukan HTML JS Objek HTML JS Acara HTML JS JS Browser Editor JS Latihan JS kuis JS Sertifikat JS

Referensi JS

Objek JavaScript Objek DOM HTML


Panggilan Fungsi JavaScript


Kode di dalam JavaScript functionakan dieksekusi ketika "sesuatu" memanggilnya.


Memanggil Fungsi JavaScript

Kode di dalam suatu fungsi tidak dijalankan ketika fungsi tersebut didefinisikan .

Kode di dalam suatu fungsi dijalankan ketika fungsi tersebut dipanggil .

Adalah umum untuk menggunakan istilah " panggil fungsi " daripada " panggil fungsi ".

Juga umum untuk mengatakan "memanggil fungsi", "memulai fungsi", atau "mengeksekusi fungsi".

Dalam tutorial ini, kita akan menggunakan panggilan , karena fungsi JavaScript dapat dipanggil tanpa dipanggil.


Memanggil Fungsi sebagai Fungsi

Contoh

function myFunction(a, b) {
  return a * b;
}
myFunction(10, 2);           // Will return 20

Fungsi di atas bukan milik objek apa pun. Tetapi dalam JavaScript selalu ada objek global default.

Dalam HTML, objek global default adalah halaman HTML itu sendiri, jadi fungsi di atas "milik" halaman HTML.

Di browser objek halaman adalah jendela browser. Fungsi di atas secara otomatis menjadi fungsi jendela.

myFunction() dan window.myFunction() adalah fungsi yang sama:

Contoh

function myFunction(a, b) {
  return a * b;
}
window.myFunction(10, 2);    // Will also return 20

Ini adalah cara umum untuk memanggil fungsi JavaScript, tetapi bukan praktik yang sangat baik.
Variabel global, metode, atau fungsi dapat dengan mudah membuat konflik nama dan bug di objek global.



Kata Kunci ini

Dalam JavaScript, hal yang disebut this, adalah objek yang "memiliki" kode saat ini.

Nilai this, ketika digunakan dalam suatu fungsi, adalah objek yang "memiliki" fungsi tersebut.

Perhatikan bahwa thisini bukan variabel. Ini adalah kata kunci. Anda tidak dapat mengubah nilai this.

Tip: Baca lebih lanjut tentang thiskata kunci di JS Kata Kunci ini .


Objek Global

Ketika suatu fungsi dipanggil tanpa objek pemilik, nilai this menjadi objek global.

Dalam browser web objek global adalah jendela browser.

Contoh ini mengembalikan objek window sebagai nilai dari this:

Contoh

let x = myFunction();            // x will be the window object

function myFunction() {
  return this;
}

Memanggil fungsi sebagai fungsi global, menyebabkan nilai this menjadi objek global.
Menggunakan objek jendela sebagai variabel dapat dengan mudah merusak program Anda.


Memanggil Fungsi sebagai Metode

Dalam JavaScript Anda dapat mendefinisikan fungsi sebagai metode objek.

Contoh berikut membuat objek ( myObject ), dengan dua properti ( firstName dan lastName ), dan metode ( fullName ):

Contoh

const myObject = {
  firstName:"John",
  lastName: "Doe",
  fullName: function () {
    return this.firstName + " " + this.lastName;
  }
}
myObject.fullName();         // Will return "John Doe"

Metode fullName adalah sebuah fungsi. Fungsi tersebut milik objek. myObject adalah pemilik fungsi.

Hal yang disebut this, adalah objek yang "memiliki" kode JavaScript. Dalam hal ini nilainya this adalah myObject .

Menguji! Ubah metode fullName untuk mengembalikan nilai this:

Contoh

const myObject = {
  firstName:"John",
  lastName: "Doe",
  fullName: function () {
    return this;
  }
}

// This will return [object Object] (the owner object)
myObject.fullName();

Memanggil fungsi sebagai metode objek, menyebabkan nilai this menjadi objek itu sendiri.


Memanggil Fungsi dengan Konstruktor Fungsi

Jika pemanggilan fungsi didahului dengan newkata kunci, itu adalah pemanggilan konstruktor.

Sepertinya Anda membuat fungsi baru, tetapi karena fungsi JavaScript adalah objek, Anda sebenarnya membuat objek baru:

Contoh

// This is a function constructor:
function myFunction(arg1, arg2) {
  this.firstName = arg1;
  this.lastName  = arg2;
}

// This creates a new object
const myObj = new myFunction("John", "Doe");

// This will return "John"
myObj.firstName;

Permintaan konstruktor membuat objek baru. Objek baru mewarisi properti dan metode dari konstruktornya.

Kata thiskunci dalam konstruktor tidak memiliki nilai.
Nilai dari thisakan menjadi objek baru yang dibuat saat fungsi dipanggil.