Funkce JavaScript Apply() metoda

Obsah

    Zobrazit obsah

Opětovné použití metody

Pomocí metody apply() můžete napsat metodu, kterou lze použít na různých objektů.

JavaScriptová metoda apply()

Metoda apply() je podobná metodě call() (předchozí kapitola).

V tomto příkladu je metoda fullName person použita na person1:

Příklad

const person = {
    fullName: function() {
      return this.firstName + " " + this.lastName;
    }
}

const person1 = {
  firstName: "Mary",
  lastName: "Doe"
}

// This will return "Mary Doe":
person.fullName.apply(person1);

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Functions</h2>
<p>In this example the fulllName method of person is <b>applied</b> on person1:</p>

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

<script>
const person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}

const person1 = {
  firstName:"John",
  lastName: "Doe"
}

document.getElementById("demo").innerHTML = person.fullName.apply(person1); 
</script>

</body>
</html>

Rozdíl mezi call() a apply()

Rozdíl je:

Metoda call() bere argumenty samostatně.

Metoda apply() bere argumenty jako pole.

Metoda apply() je velmi užitečná, pokud chcete místo seznamu argumentů použít pole.

Metoda apply() s argumenty

Metoda apply() přijímá argumenty v poli:

Příklad

const person = {
    fullName: function(city, country) {
    return this.firstName + " " + this.lastName 
  + "," + city + "," + country;
    }
}

const person1 = {
  firstName:"John",
    lastName: "Doe"
}

person.fullName.apply(person1, ["Oslo", "Norway"]);

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Functions</h2>
<p>In this example the fulllName method of person is <b>applied</b> on person1:</p>

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

<script>
const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}

const person1 = {
  firstName:"John",
  lastName: "Doe"
}

document.getElementById("demo").innerHTML = person.fullName.apply(person1, ["Oslo", "Norway"]); 
</script>

</body>
</html>

V porovnání s metodou call():

Příklad

const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName 
  + "," + city + "," + country;
    }
}

const person1 = {
    firstName:"John",
    lastName: "Doe"
}

person.fullName.call(person1, "Oslo", "Norway");

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Functions</h2>
<p>This example calls the fullName method of person, using it on person1:
</p>

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

<script>
const person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}

const person1 = {
  firstName:"John",
  lastName: "Doe"
}

const person2 = {
  firstName:"Mary",
  lastName: "Doe"
}

document.getElementById("demo").innerHTML = person.fullName.call(person1, "Oslo", "Norway"); 
</script>

</body>
</html>

Simulujte maximální metodu na polích

Největší číslo (v seznamu čísel) můžete najít pomocí metody Math.max():

Příklad

Math.max(1,2,3);  // Will return 3

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Math.max()</h2>
<p>This example returns the highest number in a list of number arguments:</p>

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

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

</body>
</html>

Protože pole JavaScriptu nemají metodu max(), můžete použít metodu místo toho metodou Math.max().

Příklad

Math.max.apply(null, [1,2,3]); // Will also return 3

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>
<p>This example returns the highest number in an array of numbers:</p>

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

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

</body>
</html>

Na prvním argumentu (null) nezáleží. V tomto příkladu se nepoužívá.

Tyto příklady poskytnou stejný výsledek:

Příklad

Math.max.apply(Math, [1,2,3]); // Will also return 3

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>
<p>This example returns the highest number in an array of numbers:</p>

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

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

</body>
</html>

Příklad

Math.max.apply(" ", [1,2,3]); // Will also return 3

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>
<p>This example returns the highest number in an array of numbers:</p>

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

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

</body>
</html>

Příklad

Math.max.apply(0, [1,2,3]); // Will also return 3

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript apply()</h2>
<p>This example returns the highest number in an array of numbers:</p>

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

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

</body>
</html>

Přísný režim JavaScriptu

V přísném režimu JavaScriptu, pokud první argument metody apply() není objekt, stává se vlastníkem (objektem) vyvolané funkce. V „nepřísném“ režimu se z něj stane globální objekt.