0Pricing
JavaScript Academy · Aula

Mixins (introdução) — reutilização simples sem hierarquias profundas

Reutilize pequenas capacidades sem herança profunda: mixins de objetos e protótipos, pequenas fábricas e dicas simples de segurança

Mixins (introdução) — reutilização simples sem hierarquias profundas é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 3 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.

Por que usar misturas (com moderação)?

Objetivo: compartilhar pequenas capacidades sem árvores profundas.

  • Objeto de mistura com métodos pequenos
  • Aplique-o ao protótipo de uma classe
  • Ou adicione-o a um único objeto, se necessário
  • Mantenha os nomes exclusivos e as unidades pequenas
Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 1

Criar uma mistura

Uma mistura é simplesmente um objeto com métodos para compartilhar entre tipos.

// A simple mixin: adds timestamp helpers
const timeMixin = {
  setCreatedNow: function () {
    this.createdAt = new Date(0); // fixed for demo output
  },
  ageMs: function () {
    if (!this.createdAt) return 0;
    return 1234; // fixed number for a stable demo
  }
};

console.log("mixin keys:", Object.keys(timeMixin));
Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 2

Mistura no protótipo

Copie os métodos da mistura para Class.prototype para que todas as instâncias obtenham a capacidade.

// Apply the mixin to all instances via the prototype
class Note {
  constructor(text) {
    this.text = text;
  }
}

// Copy methods to the prototype so every instance can use them
Object.assign(Note.prototype, timeMixin);

const n = new Note("hello");
n.setCreatedNow();
console.log("ageMs:", n.ageMs());
Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 3

Mistura apenas em uma instância

Use Object.assign(obj, mixin) para adicionar capacidades a um objeto sem alterar uma classe.

// You can also mix into just one instance
const single = { name: "one" };
Object.assign(single, timeMixin);
single.setCreatedNow();
console.log("single ageMs:", single.ageMs());
Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 4

Fábrica + mistura

Uma pequena fábrica pode criar primeiro o objeto básico; depois, você adiciona o comportamento extra da mistura.

// Factory + mixin: build an object then add abilities
function makeUser(name) {
  return { name: name };
}

const u = makeUser("Ayla");
Object.assign(u, timeMixin);
u.setCreatedNow();
console.log("user ageMs:", u.ageMs());
Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 5

Boas práticas

Dicas:

  • Mantenha as misturas pequenas e focadas (2–3 métodos).
  • Evite conflitos de nomes; escolha nomes de métodos claros.
  • Prefira a composição com misturas a árvores profundas de classes.
  • Teste os métodos adicionados pela mistura como qualquer função.
Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 6

Questionário sobre aplicação de misturas

Verificação rápida: aplique uma mistura a uma classe.

Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 7

Resumo

Resumo: defina um objeto de mistura pequeno, copie-o para um protótipo para todas as instâncias (ou para um único objeto) e mantenha os métodos pequenos para evitar complexidade.

Mixins (introdução) — reutilização simples sem hierarquias profundas — ilustração 8

Perguntas Frequentes

A aula “Mixins (introdução) — reutilização simples sem hierarquias profundas” é grátis?

Sim — o texto completo de “Mixins (introdução) — reutilização simples sem hierarquias profundas” é 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 “Mixins (introdução) — reutilização simples sem hierarquias profundas”?

Reutilize pequenas capacidades sem herança profunda: mixins de objetos e protótipos, pequenas fábricas e dicas simples de segurança 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 3 de 3.

Quanto tempo leva a aula “Mixins (introdução) — reutilização simples sem hierarquias profundas”?

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. Campos de classe, campos privados # e membros estáticos
  2. Herança, super e quando preferir composição
  3. Mixins (introdução) — reutilização simples sem hierarquias profundas
← Voltar para JavaScript Academy