Compartilhamento de tecnologia

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

função

Cada função é uma instância do tipo Function, e Function também possui propriedades e métodos, assim como outros tipos de referência. Funções são objetos, e o nome da função é um ponteiro para o objeto da função e não está necessariamente vinculado à própria função.

Definição declarativa de função de definição de função

function sum (n1,n2){
return n1+n2;
}

Expressão de função de definição de função

let sum = function(n1,n2){
return n1+n2;
};

função de seta de definição de função

let sum = (n1,n2)=>{
return n1+n2;
};

construtor de definição de função

let sum = new Function("n1","n2","return n1+n2");
/*这个构造函数接收任意多个字符串参数，
最后一个参数始终会被当成函数体，
而之前的参数都是新函数的参数*/

função de seta

As funções de seta podem ser usadas em qualquer lugar onde uma expressão de função possa ser usada.

let sum = (a,b)=>{
return a+b;
};
let sum1 = function(a,b){
return a+b;
};
//箭头函数适合嵌入函数的场景
let arr = [1,2,3];
console.log(arr.map(function(i) {return i+1;}));
console.log(arr.map((i)=>{return i+1;}));
//二者结果一样，但是箭头函数更为简洁
 
//如果只有一个参数，括号可以不用。只有没有参数，或者多个参数的情况下，才使用括号
 
let double = (x)=>{return 2*x;};
let triple = x => {return 3*x};
 
//箭头函数也可以不使用大括号，但这样会改变函数的行为。使用大括号就说明包含函数体，可以在一
//个函数中包含多条语句，跟常规函数一样。如果不使用，后面只能有一行代码。
 
let double = (x)=>{return 2*x;};
let triple = x=>3*x;
 

Embora as funções de seta tenham sintaxe simples, há muitas situações em que elas não são adequadas. As funções de seta não podem usar argumentos, super, new.target, nem podem ser usadas como construtores. Além disso, as funções de seta não possuem um atributo protótipo.

Parâmetros em funções de seta

A função é definida usando sintaxe de seta, portanto, os parâmetros passados ​​para a função não podem ser acessados ​​usando a palavra-chave argumentos, mas só podem ser acessados ​​por meio dos parâmetros nomeados definidos.

function foo() { 
 console.log(arguments[0]); 
} 
foo(5); // 5 
let bar = () => { 
 console.log(arguments[0]); 
}; 
bar(5); // ReferenceError: arguments is not defined

Nome da função

Uma função pode ter vários nomes.

function sum(num1, num2) { 
 return num1 + num2; 
} 
console.log(sum(10, 10)); // 20 
let anotherSum = sum; 
console.log(anotherSum(10, 10)); // 20 
sum = null; 
console.log(anotherSum(10, 10)); // 20

Valor do parâmetro padrão

Você pode atribuir um valor padrão a um parâmetro usando = após o parâmetro na definição da função.

function makeKing(name = 'Henry') { 
 return `King ${name} VIII`; 
} 
console.log(makeKing('Louis')); // 'King Louis VIII' 
console.log(makeKing()); // 'King Henry VIII'

Os valores de parâmetro padrão não estão limitados a valores primitivos ou tipos de objetos; os valores retornados pela função de chamada também podem ser usados

let romanNumerals = ['I', 'II', 'III', 'IV', 'V', 'VI']; 
let ordinality = 0; 
function getNumerals() { 
 // 每次调用后递增
 return romanNumerals[ordinality++]; 
} 
function makeKing(name = 'Henry', numerals = getNumerals()) { 
 return `King ${name} ${numerals}`; 
} 
console.log(makeKing()); // 'King Henry I'
console.log(makeKing('Louis', 'XVI')); // 'King Louis XVI' 
console.log(makeKing()); // 'King Henry II' 
console.log(makeKing()); // 'King Henry III'

Expansão e coleta de parâmetros

ES6 adiciona um novo operador de extensão, que pode ser usado para operar e combinar dados de coleta de forma muito concisa. O cenário mais útil para o operador spread é a lista de parâmetros em uma definição de função, onde ele pode aproveitar ao máximo a digitação fraca e os parâmetros de comprimento variável da linguagem. O operador spread pode ser usado para passar parâmetros ao chamar uma função ou para definir parâmetros de função.

Parâmetros estendidos

let values = [1, 2, 3, 4]; 
function getSum() { 
 let sum = 0; 
 for (let i = 0; i < arguments.length; ++i) { 
 sum += arguments[i]; 
 } 
 return sum; 
} 
//不使用扩展操作符实现累加
console.log(getSum.apply(null,values));
 
//使用扩展操作符
console.log(getSum(...values));

Coletar parâmetros

Se houver parâmetros nomeados na frente dos parâmetros coletados, apenas os parâmetros restantes serão coletados; caso contrário, será obtido um array vazio; Como o resultado da coleta de parâmetros é variável, ele só pode ser usado como último parâmetro.

 
function getProduct(...values,lastValue){}//不可以
function ignoreFirst(firstValue,...values){console.log(values)}//可以
ignoreFirst(); // [] 
ignoreFirst(1); // [] 
ignoreFirst(1,2); // [2] 
ignoreFirst(1,2,3); // [2, 3]

Declaração de função e expressão de função

Antes de qualquer código ser executado, o mecanismo JavaScript lê a declaração da função e gera a definição da função no contexto de execução. A expressão da função deve esperar até que o código seja executado em sua linha antes que a definição da função seja gerada no contexto de execução.

// 没问题 
console.log(sum(10, 10)); 
function sum(num1, num2) { 
 return num1 + num2; 
}
/*函数声明提升*/
 
 
// 会出错
console.log(sum(10, 10)); 
let sum = function(num1, num2) { 
 return num1 + num2; 
};