Javascript

Fungsi Apply JavaScript: Metode dan Cara Membuat Codenya

Penggunaan Kembali Metode

Dengan metode apply(), kita bisa membuat metode yang bisa digunakan pada objek yang berbeda.

Metode JavaScript apply ()

Metode apply() mirip dengan metode call() yang dijelaskan pada bab sebelumnya.

Dalam contoh ini, metode fullName person diterapkan pada person1.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Function</h2>
<p> Dalam contoh ini, metode fulllName person <b> diterapkan </b> pada person1: </p>
<p id="demo"></p>

<script>
var person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
var x = person.fullName.apply(person1); 
document.getElementById("demo").innerHTML = x; 
</script>

</body>
</html>

Perbedaan Antara call() dan apply()

Perbedaannya adalah:

Metode call() mengambil argumen secara terpisah.

Metode apply() mengambil argumen sebagai array.

Metode apply() sangat berguna jika kita ingin menggunakan array dibandingkan daftar argumen.

Metode apply() dengan Argumen

Metode apply() menerima argumen dalam array.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Function</h2>

<p> Dalam contoh ini, metode fulllName person <b> diterapkan </b> pada person1. </p>
<p id="demo"></p>

<script>
var person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
var x = person.fullName.apply(person1, ["Oslo", "Norway"]); 
document.getElementById("demo").innerHTML = x; 
</script>

</body>
</html>

Perbandingan dengan metode call().

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Functions</h2>
<p> Contoh ini memanggil metode fullName person, dan menggunakannya pada person1:</p>

<p id="demo"></p>

<script>
var person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
var person2 = {
  firstName:"Mary",
  lastName: "Doe"
}
var x = person.fullName.call(person1, "Oslo", "Norway"); 
document.getElementById("demo").innerHTML = x; 
</script>

</body>
</html>

Simulasikan Metode Max pada Array

Kita dapat mencari angka terbesar (dalam daftar angka) menggunakan metode Math.max ().

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math.max()</h2>

<p> Contoh ini mengembalikan nilai tertinggi dalam daftar argumen angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Math.max(1,2,3); 
</script>

</body>
</html>

Karena array JavaScript tidak memiliki metode max(), maka kita dapat menerapkan metode Math.max() sebagai gantinya.

Contoh:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>

<p> Contoh ini mengembalikan angka tertinggi dalam array angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Math.max.apply(null, [1,2,3]); 
</script>

</body>
</html>

Argumen pertama (null) tidak masalah. Itu tidak digunakan dalam contoh ini.

Contoh berikut akan memberikan hasil yang sama:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>

<p> Contoh ini mengembalikan angka tertinggi dalam array angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Math.max.apply(Math, [1,2,3]); 
</script>

</body>
</html>




<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>

<p> Contoh ini mengembalikan angka tertinggi dalam array angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Math.max.apply(" ", [1,2,3]); 
</script>

</body>
</html>




<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>

<p> Contoh ini mengembalikan angka tertinggi dalam array angka: </p>
<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = Math.max.apply(0, [1,2,3]); 
</script>

</body>
</html>

Mode Strict JavaScript

Dalam mode strict JavaScript, jika argumen pertama dari metode apply() bukan objek, itu menjadi pemilik (objek) dari fungsi yang dipanggil. Dalam mode “non-strict” maka akan menjadi objek global.


Catur Kurnia Sari

Share
Tags: javascript