0Pricing
JavaScript Academy · Aula

Armadilhas da extração de métodos e aplicação parcial

Corrija a extração de métodos com call/apply/bind e aprenda pequenos padrões de aplicação parcial com bind e funções de seta envolventes

Armadilhas da extração de métodos e aplicação parcial é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 2 de 3. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de JavaScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de JavaScript Academy inclui 3 aulas no total.

Visão geral

Objetivo: manter this estável após a extração e preencher argumentos antecipadamente.

  • call(thisArg, a, b)
  • apply(thisArg, [a, b])
  • bind(thisArg, a) → retorna uma função nova
  • Aplicação parcial com bind ou uma pequena função de seta
Armadilhas da extração de métodos e aplicação parcial — ilustração 1

Armadilha da extração

Chamar como obj.method() funciona, mas extrair a função faz o objeto ser perdido e quebra this.

// Extraction loses this
const user = {
  name: "Ayla",
  label: function (prefix) {
    return prefix + ":" + this.name;
  }
};

console.log("method call:", user.label("Hi")); // "Hi:Ayla"

// Extract
const f = user.label;
console.log("extracted:", f("Hi")); // this is missing -> "Hi:undefined" (in strict mode this is undefined)
Armadilhas da extração de métodos e aplicação parcial — ilustração 2

call/apply para uso único

call e apply permitem definir this para uma única invocação.

// Fix by passing this explicitly using call/apply
console.log("call :", f.call(user, "Hi"));   // "Hi:Ayla"
console.log("apply:", f.apply(user, ["Yo"])); // "Yo:Ayla"
Armadilhas da extração de métodos e aplicação parcial — ilustração 3

bind para reutilização

bind cria uma função que se lembra de this. Chame-a muitas vezes sem vinculá-la novamente.

// bind returns a new function with this fixed
const bound = f.bind(user);
console.log("bound once:", bound("Hey")); // "Hey:Ayla"
console.log("bound again:", bound("Yo")); // "Yo:Ayla"
Armadilhas da extração de métodos e aplicação parcial — ilustração 4

Aplicação parcial (simples)

Use bind para preencher antecipadamente os primeiros argumentos ou uma pequena função de seta de encapsulamento para fixar valores e this.

// Partial application: pre-fill arguments
function add(a, b, c) { return a + b + c; }

// Using bind: pre-fill a=10
const add10 = add.bind(null, 10);
console.log("add10(1,2):", add10(1, 2)); // 13

// Using an arrow wrapper: pre-fill prefix
const labelHi = function (obj) {
  return function () { return obj.label("Hi"); };
}(user);

console.log("arrow partial:", labelHi()); // "Hi:Ayla"
Armadilhas da extração de métodos e aplicação parcial — ilustração 5

Padrões práticos

Dicas:

  • Métodos extraídos: use bind uma vez e reutilize.
  • Chamadas únicas: use call/apply.
  • Precisa preencher argumentos antecipadamente? Use bind ou uma pequena função de seta de encapsulamento.
  • Mantenha as funções auxiliares pequenas e dê nomes claros a elas.
Armadilhas da extração de métodos e aplicação parcial — ilustração 6

Questionário sobre bind e call/apply

Verificação rápida: preserve this e preencha argumentos antecipadamente.

Armadilhas da extração de métodos e aplicação parcial — ilustração 7

Recapitulação

Recapitulação: a extração faz this ser perdido. Use call/apply para chamadas únicas e bind para fixar this e reutilizar. Para aplicações parciais, use bind ou uma pequena função de seta para preencher valores antecipadamente.

Armadilhas da extração de métodos e aplicação parcial — ilustração 8

Perguntas Frequentes

A aula “Armadilhas da extração de métodos e aplicação parcial” é grátis?

Sim — o texto completo de “Armadilhas da extração de métodos e aplicação parcial” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de JavaScript Academy, atualize para CoddyKit PRO. O curso de JavaScript Academy inclui 3 aulas no total.

O que vou aprender em “Armadilhas da extração de métodos e aplicação parcial”?

Corrija a extração de métodos com call/apply/bind e aprenda pequenos padrões de aplicação parcial com bind e funções de seta envolventes Você pratica JavaScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar JavaScript Academy?

Nenhuma experiência prévia é necessária. JavaScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 2 de 3.

Quanto tempo leva a aula “Armadilhas da extração de métodos e aplicação parcial”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de JavaScript Academy?

Sim. Cada aula de JavaScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. this léxico versus dinâmico; revendo as arrow functions
  2. Armadilhas da extração de métodos e aplicação parcial
  3. Alternativas funcionais — passar contexto, closures e pequenos auxiliares
← Voltar para JavaScript Academy