JavaScript Academy · Aula

Chamadas opcionais e acesso por índice

Use encadeamento opcional com chamadas e colchetes.

Chamadas opcionais e acesso por índice é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 4 de 4. 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 4 aulas no total.

Além da leitura de propriedades

O encadeamento opcional também oferece formas de chamar funções e acessar com segurança elementos de vetores ou elementos usando chaves dinâmicas.

const obj = { greet: () => "hi" };
console.log(obj.greet?.()); // "hi"

Chamadas opcionais de métodos

A forma ?.() chama uma função somente se ela existir. Se o método for nulo ou indefinido, ela retorna undefined em vez de gerar um erro.

const obj = {};
console.log(obj.greet?.()); // undefined, no error

Por que isso é importante

Sem esse recurso, chamar um método ausente gera um erro. A forma de chamada opcional protege de maneira clara contra funções de retorno opcionais.

function run(onDone) {
  onDone?.(); // safe whether or not onDone is provided
}
run();
run(() => console.log("done"));

Somente valores nulos ou indefinidos impedem a chamada

?.() só impede a chamada quando o valor é null ou undefined. Se ele for um valor que não é uma função, ainda ocorrerá um TypeError ao chamá-lo.

const obj = { greet: 42 };
try {
  obj.greet?.();
} catch (e) {
  console.log("not a function");
}

Acesso opcional por índice

A forma ?.[ ] lê um elemento somente se a base não for nula nem indefinida, sendo útil para vetores e chaves calculadas.

const arr = ["a", "b"];
console.log(arr?.[1]); // "b"
const none = null;
console.log(none?.[0]); // undefined

Chaves dinâmicas

O acesso por colchetes com ?. trata com segurança nomes de propriedades dinâmicos.

const data = { user: { name: "Mia" } };
const key = "name";
console.log(data.user?.[key]); // "Mia"

Vetores aninhados

É possível encadear o acesso opcional por índice em vetores ou objetos aninhados.

const grid = [[1, 2], [3, 4]];
console.log(grid?.[1]?.[0]); // 3
console.log(grid?.[5]?.[0]); // undefined

Chamada opcional do valor retornado

Você pode combinar as formas: ler um valor opcionalmente e depois chamá-lo também de forma opcional.

const handlers = { click: () => "clicked" };
console.log(handlers.click?.()); // "clicked"
console.log(handlers.hover?.()); // undefined

Combinando com valores padrão

Combine essas formas com ?? para fornecer um valor alternativo ao resultado.

const config = {};
const port = config.get?.() ?? 3000;
console.log(port); // 3000

Chamando métodos de vetores com segurança

O encadeamento opcional permite chamar um método em um vetor possivelmente ausente sem uma verificação de existência separada.

const state = { tags: null };
console.log(state.tags?.join(", ") ?? "none"); // "none"

Use onde a opcionalidade for real

Essas formas são especialmente úteis para funções de retorno opcionais e estruturas de dados incertas. Evite-as onde um valor deveria sempre existir, para que erros genuínos continuem aparecendo.

const events = { onSave: null };
events.onSave?.("payload"); // silently does nothing
console.log("continued");

Verificação rápida

Escolha a forma de chamada segura.

Recapitulação

O encadeamento opcional inclui ?.() para chamadas seguras de métodos e ?.[ ] para acesso seguro por índice ou por chave dinâmica. Ambos retornam undefined quando a base é nula ou indefinida, mas ainda geram um erro se algo que não é uma função for chamado. Combine-os com ?? para fornecer valores padrão e reserve-os para valores realmente opcionais.

Perguntas Frequentes

A aula “Chamadas opcionais e acesso por índice” é grátis?

Sim — o texto completo de “Chamadas opcionais e acesso por índice” é 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 4 aulas no total.

O que vou aprender em “Chamadas opcionais e acesso por índice”?

Use encadeamento opcional com chamadas e colchetes. 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 4 de 4.

Quanto tempo leva a aula “Chamadas opcionais e acesso por índice”?

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

← Voltar para JavaScript Academy