Função JavaScript aplicar() Método

Índice

    Mostrar índice

Reutilização de métodos

Com o método apply(), você pode escrever um método que pode ser usado em diferentes objetos.

O método JavaScript apply()

O método apply() é semelhante ao método call() (capítulo anterior).

Neste exemplo, o método fullName de person é aplicado em person1:

Exemplo

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

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

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

Experimente você mesmo →

<!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>

A diferença entre call() e apply()

A diferença é:

O método call() recebe argumentos separadamente.

O método apply() aceita argumentos como um array.

O método apply() é muito útil se você quiser usar um array em vez de uma lista de argumentos.

O método apply() com argumentos

O método apply() aceita argumentos em um array:

Exemplo

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"]);

Experimente você mesmo →

<!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>

Comparado com o método call():

Exemplo

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");

Experimente você mesmo →

<!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>

Simule um método Max em arrays

Você pode encontrar o maior número (em uma lista de números) usando o método Math.max():

Exemplo

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

Experimente você mesmo →

<!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>

Como os arrays JavaScript não possuem um método max(), você pode aplicar o Em vez disso, use o método Math.max().

Exemplo

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

Experimente você mesmo →

<!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>

O primeiro argumento (nulo) não importa. Não é usado neste exemplo.

Esses exemplos darão o mesmo resultado:

Exemplo

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

Experimente você mesmo →

<!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>

Exemplo

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

Experimente você mesmo →

<!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>

Exemplo

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

Experimente você mesmo →

<!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>

Modo estrito de JavaScript

No modo estrito do JavaScript, se o primeiro argumento do método apply() não for um objeto, torna-se o proprietário (objeto) da função invocada. No modo "não estrito", torna-se o objeto global.