aboutsummaryrefslogtreecommitdiff
path: root/files/pt-br/glossario/função/index.html
blob: e3a195cabd52e37db705993834041f6a0e483d6d (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
---
title: Função
slug: Glossario/Função
tags:
  - Glossário
  - Iniciante
  - Intro
  - JavaScript
translation_of: Glossary/Function
---
<p> </p>

<p>Uma <strong>função</strong> <strong>(function)</strong> é um fragmento<span id="result_box" lang="pt"><span> de código que pode ser invocado por outro código, por si mesmo ou uma {{Glossary ("variável")}} que se refere à função. </span><span>Quando uma função é invocada, o {{Glossary ("Argument", "argumento")}} é passado para a função como input (entrada) e a função pode opcionalmente retornar um output (saída).</span> <span>Uma função em {{glossary ("JavaScript")}} também é um {{glossary ("objeto")}}.</span></span></p>

<p><span id="result_box" lang="pt"><span>O nome da </span></span><span lang="pt"><span>função é um {{Glossary ("identificador")}} declarado como parte de uma declaração de função ou expressão de função.</span> <span>O nome da função {{Glossary ("escopo")}} depende se o nome da função é uma declaração ou expressão.</span></span></p>

<h3 id="Diferentes_tipos_de_funções">Diferentes tipos de funções</h3>

<p>Uma <strong>função anônima </strong>é uma função sem o nome da função:</p>

<pre class="brush: js">function () {};
// or using the ECMAScript 2015 arrow notation
() =&gt; {};
</pre>

<p> </p>

<p>Uma <strong>função nomeada</strong> é uma função com o nome da função:</p>

<pre class="brush: js">function foo() {};
// or using the ECMAScript 2015 arrow notation
const foo = () =&gt; {};
</pre>

<p>Uma <strong>função interna</strong> é uma função dentro de outra função (<code>square</code> nesse caso). Uma <strong>função externa</strong> é uma função contendo uma função (<code>addSquares</code> nesse caso):</p>

<pre class="brush: js">function addSquares(a,b) {
   function square(x) {
      return x * x;
   }
   return square(a) + square(b);
};
//Using ECMAScript 2015 arrow notation
const addSquares = (a,b) =&gt; {
   const square = x =&gt; x*x;
   return square(a) + square(b);
};
</pre>

<p>Uma <strong>função recursiva</strong> é uma função que invoca a si mesma. Veja {{Glossary("Recursão", "recursão")}}.</p>

<pre class="brush: js">function loop(x) {
   if (x &gt;= 10)
      return;
   loop(x + 1);
};
//Using ECMAScript 2015 arrow notation
const loop = x =&gt; {
   if (x &gt;= 10)
      return;
   loop(x + 1);
};
</pre>

<p><span id="result_box" lang="pt"><span>Uma<strong> Expressão de Função Invocada Imediatamente</strong></span></span><span lang="pt"><span> (IIFE em Inglês) é uma função que é invocada diretamente após a função ser carregada no compilador do navegador.</span> <span>A maneira de identificar um IIFE é localizar os parênteses extra esquerdo e direito no final da declaração da função.</span></span></p>

<pre class="brush: js">// Error (https://en.wikipedia.org/wiki/Immediately-invoked_function_expression)
/*
​function foo() {
    console.log('Hello Foo');
}();
*/

(function foo() {
    console.log("Hello Foo");
}());

(function food() {
    console.log("Hello Food");
})();

</pre>

<p><span id="result_box" lang="pt"><span>Se gostaria de saber mais sobre o IIFE, confira a seguinte página no Wikipédia</span></span> : <a href="https://en.wikipedia.org/wiki/Immediately-invoked_function_expression">Immediately Invoked Function Expression</a></p>

<h2 id="Leia_mais">Leia mais</h2>

<h3 id="Referência_técnica">Referência técnica</h3>

<ul>
 <li><a href="https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Fun%C3%A7%C3%B5es" title="https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Fun%C3%A7%C3%B5es">Funções</a></li>
 <li><a href="https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Funções Arrow</a></li>
</ul>