Tutorial de JS

JS HOME Introdução JS JS Para onde Saída JS Declarações JS Sintaxe JS Comentários JS Variáveis ​​JS JS Let JS Const Operadores JS JS Aritmética Atribuição de JS Tipos de dados JS Funções JS Objetos JS Eventos JS Strings JS Métodos de string JS Pesquisa de String JS Modelos de String JS Números JS Métodos de número JS Matrizes JS Métodos de matriz JS Classificação de matriz JS Iteração de matriz JS Const da matriz JS Datas JS Formatos de data JS Métodos de obtenção de data JS Métodos de conjunto de datas JS JS Math JS Aleatório JS Booleanos Comparações JS Condições JS Interruptor JS Circuito JS para JS Loop Para Entrada JS Loop Para De JS Loop Enquanto Quebra de JS Iteráveis ​​JS Conjuntos JS Mapas JS Tipo JS de Conversão de tipo JS JS bit a bit JS RegExp Erros JS Escopo JS Içamento JS Modo estrito JS JS esta palavra-chave Função de seta JS Classes JS JS JSON Depuração JS Guia de estilo JS Práticas recomendadas de JS Erros de JS Desempenho JS Palavras reservadas JS

Versões JS

Versões JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Edge Histórico de JS

Objetos JS

Definições de objeto Propriedades do objeto Métodos de objeto Exibição de objetos Acessadores de objetos Construtores de objetos Protótipos de Objetos Iteráveis ​​de objeto Conjuntos de objetos Mapas de objetos Referência do objeto

Funções JS

Definições de função Parâmetros de função Invocação de função Chamada de Função Função Aplicar Fechamentos de Função

Classes JS

Introdução à aula Herança de classe Classe Estática

JS Assíncrono

Retornos de chamada JS JS Assíncrono Promessas JS JS Async/Aguardar

JS HTML DOM

Introdução ao DOM Métodos DOM Documento DOM Elementos DOM HTML DOM Formulários DOM CSS DOM Animações DOM Eventos DOM Ouvinte de eventos DOM Navegação DOM Nós DOM Coleções DOM Listas de nós DOM

BOM do navegador JS

Janela JS Tela JS Localização JS Histórico de JS Navegador JS Alerta pop-up JS Temporização JS Cookies JS

APIs da Web JS

Introdução à API da Web API de formulários da Web API de histórico da web API de armazenamento da Web API do trabalhador da Web API de busca da Web API de geolocalização da Web

JS AJAX

Introdução AJAX AJAX XML Http Solicitação AJAX Resposta AJAX Arquivo XML AJAX PHP AJAX ASP AJAX Banco de dados AJAX Aplicativos AJAX Exemplos AJAX

JS JSON

Introdução JSON Sintaxe JSON JSON x XML Tipos de dados JSON Análise JSON JSON Stringify Objetos JSON Matrizes JSON Servidor JSON JSON PHP HTML JSON JSON JSONP

JS x jQuery

Seletores jQuery HTML jQuery jQuery CSS jQuery DOM

Gráficos JS

Gráficos JS Tela JS JS Plotly JS Chart.js JS Google Chart JS D3.js

Exemplos JS

Exemplos JS JS HTML DOM Entrada HTML JS Objetos HTML JS Eventos HTML JS Navegador JS Editor JS Exercícios JS Teste JS Certificado JS

Referências JS

Objetos JavaScript Objetos HTML DOM


Definições de função JavaScript


As funções JavaScript são definidas com a palavra- functionchave.

Você pode usar uma declaração de função ou uma expressão de função .


Declarações de função

Anteriormente neste tutorial, você aprendeu que as funções são declaradas com a seguinte sintaxe:

function functionName(parameters) {
  // code to be executed
}

As funções declaradas não são executadas imediatamente. Eles são "salvos para uso posterior" e serão executados posteriormente, quando forem invocados (chamados).

Exemplo

function myFunction(a, b) {
  return a * b;
}

Os pontos e vírgulas são usados ​​para separar instruções JavaScript executáveis.
Como uma declaração de função não é uma instrução executável, não é comum terminá-la com um ponto e vírgula.


Expressões de função

Uma função JavaScript também pode ser definida usando uma expressão .

Uma expressão de função pode ser armazenada em uma variável:

Exemplo

const x = function (a, b) {return a * b};

Depois que uma expressão de função foi armazenada em uma variável, a variável pode ser usada como uma função:

Exemplo

const x = function (a, b) {return a * b};
let z = x(4, 3);

A função acima é na verdade uma função anônima (uma função sem nome).

As funções armazenadas em variáveis ​​não precisam de nomes de função. Eles são sempre invocados (chamados) usando o nome da variável.

A função acima termina com um ponto e vírgula porque faz parte de uma instrução executável.



O construtor Function()

Como você viu nos exemplos anteriores, as funções JavaScript são definidas com a palavra- functionchave.

As funções também podem ser definidas com um construtor de função JavaScript embutido chamado Function().

Exemplo

const myFunction = new Function("a", "b", "return a * b");

let x = myFunction(4, 3);

Na verdade, você não precisa usar o construtor de função. O exemplo acima é o mesmo que escrever:

Exemplo

const myFunction = function (a, b) {return a * b};

let x = myFunction(4, 3);

Na maioria das vezes, você pode evitar usar a palavra- newchave em JavaScript.


Função de elevação

Anteriormente neste tutorial, você aprendeu sobre "içamento" ( JavaScript Hoisting ).

O içamento é o comportamento padrão do JavaScript de mover declarações para o topo do escopo atual.

O içamento se aplica a declarações de variáveis ​​e declarações de funções.

Por causa disso, as funções JavaScript podem ser chamadas antes de serem declaradas:

myFunction(5);

function myFunction(y) {
  return y * y;
}

As funções definidas usando uma expressão não são içadas.


Funções de auto-invocação

As expressões de função podem ser "auto-invocadas".

Uma expressão de auto-invocação é invocada (iniciada) automaticamente, sem ser chamada.

As expressões de função serão executadas automaticamente se a expressão for seguida por ().

Você não pode auto-invocar uma declaração de função.

Você precisa adicionar parênteses ao redor da função para indicar que é uma expressão de função:

Exemplo

(function () {
  let x = "Hello!!";  // I will invoke myself
})();

A função acima é na verdade uma função auto-invocada anônima (função sem nome).


Funções podem ser usadas como valores

As funções JavaScript podem ser usadas como valores:

Exemplo

function myFunction(a, b) {
  return a * b;
}

let x = myFunction(4, 3);

As funções JavaScript podem ser usadas em expressões:

Exemplo

function myFunction(a, b) {
  return a * b;
}

let x = myFunction(4, 3) * 2;

Funções são objetos

O typeofoperador em JavaScript retorna "função" para funções.

Mas, as funções JavaScript podem ser melhor descritas como objetos.

As funções JavaScript têm propriedades e métodos .

A arguments.lengthpropriedade retorna o número de argumentos recebidos quando a função foi invocada:

Exemplo

function myFunction(a, b) {
  return arguments.length;
}

O toString()método retorna a função como uma string:

Exemplo

function myFunction(a, b) {
  return a * b;
}

let text = myFunction.toString();

Uma função definida como propriedade de um objeto é chamada de método para o objeto.
Uma função projetada para criar novos objetos é chamada de construtor de objetos.


Funções de seta

As funções de seta permitem uma sintaxe curta para escrever expressões de função.

Você não precisa da palavra- functionchave, da palavra- returnchave e das chaves .

Exemplo

// ES5
var x = function(x, y) {
  return x * y;
}

// ES6
const x = (x, y) => x * y;

As funções de seta não têm seu próprio this. Eles não são adequados para definir métodos de objetos .

As funções de seta não são içadas. Eles devem ser definidos antes de serem usados.

Usar const é mais seguro do que usar var, porque uma expressão de função é sempre um valor constante.

Você só pode omitir a returnpalavra-chave e as chaves se a função for uma única instrução. Por isso, pode ser um bom hábito mantê-los sempre:

Exemplo

const x = (x, y) => { return x * y };

As funções de seta não são suportadas no IE11 ou anterior.