Discuta diferentes tipos de estratégias de

carregamento usados na sua aplicação Angular

Este tipo de pergunta é feita para verificar a profundidade do uso do

angular. Na maioria das vezes respondemos lazy loading e eager

loading, mas há mais um na lista que devemos considerar….

Eager Loading
Os módulos de recursos em Eager Loading seriam carregados antes

do início da aplicação. Esta é a estratégia padrão de carregamento

de módulo.

Lazy Loading
Os módulos de recursos em Lazy Loading seriam carregados sob

demanda após o início da aplicação. Isso ajuda a iniciar a aplicação

mais rápido.

Pre-Loading
Módulos de recursos em PreLoading seriam carregados

automaticamente após o início da aplicação.

Por que usamos o operador Pipe no RXJS. Qual é a

utilidade disso?
In my recent interview this question was asked and what I know

that we are adding pipe to support in higher angular versions but

when I searched more in Google, I found actual use of pipe()

1. pipe() a função leva como seus argumentos as funções

que você deseja combinar e retorna uma nova função

que, quando executada, executa as funções compostas

em sequência.

2. podemos usar o método pipe() para passar uma ou

várias funções de operador que podem trabalhar e

transformar cada item na coleção observable.

Qual é a diferença entre usar o Async Pipe e a

função subscribe em uma aplicação Angular?
Qual é a diferença entre Promise e Observable?

Qual é a diferença entre Event Emitter e Subjects?

Qual é a diferença entre Observable e Subject?

Qual é a diferença entre Activated Route e Activated

route Snapshot?
A principal diferença entre a activated Route e o Activated Route

Snapshot é que, com activated route, podemos dar um subscribe em

um Observable, enquanto o activated route snapshot emite apenas

um valor.

______________________________________________
1.

O que é Angular?

Esconder resposta

Angular é um framework para construção de aplicativos web, desenvolvido pela

equipe do Google. Ele permite criar aplicativos web dinâmicos, SPA (Single Page
Applications) e mobile com uma sintaxe clara e concisa em TypeScript, que é um
superset do JavaScript. O Angular é baseado em componentes, onde cada
componente possui seu próprio template HTML, estilo e comportamento, o que
permite criar aplicativos modulares e escaláveis. Ele também oferece recursos como
injeção de dependência, roteamento, validação de formulários e integração com o
back-end de serviços web.
2.

Para que serve o Angular?

Esconder resposta

O Angular é usado para criar aplicativos Web dinâmicos, escaláveis e de alto

desempenho com recursos avançados de front-end, como vinculação de dados
bidirecional, injeção de dependência, roteamento, criação de formulários,
animações, testes automatizados e muito mais.
3.

Angular 2 vs AngularJS: qual a diferença?

Esconder resposta

Os dois são semelhantes. Ambos são frameworks front-end mantidos pela Google.
No entanto, também tem suas diferenças já que o Angular 2 não é apenas uma
versão atualizada do AngularJS. O Angular 2 é um novo framework escrito do zero.
Portanto, se alguém estiver procurando atualizar ou mudar para o Angular 2 a partir
do AngularJS, será necessário reescrever todo o código.
Nesta ou em outras perguntas de entrevista sobre o Angular 2, se você puder usar
exemplos práticos ou experiências pessoais para responder à pergunta, isso será
vantajoso e fará você se diferenciar da concorrência.
4.

Nomeie os módulos que você deve importar para usar [(ngModel)] e formulários

reactive.

Esconder resposta

FormsModule e Reactiveforms Module

5.

Como funciona o Transpiling no Angular?

Esconder resposta

Você já deve saber que quando o código-fonte de uma linguagem de programação é

convertido em outra, o processo é chamado de Transpiling. No Angular, isso se
refere principalmente à conversão de TypeScript para JavaScript. Como
desenvolvedor, você pode escrever o código da sua aplicação Angular em
TypeScript ou Dart e depois transpilá-lo para JavaScript para, então, executar a
aplicação. Esse processo é interno e automático.

Esse é o tipo de pergunta de entrevista Angular que ajuda o entrevistador a

entender a profundidade do seu conhecimento em desenvolvimento Angular.
6.

O que quer dizer compilação AOT?

Esconder resposta

AOT é a abreviação de compilação ahead-of-time. Para aplicações Angular, isso se

refere a escrever o código da aplicação e compilá-lo no momento da construção, ou
seja, antes que a aplicação seja executada no navegador. Essa é uma abordagem
alternativa para a compilação just-in-time, em que a compilação de código é feita
imediatamente antes de executar a aplicação no navegador. Você pode aumentar o
desempenho da aplicação ao utilizar a compilação AOT.

Esse tipo de pergunta em entrevistas Angular avalia sua sagacidade e garante que
você conhece abordagens alternativas para diferentes cenários.
7.

Quais são algumas estratégias de detecção de mudanças com Angular?

Esconder resposta

As estratégias de detecção de mudanças no AngularJS são:

Default: é a estratégia padrão de detecção de mudanças. Nesta estratégia, o

Angular verifica toda a árvore de componentes, independentemente de onde a
mudança ocorreu.

OnPush: esta estratégia é usada quando o desenvolvedor deseja informar ao

Angular que serão seguidas as condições de otimização de desempenho. Isso
informa ao Angular que o componente do aplicativo depende apenas da entrada e
que os objetos passados devem ser considerados imutáveis. Esta estratégia usa o
princípio do autômato, no qual o estado atual depende apenas dos valores de
entrada.

Saber sobre as estratégias de detecção de mudanças é importante para o

desenvolvimento de aplicativos Angular e é um tópico comum em entrevistas de
emprego relacionadas a Angular.
8.

Como funciona o Mecanismo de Detecção de Mudanças do Angular?

Esconder resposta
O mecanismo de detecção de mudanças do Angular é responsável por rastrear
alterações em propriedades de componentes e atualizar a visualização (view)
correspondente. O Angular usa um fluxo unidirecional de dados, mesmo quando a
diretiva ngModel é usada para implementar o binding bidirecional.

O mecanismo de detecção de mudanças segue uma abordagem de fluxo apenas

para frente (forward-only flow), começando do componente raiz e finalizando no
último componente. Cada componente aponta para o componente filho, mas o
inverso não é verdadeiro, ou seja, o componente filho não aponta para o
componente pai. Além disso, o Angular não requer um loop de digestão ($digest
loop), pois as mudanças são detectadas automaticamente pelo mecanismo de
detecção de mudanças. Quando uma mudança é detectada, o Angular atualiza a
visualização correspondente.

Quando você for responder a uma pergunta como essa em uma entrevista de
trabalho Angular, é melhor incluir alguma experiência prévia para expandi-la e
mostrar que já lidou com situações que envolvem esse mecanismo..
9.

Quando o modelo de dados é atualizado fora da Zone, como atualizar a

visualização?

Esconder resposta

Os seguintes métodos podem ser utilizados para atualizar a visualização:

1. O método ApplicationRef.prototype.run pode ajudar a atualizar a

visualização executando a detecção de mudanças em toda a árvore de

componentes;

2. O método NgZone.prototype.run pode alcançar o mesmo resultado

executando a detecção de mudanças na árvore completa de forma similar.

 O método run chama internamente o método tick, e a função a ser

realizada é passada por parâmetro antes do tick;

3. O método ChangeDetectorRef.prototype.detectChanges executa a

detecção de mudanças no componente atual e em seus filhos.

10.

O que é lazy loading e quando é necessário usá-lo?

Esconder resposta

Lazy loading é uma técnica utilizada em programação para atrasar o carregamento

de um recurso até o momento em que ele é necessário. Na web, é comum o uso de
lazy loading para atrasar o carregamento de imagens, vídeos ou outros tipos de
conteúdo que não são necessários no momento da abertura da página, mas que
podem ser necessários posteriormente.

No contexto do Angular, o lazy loading é utilizado para carregar módulos sob

demanda, ou seja, apenas quando o usuário acessa uma determinada
funcionalidade que requer aquele módulo específico.
11.

Qual a diferença entre testes unitários e testes um-para-um? Mencione algumas

ferramentas de teste para aplicativos Angular.

Esconder resposta

Quando se deseja verificar o funcionamento adequado de segmentos isolados, são

usados testes unitários, também conhecidos como unit tests, que fazem a
verificação desses segmentos. Por outro lado, quando se quer garantir que
conjuntos inteiros de componentes estão funcionando corretamente e em sincronia,
e que o aplicativo está funcionando como desejado, pode-se usar testes
um-para-um. Simulações de interação do usuário são frequentemente usadas em
testes um-para-um para garantir que os aplicativos estejam funcionando
corretamente. Duas boas ferramentas de teste são Jasmine e Karma.
12.

Para que são usados os módulos Core e Shared?

Esconder resposta

Para todos os módulos, componentes, etc. que não precisam ocorrer em uma única
cópia para o aplicativo, mas devem ser importados em diferentes módulos, existe
um módulo genérico chamado módulo Shared. Para armazenar serviços que
precisam ocorrer em uma única cópia em todo o aplicativo, é usado um módulo
Core. Por exemplo, quando a autorização do usuário para armazenamento de
dados é necessária, a autorização do usuário aparece como um módulo core
(central).
13.

O que são expressões angulares?

Esconder resposta

As expressões angulares são usadas no Angular para exibir valores de variáveis e

executar operações aritméticas, lógicas e outras operações em HTML. Elas são
escritas entre chaves duplas ({{ }}) e são avaliadas como JavaScript no contexto
atual do componente. Elas podem ser usadas para exibir o valor de uma variável em
um modelo HTML, bem como para executar operações em tempo real em dados de
entrada.
14.

O que são os templates em Angular?

Esconder resposta

Em Angular, um template é uma representação visual de como os dados devem ser

exibidos na interface do usuário. Ele é definido com HTML, juntamente com
algumas extensões especiais para Angular, como a inclusão de diretivas e binding
de dados. Os templates são usados para definir a estrutura da página, a disposição
dos elementos e o seu estilo, além de permitir a exibição de dados dinâmicos.

Seu uso permite que os desenvolvedores Angular criem interfaces de usuário ricas
e dinâmicas, com lógica e interações complexas, de forma mais fácil e eficiente do
que em outras abordagens de desenvolvimento de interfaces.
15.

O que é interpolação de strings em Angular?

Esconder resposta

A interpolação de strings em Angular é uma maneira de incorporar valores de

variáveis ​ou expressões em um template. É indicada pelo uso de chaves duplas {{}}
e permite que você exiba dinamicamente valores de variáveis ​ou resultados de
expressões dentro do template.
16.

Qual é a diferença entre uma annotation e decorator em Angular?

Esconder resposta

Em Angular, annotations e decorators são conceitos diferentes, mas frequentemente

confundidos.

● Annotations são usadas para definir metadados adicionais em uma classe

ou propriedade, para que o Angular possa inferir o comportamento

esperado e fazer as devidas configurações. Por exemplo, a anotação

@Component é usada para definir um componente Angular, enquanto a

anotação @Input é usada para definir uma propriedade de entrada em um

componente.
 ● Decorators, por outro lado, são funções que são usadas para modificar o

comportamento de uma classe ou propriedade. Eles são geralmente

usados em conjunto com annotations, mas não são exclusivos do Angular.

Um exemplo comum de um decorator em Angular é o @HostListener, que

permite que um componente ouça eventos em elementos DOM

específicos.

17.

O que são controladores em Angular?

Esconder resposta

Em Angular, os controladores são classes que desempenham o papel de

intermediários entre o modelo e a exibição de dados. Eles são responsáveis por
gerenciar as informações da página, controlar a lógica de negócios e se comunicar
com os serviços. Eles são criados usando a injeção de dependência, onde as
dependências são declaradas como parâmetros no construtor da classe. Além
disso, você ainda pode dividir os controladores em subcontroladores para organizar
o código.
18.

O que são diretivas em Angular?

Esconder resposta

Em Angular, as diretivas são uma forma de estender o HTML com novos

comportamentos e recursos, permitindo a criação de elementos e atributos
personalizados. As diretivas podem ser divididas em três tipos principais: diretivas
de componente, diretivas de atributo e diretivas estruturais.

● Diretivas de componente são usadas para criar novos elementos de

interface do usuário, chamados de componentes, que encapsulam seu

 próprio template e lógica de comportamento. Elas são declaradas usando

a anotação @Component em uma classe do TypeScript.

● Diretivas de atributo são usadas para adicionar comportamentos adicionais

a elementos HTML existentes, como validação de entrada de dados,

formatação ou interação. Elas são declaradas usando a anotação

@Directive em uma classe do TypeScript.

● Diretivas estruturais são usadas para manipular a estrutura do DOM e a

renderização de elementos, permitindo a criação de estruturas

condicionais ou repetitivas. Algumas das diretivas estruturais mais comuns

incluem *ngIf, *ngFor e *ngSwitch.

19.

O que é vinculação de dados?

Esconder resposta

Vinculação de dados (ou data binding, em inglês) é um recurso presente em muitos

frameworks e bibliotecas de desenvolvimento web, incluindo o Angular. Ele permite
que as mudanças feitas em um elemento da interface do usuário sejam refletidas
automaticamente em outros elementos que dependem dele, sem a necessidade de
escrever código adicional para atualizar manualmente esses elementos.

São três os tipos de data binding usados em Angular:

● Interpolação: permite que uma expressão seja incorporada em uma string

que é renderizada no DOM. A interpolação é usada principalmente para

exibir valores dinâmicos em uma página.

 ● Propriedade: permite que as propriedades de um elemento sejam

atualizadas automaticamente quando um valor de um componente é

alterado.

● Evento: permite que um evento de um elemento (como um clique) seja

vinculado a uma função em um componente, permitindo que o

comportamento do elemento seja personalizado de acordo com as

necessidades do aplicativo.

20.

Quais são as principais vantagens do Angular sobre outros frameworks?

Esconder resposta

Algumas das principais vantagens do Angular sobre outros frameworks são:

● Grande ecossistema: Angular é um dos frameworks JavaScript mais

populares e tem uma grande comunidade de desenvolvedores que

contribuem para o seu ecossistema, criando bibliotecas, pacotes e

soluções para diversos problemas.

● MVC completo: O Angular é um framework completo que implementa o

padrão Model-View-Controller (MVC), permitindo uma estrutura clara e

organizada para o desenvolvimento de aplicações web.

● Two-way data binding: O Angular suporta vinculação de dados bidirecional,

o que significa que as alterações em um elemento da interface do usuário

(UI) são automaticamente refletidas no modelo de dados e vice-versa.

 ● Injeção de dependência: O Angular utiliza injeção de dependência para

gerenciar a instância de objetos e seus relacionamentos, o que ajuda a

tornar o código mais modular e fácil de testar.

● Ferramentas de desenvolvimento: O Angular vem com um conjunto

completo de ferramentas de desenvolvimento, como o Angular CLI, que

simplifica o processo de criação e manutenção de projetos, além de

facilitar o desenvolvimento de testes unitários e end-to-end.

21.

Para que serve um filter em Angular?

Esconder resposta

Em Angular, um filter, ou filtro, é usado para formatar ou filtrar dados exibidos em

uma página. Ele permite que você formate o valor de uma expressão antes de
exibi-la na visualização. Os filtros podem ser aplicados em expressões de dados de
binding, dentro de templates, controllers, services, entre outros.

Além disso, em Angular os filtros são funções JavaScript que podem ser definidas
globalmente ou localmente. Eles são aplicados aos dados usando a sintaxe de pipe
(|) e podem ser encadeados para criar efeitos mais complexos.
22.

O que é MVVM?

Esconder resposta

MVVM (Model-View-ViewModel) é um padrão de arquitetura de software, uma

extensão do MVC (Model-View-Controller). Ele é comumente usado em aplicativos
web para separar a lógica de negócios e a apresentação da interface do usuário.
Em MVVM, a View é responsável por exibir dados ao usuário e receber entrada do
usuário. O ViewModel é responsável por expor os dados e a lógica de negócios à
View, geralmente usando vinculação de dados para permitir que a View atualize
automaticamente quando os dados são alterados. O Model é responsável por
representar os dados e a lógica de negócios subjacentes.

No contexto do Angular, o ViewModel é representado pelo componente, que é

responsável por gerenciar a lógica de negócios e expor os dados para a View
usando vinculação de dados. A View é representada pelo template, que define a
aparência e o comportamento da interface do usuário. O Model pode ser
representado por serviços ou outras classes que representam os dados e a lógica
de negócios subjacentes.
23.

O que é eager loading?

Esconder resposta

Eager loading é uma técnica utilizada em programação para carregar dados de um

banco de dados em conjunto com uma consulta principal, evitando assim o
problema conhecido como N+1, que ocorre quando várias consultas são executadas
para recuperar os dados associados a uma consulta principal.

O eager loading carrega os dados necessários para uma determinada operação

antecipadamente, em vez de carregá-los sob demanda. Isso ajuda a evitar atrasos
no tempo de resposta, uma vez que as consultas secundárias não precisam ser
feitas mais tarde.
24.

O que são components, módulos e services em Angular?

Esconder resposta
Componentes (components), módulos e serviços (services) são todos elementos
fundamentais do Angular e usados na construção de aplicações web modulares e
escalares.

● Componentes: são responsáveis por controlar a exibição de elementos de

interface do usuário em uma página web. Cada componente é uma classe

que contém metadados, como o seletor, o template e o estilo, que definem

como o componente será renderizado na página. Eles também podem ter

lógica de negócios associada.

● Módulos: são conjuntos lógicos de componentes, serviços e outros

módulos que podem ser agrupados e reutilizados em diferentes partes do

aplicativo. Eles ajudam a organizar o código em pedaços menores e mais

gerenciáveis. Cada aplicativo Angular tem pelo menos um módulo raiz,

que é usado para inicializar o aplicativo.

● Serviços: são classes que fornecem funcionalidades específicas para

outras partes do aplicativo, como a busca de dados em um servidor, o

compartilhamento de dados entre componentes ou a validação de

formulários. Eles são injetados em componentes e outros serviços que os

usam para realizar suas funções.

25.

O que são Reactive Forms em Angular?

Esconder resposta

Reactive Forms em Angular é uma técnica para trabalhar com formulários reativos.
Com Reactive Forms, o estado do formulário é armazenado em um objeto
model-driven, que é atualizado continuamente à medida que o usuário interage com
o formulário. Em vez de responder a eventos do usuário, o Reactive Forms reage a
mudanças do estado do formulário, permitindo validação, formatação e envio de
dados em tempo real.
26.

Quais são as principais diferenças entre Angular 11 e Angular 12?

Esconder resposta

Algumas das principais diferenças entre o Angular 11 e o Angular 12 incluem:

● Melhorias de desempenho: O Angular 12 traz melhorias de desempenho

significativas em relação ao Angular 11, especialmente na compilação

just-in-time (JIT).

● Suporte de Webpack 5: O Angular 12 suporta o Webpack 5, que traz

várias melhorias, incluindo uma compilação mais rápida e melhorias na

otimização do tamanho do pacote.

● Compatibilidade com TypeScript 4.3: O Angular 12 é compatível com o

TypeScript 4.3, que traz várias melhorias de desempenho e usabilidade.

● Melhorias na vinculação de propriedade: O Angular 12 introduziu algumas

melhorias na vinculação de propriedade, tornando mais fácil para os

desenvolvedores vincular e passar propriedades entre componentes.

● Novas diretivas: O Angular 12 introduziu várias novas diretivas, como a

diretiva :is, que torna mais fácil escrever consultas de estilo CSS e a

diretiva :focus-visible, que torna mais fácil lidar com eventos de foco em

elementos de interface do usuário.

 ● Outras melhorias: O Angular 12 também inclui várias outras melhorias

menores, como aprimoramentos de usabilidade na CLI, melhorias na

documentação e suporte para mais recursos do EcmaScript.

27.

O que é vinculação de propriedade e por que é importante no Angular 12?

Esconder resposta

A vinculação de propriedade (ou property binding) é uma das técnicas fundamentais

do Angular para atualizar dinamicamente os valores das propriedades dos
elementos HTML. Isso permite que os dados sejam exibidos e atualizados em
tempo real na página, sem a necessidade de atualizar a página inteira.

A vinculação de propriedade é importante porque torna o desenvolvimento de

aplicativos Angular mais eficiente, permitindo que as alterações de dados sejam
exibidas de forma dinâmica. Além disso, ajuda a manter um código mais limpo e
fácil de ler e reduz a necessidade de código JavaScript personalizado para atualizar
manualmente os valores dos elementos HTML.
28.

Angular vs JQuery: Qual é a diferença?

Esconder resposta

Angular e jQuery são duas ferramentas diferentes com propósitos diferentes. O

jQuery é uma biblioteca de JavaScript que se concentra principalmente na
manipulação do DOM e no tratamento de eventos, enquanto o Angular é um
framework que ajuda a criar aplicativos web escaláveis e de fácil manutenção.

Algumas diferenças entre Angular e jQuery são:

 ● Propósito: jQuery é principalmente usado para manipulação de DOM,

enquanto o Angular é um framework completo para criação de aplicativos

web.

● Arquitetura: Angular é baseado em componentes, enquanto jQuery é

baseado em seletores.

● Linguagem: Angular é escrito em TypeScript, enquanto o jQuery é escrito

em JavaScript.

● Escopo: o escopo do Angular é limitado a um componente ou módulo,

enquanto o jQuery é global.

● Performance: o Angular pode ser mais lento do que o jQuery em casos

simples de manipulação do DOM, mas é mais rápido e eficiente em

aplicativos maiores e mais complexos.

29.

O que é um provider em Angular?

Esconder resposta

Um provider é uma classe que fornece um valor ou uma instância de um objeto para
a aplicação. Ele pode ser usado para injetar objetos em outros componentes ou
serviços, e é a maneira mais comum de fornecer um objeto ou serviço para a
aplicação.

Os providers podem ser definidos em vários níveis, como no módulo raiz

(app.module.ts), em um módulo de funcionalidade ou em um componente
específico. Além disso, existem três tipos de providers em Angular: provider de
serviço, provider de fábrica e provider de valor.
30.
O Angular suporta controladores aninhados?

Esconder resposta

Não, o Angular não suporta controladores aninhados. Ele usa um modelo de

componente em vez do modelo de controlador. Um componente encapsula a lógica
de visualização e comportamento em um único arquivo. O modelo de componente é
mais flexível e fácil de manter do que o modelo de controlador, que pode se tornar
complicado quando os controladores são aninhados.
31.

Qual é a principal diferença entre expressões angulares e expressões JavaScript?

Esconder resposta

A principal diferença entre expressões angulares e expressões JavaScript é que as

expressões angulares são avaliadas dentro do contexto do AngularJS, enquanto as
expressões JavaScript são avaliadas dentro do contexto do navegador.

As expressões angulares são usadas principalmente em templates HTML e

permitem que você incorpore valores dinâmicos em sua página. Por exemplo, você
pode usar uma expressão angular para exibir o valor de uma variável ou para
realizar uma operação matemática simples.

As expressões JavaScript, por outro lado, são escritas em JavaScript puro e são
avaliadas pelo navegador. Elas são usadas para manipular o DOM e para realizar
operações mais avançadas que as expressões angulares não podem realizar. Por
exemplo, você pode usar expressões JavaScript para acessar o DOM e adicionar ou
remover elementos da página.
32.

Qual é a diferença entre service() e factory()?

Esconder resposta
service() e factory() são dois tipos de provedores de serviços que podem ser usados
para criar objetos reutilizáveis em um aplicativo.

A principal diferença entre service() e factory() é que service() cria uma instância do
objeto usando um construtor, enquanto factory() retorna um objeto criado
manualmente.

O método service() requer uma função construtora, que é usada para criar um novo
objeto de serviço. A função construtora é chamada usando o operador new e é
instanciada como um objeto. O objeto é então retornado por meio do provedor de
serviço. Este objeto pode ser usado em outras partes do aplicativo, pois é uma
instância compartilhada.

Por outro lado, factory() retorna diretamente um objeto que pode ser usado em
outras partes do aplicativo. A função factory é chamada apenas uma vez e retorna
um objeto literal que é injetado no aplicativo.
33.

Qual é a diferença entre $scope e scope em Angular?

Esconder resposta

Em versões anteriores ao AngularJS 1.3, o escopo (scope) era um objeto JavaScript

que representava o modelo da visão. Já a partir da versão 1.3, o escopo foi
substituído pelo $scope para permitir a criação de um escopo isolado para cada
diretiva.

O $scope é um objeto que é injetado em um controlador, diretiva ou serviço do

AngularJS. Ele é usado para manter o estado de uma aplicação e para se
comunicar entre o modelo (dados) e a visão (interface do usuário).
Por outro lado, o escopo (scope) é uma propriedade da diretiva que define a
hierarquia de escopos para a diretiva. É usado para controlar a relação pai-filho
entre as diretivas e seus escopos.
34.

O que é scope hierarchy em Angular?

Esconder resposta

O termo "scope" refere-se a um objeto que atua como uma ligação entre o
controlador (controller) e a visão (view). O escopo pode ser definido como uma
coleção de objetos que contêm as propriedades, funções e outras informações que
precisam ser compartilhadas entre a visão e o controlador. A hierarquia de escopos
(scope hierarchy) é uma estrutura de árvore que representa a relação entre os
escopos em uma aplicação AngularJS.

Cada aplicação AngularJS tem um escopo raiz (root scope), que é o escopo pai de
todos os outros escopos na hierarquia. Cada vez que um novo controlador é criado,
ele recebe um novo escopo filho (child scope) que é filho do escopo pai (parent
scope) do controlador.
35.

Quais são os diferentes tipos de filters (filtros) em Angular?

Esconder resposta

Existem dois tipos de filters (filtros): os filtros de array e os filtros de formato.

Os filtros de array são usados para filtrar um array de objetos com base em uma
determinada condição e retornam um novo array filtrado. Os filtros de formato são
usados para formatar valores em uma determinada maneira e retornar o valor
formatado.
Os filtros de formato em Angular são implementados como funções e são
adicionados a um módulo usando o método filter. Eles podem ser usados em uma
expressão Angular, que é avaliada em tempo de execução pelo Angular.
36.

O que é injeção de dependência em Angular?

Esconder resposta

Injeção de dependência (DI) é um padrão de projeto no qual os objetos são

passados como dependências em vez de serem criados dentro de uma classe. No
Angular, a injeção de dependência é usada para fornecer instâncias de objetos para
componentes, serviços e outras classes que precisam dessas instâncias.

Com a injeção de dependência, um objeto dependente recebe sua dependência de

um provedor de serviços externo em vez de criá-la internamente. Isso torna o código
mais modular e fácil de testar, uma vez que as dependências podem ser facilmente
substituídas ou mockadas durante os testes.

O Angular usa um sistema de injeção de dependência hierárquico e baseado em

token, onde cada objeto injetado é identificado por um token exclusivo. Quando um
objeto é injetado, ele busca o provedor de serviços correspondente com base no
token e fornece a instância apropriada para a classe que precisa dela.
37.

Quais são os lifecycle hooks para components e directives?

Esconder resposta

Em Angular, existem vários hooks de ciclo de vida para componentes e diretivas,

que permitem executar ações em momentos específicos do ciclo de vida desses
elementos. Os principais lifecycle hooks são:

Para components:
 ● ngOnChanges: Este hook é executado sempre que o valor de uma entrada

de componente (@Input) é alterado. Ele recebe um objeto SimpleChanges

que contém informações sobre a alteração.

● ngOnInit: Este hook é executado uma vez, quando o componente é

inicializado pela primeira vez. Ele é usado geralmente para inicialização de

valores.

● ngDoCheck: Este hook é executado durante cada detecção de alterações

no componente. Ele é usado para detectar mudanças manuais no modelo

de dados do componente.

● ngAfterContentInit: Este hook é executado após o conteúdo projetado em

um componente () ser inicializado.

● ngAfterContentChecked: Este hook é executado sempre que o conteúdo

projetado em um componente é verificado.

● ngAfterViewInit: Este hook é executado após a exibição de um

componente ser inicializada.

● ngAfterViewChecked: Este hook é executado sempre que a exibição de

um componente é verificada.

● ngOnDestroy: Este hook é executado quando um componente é destruído.

Para directives:

● ngOnChanges: Mesmo hook utilizado para componentes, ele é executado

sempre que o valor de uma entrada de diretiva (@Input) é alterado.

 ● ngOnInit: Mesmo hook utilizado para componentes, é executado uma vez

quando a diretiva é inicializada pela primeira vez.

● ngDoCheck: Mesmo hook utilizado para componentes, é executado

durante cada detecção de alterações na diretiva.

● ngOnDestroy: Mesmo hook utilizado para componentes, é executado

quando uma diretiva é destruída.

Além disso, existem hooks adicionais para diretivas estruturais, como

ngAfterViewInit e ngAfterViewChecked.
38.

Qual a diferença entre BOM e DOM?

Esconder resposta

BOM (Browser Object Model) e DOM (Document Object Model) são duas coisas
diferentes no contexto da web.

O BOM é a interface do navegador com o mundo exterior. Ele fornece objetos como
window, navigator e location, que permitem que o JavaScript interaja com o
navegador e a janela do navegador.

Já o DOM é a representação em memória do documento HTML, XML ou XHTML

em um modelo orientado a objeto. O DOM é criado pelo navegador quando uma
página é carregada. Ele permite que o JavaScript manipule os elementos HTML
como objetos, permitindo que os desenvolvedores criem dinamicamente e interajam
com o conteúdo da página, alterem o estilo da página e adicionem ou removam
elementos do documento HTML.
39.

O que é Transpiling em Angular?

Esconder resposta

Transpiling (ou transcompilação) é o processo de converter código de uma

linguagem para outra. Em Angular, o código é escrito em TypeScript, uma
linguagem superset do JavaScript, e o navegador entende somente JavaScript.
Dessa forma, o transpiling é necessário para converter o código TypeScript em
JavaScript que pode ser interpretado pelo navegador.

O processo de transpiling é realizado pelo compilador do TypeScript (tsc) que faz a

tradução do código TypeScript para JavaScript. O compilador é executado durante o
processo de construção do aplicativo, como parte do pipeline de build automatizado,
e gera arquivos JavaScript que podem ser executados em qualquer navegador. O
código gerado também pode ser otimizado para melhorar o desempenho e reduzir o
tamanho do arquivo, tornando-o mais adequado para ambientes de produção.
40.

O que é transclusion em Angular?

Esconder resposta

Transclusion é um recurso do Angular que permite que um componente insira

conteúdo em outro componente, além do conteúdo originalmente definido em seu
template. Isso é feito por meio do uso da tag no template do componente "pai" e
pode ser especialmente útil para criar componentes mais flexíveis e reutilizáveis.

Com a transclusion, é possível passar conteúdo HTML personalizado para um

componente em tempo de execução, substituindo ou adicionando a outros
conteúdos já definidos no template do componente.

Além disso, a transclusion também permite que os componentes forneçam suas

próprias tags personalizadas, para que outros componentes possam facilmente
incorporar seu conteúdo.
41.
O que são events em Angular?

Esconder resposta

Eventos são ações do usuário ou do sistema que disparam ações em um

componente ou serviço específico. Eles podem ser de entrada (input), como um
clique do mouse ou uma tecla pressionada, ou de saída (output), como uma
alteração de dados em um componente.

Os eventos em Angular são implementados usando o sistema de binding de

eventos, que é uma técnica usada para passar informações entre elementos HTML
e componentes Angular. O binding de eventos é usado para associar um evento a
um método em um componente ou serviço Angular. Quando o evento é acionado, o
método correspondente é chamado e pode executar uma série de ações, como
atualizar variáveis, realizar cálculos ou disparar outras ações no aplicativo.

Além disso, o Angular fornece a possibilidade de criar seus próprios eventos

personalizados usando a classe EventEmitter. Esse recurso permite que um
componente ou serviço crie e emita um evento personalizado quando ocorrer uma
ação específica, como um processo de validação concluído com sucesso.
42.

Quais são as principais ferramentas para testar aplicações angulares?

Esconder resposta

Existem várias ferramentas para testar aplicações Angular, mas algumas das
principais são:

● Jasmine: É um framework de teste para JavaScript que é usado com

frequência em aplicações Angular. Ele fornece uma sintaxe clara e fácil de

entender para escrever testes unitários e de integração.

 ● Karma: É um test runner que é amplamente utilizado em projetos Angular.

Ele executa os testes definidos com Jasmine ou outra ferramenta de teste

e relata os resultados.

● Protractor: É uma ferramenta de teste end-to-end (E2E) para aplicações

Angular. Ele permite que você simule a interação do usuário com o

aplicativo e verifique se ele está se comportando conforme o esperado.

● Cypress: É uma ferramenta de teste E2E alternativa ao Protractor. É mais

rápida e oferece uma experiência de teste mais intuitiva, pois você pode

ver o que está acontecendo em tempo real enquanto executa os testes.

● Angular Test Bed: É uma ferramenta fornecida pelo Angular para testar

componentes, diretivas e serviços. Ele fornece uma série de métodos

auxiliares para facilitar a escrita de testes e para garantir que o ambiente

de teste seja configurado corretamente.

● Mocks: São implementações falsas de componentes ou serviços que são

usados para testar outras partes do aplicativo. Eles são usados ​para

simular o comportamento de partes do aplicativo que podem não estar

disponíveis ou para evitar a execução de código real durante os testes.

43.

O que é o singleton pattern em Angular?

Esconder resposta

O Singleton Pattern é um padrão de projeto de software que restringe a criação de

instâncias de uma classe a um único objeto. Em Angular, o Singleton Pattern é
comumente usado para criar serviços, que são objetos que fornecem
funcionalidades específicas para outras partes do aplicativo.
Ao criar um serviço em Angular com o Singleton Pattern, a injeção de dependência
é usada para garantir que apenas uma instância desse serviço seja criada e
compartilhada por todo o aplicativo. Dessa forma, quando um componente, diretiva
ou outro serviço precisar usar esse serviço, eles podem simplesmente injetá-lo em
seu construtor e terão acesso à mesma instância compartilhada em todo o
aplicativo.
44.

Como utilizar APIs REST com Angular?

Esconder resposta

Angular é uma plataforma para construção de aplicações web do client-side e pode

ser integrada com APIs RESTful para obter e enviar dados. Para utilizar APIs REST
em Angular, você pode seguir os seguintes passos:

1. Importe o módulo HttpClient no seu componente ou serviço Angular;

2. Injete o HttpClient no construtor do seu componente ou serviço;

3. Use o método get() ou post() do HttpClient para fazer uma chamada HTTP

GET ou POST para a sua API REST;

4. Use a resposta da sua API REST para atualizar o estado da sua aplicação;

5. Se necessário, você também pode enviar dados para a sua API REST

usando o método post().

45.

O que é Angular Bootstrap?

Esconder resposta

Angular Bootstrap é uma biblioteca de componentes front-end baseada em

Bootstrap, que permite que os desenvolvedores do Angular criem interfaces de
usuário atraentes e responsivas de maneira mais rápida e fácil. Ela oferece uma
coleção de componentes, como botões, formulários, modais, carrosséis, tabelas,
entre outros, que podem ser facilmente integrados a um projeto Angular.

A biblioteca é construída com base nos princípios de design do Bootstrap, um dos

frameworks mais populares para o desenvolvimento de interfaces responsivas de
usuário. Com o Angular Bootstrap, os desenvolvedores podem se concentrar na
lógica de negócios de seus aplicativos em vez de se preocupar com detalhes de
implementação de componentes de interface do usuário.
46.

O que são constantes em Angular?

Esconder resposta

Em Angular, não há uma definição específica para constantes, mas é possível

definir constantes usando TypeScript. Em geral, as constantes são usadas para
armazenar valores imutáveis que são usados em todo o aplicativo e que podem ser
referenciados de forma consistente em todo o código.
47.

Em Angular, qual é o processo para definir, obter e limpar cookies?

Esconder resposta

Você pode usar o serviço CookieService fornecido por bibliotecas de terceiros, como
ngx-cookie-service, para definir, obter e limpar cookies. Para usá-lo, siga as etapas
abaixo:

1. Instale a biblioteca ngx-cookie-service usando o gerenciador de pacotes

npm;

2. Importe o módulo CookieService no seu componente;

3. Injete o serviço CookieService no construtor do componente;

4. Para definir um cookie, chame o método set do serviço CookieService;

 5. Para obter um cookie, chame o método get do serviço CookieService;

6. Para limpar um cookie, chame o método delete do serviço CookieService.

Observe que você precisa injetar o serviço CookieService em qualquer componente

ou serviço que precise acessar cookies. Além disso, verifique se a biblioteca
ngx-cookie-service está incluída no seu projeto, incluindo seu módulo na seção
imports do arquivo app.module.ts.
48.

Para que serve a directive ng-app em Angular?

Esconder resposta

A diretiva ng-app é uma diretiva fundamental do AngularJS que é usada para

identificar a raiz do aplicativo AngularJS. Ela é usada para inicializar o aplicativo
AngularJS e definir o escopo raiz do aplicativo.

Ao definir a diretiva ng-app no elemento HTML raiz do aplicativo, o AngularJS é

inicializado e o escopo raiz é criado. Além disso, ela pode ser usada como um
atributo ou como um elemento.
49.

Para que serve o FormBuilder em Angular?

Esconder resposta

O FormBuilder é uma classe do Angular que fornece uma maneira de criar

instâncias de FormGroup e FormControl com menos código e de forma mais
simples. Ele é usado para criar formulários reativos no Angular de maneira mais fácil
e concisa.

Com o FormBuilder, podemos definir as propriedades de um formulário em um

objeto JSON e, em seguida, usar o FormBuilder para criar o FormGroup e
FormControl com base nesse objeto.. Além disso, ele ajuda a reduzir a repetição de
código em casos em que o formulário é complexo e precisa de validação ou
transformação de dados.
50.

Para que serve subscribe em Angular?

Esconder resposta

O método subscribe() é usado para se inscrever em um Observable e ser notificado

quando um novo valor é emitido. Ele permite que o código reaja a eventos de
emissão de valor de um Observable. Além disso, o método subscribe() aceita uma
ou duas funções como argumentos.

A primeira função é obrigatória e é chamada quando um novo valor é emitido pelo

Observable. Essa função é responsável por lidar com o valor emitido. A segunda
função é opcional e é chamada quando ocorre um erro ao emitir o valor. Essa
função é responsável por lidar com o erro.
51.

Para que serve o Async Pipe em Angular?

Esconder resposta

O Async Pipe é uma diretiva em Angular que serve para trabalhar com dados
assíncronos, como por exemplo, observables. Ele é responsável por inscrever-se no
observable, receber seus valores e propagá-los para o template HTML. Além disso,
o Async Pipe é capaz de lidar com a finalização do subscribe no observable quando
o componente é destruído, evitando vazamento de memória.
52.

O que é ngOnInit em Angular?

Esconder resposta

ngOnInit é um dos métodos do ciclo de vida de um componente Angular. Ele é

executado logo após a inicialização do componente e é usado principalmente para
realizar tarefas de inicialização, como buscar dados de um servidor ou configurar
variáveis.
53.

Qual é a principal diferença entre compilação just-in-time (JIT) e ahead-of-time

(AOT)?

Esconder resposta

A principal diferença entre a compilação just-in-time (JIT) e ahead-of-time (AOT) é

quando o código é compilado. Na compilação JIT, o código TypeScript é compilado
em tempo de execução, no momento em que o aplicativo é carregado pelo
navegador. Isso significa que o compilador JIT gera o código JavaScript no
momento da execução, o que pode levar a uma inicialização mais lenta do
aplicativo.

Por outro lado, na compilação AOT, o código TypeScript é compilado em JavaScript

durante a fase de compilação, antes que o aplicativo seja carregado pelo
navegador. Isso significa que o compilador AOT gera o código JavaScript antes do
tempo de execução, o que leva a uma inicialização mais rápida do aplicativo.
54.

Qual é a diferença entre Promise e Observable em Angular?

Esconder resposta

Tanto as Promises quanto os Observables são usados para lidar com chamadas
assíncronas, mas existem algumas diferenças importantes entre elas.

Uma Promise é usada para uma única operação assíncrona e pode ter apenas um
valor retornado (resolve) ou um erro (reject). A Promise será executada uma vez e
retornará um valor ou um erro, e depois será encerrada. As Promises são tratadas
pelo método .then() para lidar com sucesso e .catch() para lidar com falhas.
Já um Observable é usado para transmitir múltiplos valores de uma fonte, com o
tempo. Ele permite que você possa enviar um fluxo contínuo de dados e pode ser
inscrito várias vezes. O Observable é composto de três estados: next, error e
complete.
55.

Qual é a diferença entre Event Emitter e Subjects em Angular?

Esconder resposta

Tanto o EventEmitter quanto o Subject são usados para comunicar mudanças de

estado de um componente para outros componentes ou serviços em um aplicativo
Angular. A principal diferença entre eles é a forma como eles gerenciam os
observadores.

O EventEmitter é uma classe que estende a classe Subject e fornece um método

emit() que é usado para enviar um evento com um determinado valor. Ele também
tem um método subscribe() para se inscrever em eventos emitidos. No entanto, o
EventEmitter não oferece recursos avançados de gerenciamento de assinaturas,
como o unsubscribe().

Já o Subject é uma classe que implementa a interface Observable e pode ser usada
para criar um fluxo de dados que pode ser observado por outros componentes ou
serviços. Ele é um tipo de Observable que permite a emissão manual de eventos
por meio do método next(). O Subject também possui recursos avançados de
gerenciamento de assinaturas, como unsubscribe() para cancelar a inscrição em
eventos.
56.

Qual é a diferença entre Activated Route e Activated Route Snapshot em Angular?

Esconder resposta

ActivatedRoute e ActivatedRouteSnapshot são dois conceitos que estão

relacionados à navegação de rotas.
O ActivatedRoute fornece informações sobre a rota atual e é usado para acessar os
parâmetros da rota, consulta de dados e observação de mudanças na rota. É um
serviço que pode ser injetado em qualquer componente.

O ActivatedRouteSnapshot é uma representação imutável da rota atual no momento

da ativação. Ele contém informações sobre a rota atual, como os parâmetros de
rota, o URL e os dados estáticos definidos na configuração da rota. É útil quando se
quer obter informações sobre a rota em um determinado momento sem se
preocupar com as alterações que possam ocorrer na rota posteriormente.
57.

Como criar um componente manualmente, sem usar o Angular CLI?

Esconder resposta

Para criar um componente manualmente sem o uso do Angular CLI, siga os

seguintes passos:

1. Crie uma nova pasta com o nome do seu componente dentro da pasta app

do seu projeto Angular.

2. Dentro da pasta que você acabou de criar, crie um novo arquivo .ts com o

nome do seu componente, por exemplo: meu-componente.ts.

3. No arquivo criado, importe os módulos necessários e defina o decorator

@Component para criar o componente. O decorator deve ter os seguintes

parâmetros: selector, templeteUrl e styleUrls.

4. Crie o arquivo HTML do componente com o nome definido no parâmetro

"templateUrl" do decorator @Component. O HTML deve conter o seletor

do componente.
 5. Crie o arquivo CSS do componente com o nome definido no parâmetro

"styleUrls" do decorator @Component. O CSS deve estilizar o

componente.

6. Por fim, importe o componente no módulo principal da aplicação

(app.module.ts) e adicione-o ao array "declarations".

58.

Para que serve o routing em Angular?

Esconder resposta

Routing (roteamento) é um recurso importante no Angular que permite navegar

entre diferentes visualizações de aplicativos em uma única página da web. Ele é
usado para criar aplicativos de várias páginas e é uma das principais partes do
framework Angular.

O Angular usa um roteador que é responsável por associar URLs a componentes

específicos e gerenciar a navegação entre esses componentes. Esse roteador é
baseado em um padrão de roteamento de URL RESTful, que permite que os
aplicativos sejam divididos em vários componentes, cada um correspondendo a
uma URL específica.

Usando o routing, é possível criar aplicativos com várias visualizações que são
carregadas em diferentes URLs, permitindo que os usuários naveguem pelo
aplicativo e mudem de página sem a necessidade de recarregar a página inteira.
Além disso, ele permite que os desenvolvedores criem links que apontem para
páginas específicas, facilitando a navegação para os usuários.

O routing também é útil para permitir que diferentes partes do aplicativo sejam
carregadas de forma assíncrona, melhorando a velocidade de carregamento do
aplicativo.
59.

O que significa CLI e para que ela serve em Angular?

Esconder resposta

CLI significa "Command Line Interface", ou seja, Interface de Linha de Comando em

português. No contexto de Angular, o Angular CLI é uma ferramenta de linha de
comando que é usada para criar, gerenciar, compilar e testar projetos Angular.

O Angular CLI automatiza muitas das tarefas comuns que os desenvolvedores

precisam executar, como criar novos componentes, serviços ou diretivas, criar rotas
e executar testes. Ele também vem com um conjunto de ferramentas que permitem
criar projetos a partir de modelos pré-definidos, otimizar e empacotar aplicativos
para implantação e muito mais.

O CLI simplifica o processo de desenvolvimento de aplicativos Angular e ajuda a

garantir que todos os desenvolvedores estejam seguindo as melhores práticas
recomendadas pela comunidade.
60.

O que é tsconfig.json em Angular?

Esconder resposta

O tsconfig.json é um arquivo de configuração do TypeScript que é usado para

configurar o compilador do TypeScript. O Angular é escrito em TypeScript, que é um
superset do JavaScript, portanto, o tsconfig.json é usado para configurar o processo
de compilação do TypeScript em um projeto Angular.

Algumas das configurações que podem ser feitas no tsconfig.json incluem a

especificação do arquivo de saída, a versão do ECMAScript a ser usada, a definição
do módulo a ser usado, a configuração dos caminhos para os arquivos de origem e
a habilitação ou desabilitação de várias opções de compilação, como
"strictNullChecks", "noImplicitAny" e "experimentalDecorators".
61.

Qual é a diferença entre ActivatedRoute e RouterState no Angular 2?

Esconder resposta

Tanto ActivatedRoute quanto RouterState são recursos disponíveis no Angular para

gerenciar o roteamento da aplicação.

ActivatedRoute é um objeto que representa a rota ativa naquele momento, ou seja,

a rota que está sendo usada no momento em que o código está sendo executado.
Ele fornece informações sobre a rota atual, como parâmetros, query strings e outras
informações que são definidas na definição da rota.

RouterState, por outro lado, é um objeto que representa o estado completo do

roteamento em um determinado momento, ou seja, ele contém informações sobre
todas as rotas que foram acessadas para chegar à rota atual, incluindo as
informações de ActivatedRoute de cada uma delas.
62.

O que é pipe em Angular?

Esconder resposta

Em Angular, um pipe (funil) é um recurso que permite transformar os dados exibidos

em um template. Eles são usados para formatar, filtrar e ordenar dados exibidos na
interface do usuário. Um pipe é basicamente uma função que recebe um valor de
entrada e retorna um valor de saída transformado.

Os pipes também podem ser criados pelo desenvolvedor para atender a

necessidades específicas do aplicativo. Isso pode ser feito por meio da criação de
uma classe que implementa a interface PipeTransform e define o comportamento do
pipe.
63.

Quais são os erros mais comuns em aplicativos Angular?

Esconder resposta

Existem vários erros comuns em aplicativos Angular, alguns dos quais são:

● Erros de digitação: um erro de digitação pode causar problemas em todo o

aplicativo Angular, como uma referência incorreta a uma variável,

propriedade ou método.

● Erros de carregamento: erros de carregamento ocorrem quando um

componente ou módulo não é carregado corretamente, ou quando há uma

dependência faltando ou mal declarada.

● Erros de binding: problemas com binding ocorrem quando há uma falha na

conexão entre o modelo e a exibição, como referências inexistentes, erros

de digitação ou atributos faltantes.

● Erros de injeção de dependência: os erros de injeção de dependência

ocorrem quando a classe ou serviço injetado não é declarado

corretamente, ou quando há conflitos com outros serviços ou classes.

● Erros de roteamento: problemas com roteamento podem causar problemas

de navegação e renderização de componentes, como uma rota incorreta,

configurações mal declaradas ou referências inexistentes.

● Erros de desempenho: problemas de desempenho podem ocorrer devido a

práticas inadequadas de codificação, como loops infinitos, renderização

 desnecessária de componentes e recursos carregados

desnecessariamente.

64.

Como fazer uma animação em Angular?

Esconder resposta

Para criar animações em Angular, você pode usar a biblioteca Angular Animation.
Esta biblioteca fornece uma maneira fácil e flexível de criar animações que podem
ser aplicadas a elementos HTML e componentes Angular.

Aqui estão os passos básicos para criar uma animação em Angular:

1. Importe as classes necessárias de '@angular/animations';

2. Defina uma animação usando a função trigger();

3. Aplique a animação a um elemento HTML ou componente Angular.

Você também pode usar várias funções de animação, como keyframes(),

animateChild(), group(), stagger() e outras, para criar animações mais complexas.

Lembre-se de que, para que as animações funcionem corretamente, é necessário

importar BrowserAnimationsModule do '@angular/platform-browser/animations' e
adicionar BrowserAnimationsModule ao array de imports do seu módulo.
65.

O que são blocos de construção em Angular?

Esconder resposta

Blocos de construção (building blocks) são os elementos básicos que compõem

uma aplicação no Angular. Esses elementos são os componentes, diretivas e
serviços que são usados para criar as funcionalidades da aplicação. Eles podem ser
combinados para criar páginas, formulários, tabelas e outros tipos de interfaces de
usuário.

Os componentes são os blocos de construção mais importantes do Angular e

representam as partes da interface do usuário que os usuários finais vêem e
interagem.
66.

Por que usamos o operador Pipe no RXJS?

Esconder resposta

O operador Pipe é usado no RXJS para compor operadores. O RXJS é uma

biblioteca de programação reativa que é usada no Angular para trabalhar com fluxos
de dados assíncronos. Os operadores no RXJS são funções que são usadas para
manipular esses fluxos de dados.

O Pipe é usado para compor esses operadores, permitindo que você encadeie
vários operadores em uma única chamada de função. Isso torna o código mais
legível e mais fácil de manter, especialmente quando você está lidando com fluxos
de dados complexos.
67.

1. What is Angular? Why was it introduced?

Angular was introduced to create Single Page applications. This framework brings
structure and consistency to web applications and provides excellent scalability and
maintainability.

Angular is an open-source, JavaScript framework wholly written in TypeScript. It uses

HTML's syntax to express your application's components clearly.
2. What is TypeScript?
TypeScript is a superset of JavaScript that offers excellent consistency. It is highly
recommended, as it provides some syntactic sugar and makes the code base more
comfortable to understand and maintain. Ultimately, TypeScript code compiles down
to JavaScript that can run efficiently in any environment.

3. What is data binding? Which type of data binding does

Angular deploy?
Data binding is a phenomenon that allows any internet user to manipulate Web page
elements using a Web browser. It uses dynamic HTML and does not require complex
scripting or programming. We use data binding in web pages that contain interactive
components such as forms, calculators, tutorials, and games. Incremental display of
a webpage makes data binding convenient when pages have an enormous amount
of data.

Angular uses the two-way binding. Any changes made to the user interface are
reflected in the corresponding model state. Conversely, any changes in the model
state are reflected in the UI state. This allows the framework to connect the DOM to
the Model data via the controller. However, this approach affects performance since
every change in the DOM has to be tracked.

4. What are Single Page Applications (SPA)?

Single-page applications are web applications that load once with new features just
being mere additions to the user interface. It does not load new HTML pages to
display the new page's content, instead generated dynamically. This is made
possible through JavaScript's ability to manipulate the DOM elements on the existing
page itself. A SPA approach is faster, thus providing a seamless user experience.
5. Differentiate between Angular and AngularJS
The following table depicts the aspects of Angular vs AngularJS in detail:

Feature AngularJS Angular

Language JavaScript TypeScript

Architecture Supports Uses components and

Model-View-Controller directives
design

Mobile Not supported by mobile Supports all popular mobile

support browsers browsers

Dependency Doesn’t support Supports

Injection
 Routing @routeProvider is used to @Route configuration is used
provide routing information to define routing information

Management Difficult to manage with an Better structured, easy to

increase in source code size create and manage bigger
applications

6. What are decorators in Angular?

Decorators are a design pattern or functions that define how Angular features work.
They are used to make prior modifications to a class, service, or filter. Angular
supports four types of decorators, they are:

1. Class Decorators
2. Property Decorators
3. Method Decorators
4. Parameter Decorators

7. Mention some advantages of Angular.

Some of the common advantages of Angular are -

1. MVC architecture - Angular is a full-fledged MVC framework. It provides a

firm opinion on how the application should be structured. It also offers
bi-directional data flow and updates the real DOM.
 2. Modules: Angular consists of different design patterns like components,
directives, pipes, and services, which help in the smooth creation of
applications.
3. Dependency injection: Components dependent on other components can
be easily worked around using this feature.
4. Other generic advantages include clean and maintainable code, unit
testing, reusable components, data binding, and excellent responsive
experience.

8. What are the new updates with Angular10?

● Older versions of TypeScript not supported - Previous versions of Angular

supported typescript 3.6, 3.7, and even 3.8. But with Angular 10, TypeScript
bumped to TypeScript 3.9.
● Warnings about CommonJS imports - Logging of unknown property
bindings or element names in templates is increased to the "error" level,
which was previously a "warning" before.
● Optional strict setting - Version 10 offers a stricter project setup when you
create a new workspace with ng new command.
ng new --strict

NGCC Feature - Addition of NGCC features with a program based entry point finder.

● Updated URL routing

● Deprecated APIs - Angular 10 has several deprecated APIs.
● Bug fixes - With this Angular 10 version, there have been a number of bug
fixes, important ones being the compiler avoiding undefined expressions
and the core avoiding a migration error when a nonexistent symbol is
imported.
● New Default Browser Configuration - Browser configuration for new
projects has been upgraded to outdo older and less used browsers.

9. What are Templates in Angular?

Angular Templates are written with HTML that contains Angular-specific elements
and attributes. In combination with the model and controller's information, these
templates are further rendered to provide a dynamic view to the user.

10. What are Annotations in Angular?

Annotations in Angular are used for creating an annotation array. They are the
metadata set on the class that is used to reflect the Metadata library.

11. What are Directives in Angular?

Directives are attributes that allow the user to write new HTML syntax specific to
their applications. They execute whenever the Angular compiler finds them in the
DOM. Angular supports three types of directives.

1. Component Directives
 2. Structural Directives
3. Attribute Directives

12. What is an AOT compilation? What are its

advantages?
The Ahead-of-time (AOT) compiler converts the Angular HTML and TypeScript code
into JavaScript code during the build phase, i.e., before the browser downloads and
runs the code.

Some of its advantages are as follows.

1. Faster rendering
2. Fewer asynchronous requests
3. Smaller Angular framework download size
4. Quick detection of template errors
5. Better security

13. What are Components in Angular?

Components are the basic building blocks of the user interface in an Angular
application. Every component is associated with a template and is a subset of
directives. An Angular application typically consists of a root component, which is
the AppComponent, that then branches out into other components creating a
hierarchy.
14. What are Pipes in Angular?

Pipes are simple functions designed to accept an input value, process, and return as
an output, a transformed value in a more technical understanding. Angular supports
several built-in pipes. However, you can also create custom pipes that cater to your
needs.

Some key features include:

1. Pipes are defined using the pipe “|” symbol.

2. Pipes can be chained with other pipes.
3. Pipes can be provided with arguments by using the colon (:) sign.

15. What is the PipeTransform interface?

As the name suggests, the interface receives an input value and transforms it into
the desired format with a transform() method. It is typically used to implement
custom pipes.

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({

name: 'demopipe'

})

export class DemopipePipe implements PipeTransform {

transform(value: unknown, ...args: unknown[]): unknown {

return null;

16. What are Pure Pipes?

These pipes are pipes that use pure functions. As a result of this, a pure pipe doesn't
use any internal state, and the output remains the same as long as the parameters
passed stay the same. Angular calls the pipe only when it detects a change in the
parameters being passed. A single instance of the pure pipe is used throughout all
components.

17. What are Impure Pipes?

 For every change detection cycle in Angular, an impure pipe is called regardless of
the change in the input fields. Multiple pipe instances are created for these pipes.
Inputs passed to these pipes can be mutable.

By default, all pipes are pure. However, you can specify impure pipes using the pure
property, as shown below.

@Pipe({

name: 'demopipe',

pure : true/false

})

export class DemopipePipe implements PipeTransform {

18. What is an ngModule?

NgModules are containers that reserve a block of code to an application domain or a
workflow. @NgModule takes a metadata object that generally describes the way to
compile the template of a component and to generate an injector at runtime. In
addition, it identifies the module's components, directives, and pipes, making some
of them public, through the export property so that external components can use
them.

19. What are filters in Angular? Name a few of them.

Filters are used to format an expression and present it to the user. They can be used
in view templates, controllers, or services. Some inbuilt filters are as follows.

● date - Format a date to a specified format.

● filter - Select a subset of items from an array.
● Json - Format an object to a JSON string.
● limitTo - Limits an array/string, into a specified number of
elements/characters.
● lowercase - Format a string to lowercase.

20. What is view encapsulation in Angular?

View encapsulation defines whether the template and styles defined within the
component can affect the whole application or vice versa. Angular provides three
encapsulation strategies:

1. Emulated - styles from the main HTML propagate to the component.

2. Native - styles from the main HTML do not propagate to the component.
3. None - styles from the component propagate back to the main HTML and
therefore are visible to all components on the page.

21. What are controllers?

AngularJS controllers control the data of AngularJS applications. They are regular
JavaScript Objects. The ng-controller directive defines the application controller.

22. What do you understand by scope in Angular?

The scope in Angular binds the HTML, i.e., the view, and the JavaScript, i.e., the
controller. It as expected is an object with the available methods and properties. The
scope is available for both the view and the controller. When you make a controller in
Angular, you pass the $scope object as an argument.

23. Explain the lifecycle hooks in Angular

In Angular, every component has a lifecycle. Angular creates and renders these
components and also destroys them before removing them from the DOM. This is
achieved with the help of lifecycle hooks. Here's the list of them -

1. ngOnChanges() - Responds when Angular sets/resets data-bound input

properties.
2. ngOnInit() - Initialize the directive/component after Angular first displays
the data-bound properties and sets the directive/component's input
properties/
3. ngDoCheck() - Detect and act upon changes that Angular can't or won't
detect on its own.
4. ngAfterContentInit() - Responds after Angular projects external content into
the component's view.
5. ngAfterContentChecked() - Respond after Angular checks the content
projected into the component.
6. ngAfterViewInit() - Respond after Angular initializes the component's views
and child views.
7. ngAfterViewChecked() - Respond after Angular checks the component's
views and child views.
8. ngOnDestroy - Cleanup just before Angular destroys the
directive/component.

24. What is String Interpolation in Angular?

String Interpolation is a one-way data-binding technique that outputs the data from
TypeScript code to HTML view. It is denoted using double curly braces. This template
expression helps display the data from the component to the view.
{{ data }}

25. What are Template statements?

Template statements are properties or methods used in HTML for responding to
user events. With these template statements, the application that you create or are
working on, can have the capability to engage users through actions such as
submitting forms and displaying dynamic content.

For example,

<button (click)="deleteHero()">Delete hero</button>

The template here is deleteHero. The method is called when the user clicks on the
button.

Angular Interview Questions For Advanced Level

26. What is the difference between AOT and JIT?

Ahead of Time (AOT) compilation converts your code during the build time before
the browser downloads and runs that code. This ensures faster rendering to the
browser. To specify AOT compilation, include the --aot option with the ng build or ng
serve command.

The Just-in-Time (JIT) compilation process is a way of compiling computer code to

machine code during execution or run time. It is also known as dynamic compilation.
JIT compilation is the default when you run the ng build or ng serve CLI commands.
27. Explain the @Component Decorator.
TypeScript class is one that is used to create components. This genre of class is
then decorated with the "@Component" decorator. The decorato’s purpose is to
accept a metadata object that provides relevant information about the component.

The image above shows an App component - a pure TypeScript class decorated with
the “@Component” decorator. The metadata object that gets accepted by the
decorator provides properties like templateUrl, selector, and others, where the
templateUrL property points to an HTML file defining what you see on the
application.

28. What are Services in Angular?

Angular Services perform tasks that are used by multiple components. These tasks
could be data and image fetching, network connections, and database management
among others. They perform all the operational tasks for the components and avoid
rewriting of code. A service can be written once and injected into all the components
that use that service.

29. What are Promises and Observables in Angular?

While both the concepts deal with Asynchronous events in Angular, Promises handle
one such event at a time while observables handle a sequence of events over some
time.

Promises - They emit a single value at a time. They execute immediately after
creation and are not cancellable. They are Push errors to the child promises.

Observables - They are only executed when subscribed to them using the subscribe()
method. They emit multiple values over a period of time. They help perform
operations like forEach, filter, and retry, among others. They deliver errors to the
subscribers. When the unsubscribe() method is called, the listener stops receiving
further values.

30. What is ngOnInit? How is it defined?

ngOnInit is a lifecycle hook and a callback method that is run by Angular to indicate
that a component has been created. It takes no parameters and returns a void type.
 export class MyComponent implements OnInit {

constructor() { }

ngOnInit(): void {

//....

Top 40+ Angular Interview Questions and

Answers for 2023

Lesson 13 of 13

By Chinmayee Deshpande

Last updated on Apr 25, 2023

16

1096209
Previous

Table of Contents

Angular Interview Questions For BeginnersAngular Interview Questions For Advanced

Level Next Steps

Angular is a robust front-end JavaScript framework that is widely used for app
development. With the increased popularity, there is a high demand for Angular
developers. This article on Angular Interview Questions will present some commonly
asked questions and how to answer them. The questions are bifurcated into two
levels, beginner and advanced.

To brush up your basics, check out our videos on YouTube. You could also refer to
our articles for better clarity. Now, without further ado, let's begin with the top
Angular interview questions and answers you must be prepared for.
1. O que é Angular? Por que foi introduzido?
Angular foi introduzido para criar aplicativos de página única. Essa estrutura traz
estrutura e consistência para aplicativos da Web e fornece excelente escalabilidade
e capacidade de manutenção.

Angular é uma estrutura JavaScript de código aberto totalmente escrita em

TypeScript. Ele usa a sintaxe do HTML para expressar claramente os componentes
do seu aplicativo.

2. O que é TypeScript?
TypeScript é um superconjunto de JavaScript que oferece excelente consistência. É
altamente recomendado, pois fornece um pouco de açúcar sintático e torna a base
de código mais confortável de entender e manter. Por fim, o código TypeScript é
compilado em JavaScript que pode ser executado com eficiência em qualquer
ambiente.

3. O que é vinculação de dados? Qual tipo de ligação de

dados o Angular implanta?
A vinculação de dados é um fenômeno que permite a qualquer usuário da Internet
manipular elementos de páginas da Web usando um navegador da Web. Ele usa
HTML dinâmico e não requer scripts ou programação complexos. Usamos
vinculação de dados em páginas da Web que contêm componentes interativos,
como formulários, calculadoras, tutoriais e jogos. A exibição incremental de uma
página da Web torna a vinculação de dados conveniente quando as páginas têm
uma quantidade enorme de dados.

Angular usa a ligação bidirecional. Quaisquer alterações feitas na interface do

usuário são refletidas no estado do modelo correspondente. Por outro lado,
quaisquer alterações no estado do modelo são refletidas no estado da interface do
usuário. Isso permite que a estrutura conecte o DOM aos dados do modelo por meio
do controlador. No entanto, essa abordagem afeta o desempenho, pois todas as
alterações no DOM precisam ser rastreadas.

4. O que são aplicativos de página única (SPA)?

Aplicativos de página única são aplicativos da Web que carregam uma vez com
novos recursos, sendo apenas meras adições à interface do usuário. Ele não carrega
novas páginas HTML para exibir o conteúdo da nova página, em vez disso, é gerado
dinamicamente. Isso é possível por meio da capacidade do JavaScript de manipular
os elementos DOM na própria página existente. Uma abordagem SPA é mais rápida,
proporcionando assim uma experiência de usuário perfeita.

5. Diferencie entre Angular e AngularJS

A tabela a seguir descreve os aspectos de Angular vs AngularJS em detalhes:

Recurso AngularJS Angular

Linguagem JavaScript TypeScript

Arquitetura Suporta design Usa componentes e diretivas

Model-View-Controller
 Suporte móvel Não suportado por Suporta todos os
navegadores móveis navegadores móveis
populares

Injeção de não suporta Apoia

dependência

Roteamento @routeProvider é usado A configuração @Route é

para fornecer informações usada para definir
de roteamento informações de roteamento

Gerenciamento Difícil de gerenciar com um Aplicativos maiores melhor

aumento no tamanho do estruturados, fáceis de criar e
código-fonte gerenciar

6. O que são decoradores em Angular?

Os decoradores são um padrão de design ou funções que definem como os
recursos do Angular funcionam. Eles são usados ​para fazer modificações anteriores
em uma classe, serviço ou filtro. Angular suporta quatro tipos de decoradores, são
eles:
 1. Decoradores de classe
2. Decoradores de imóveis
3. Decoradores de método
4. Decoradores de Parâmetros

7. Mencione algumas vantagens do Angular.

Algumas das vantagens comuns do Angular são -

1. Arquitetura MVC - Angular é uma estrutura MVC completa. Ele fornece uma
opinião firme sobre como o aplicativo deve ser estruturado. Ele também
oferece fluxo de dados bidirecional e atualiza o DOM real.
2. Módulos: Angular consiste em diferentes padrões de design, como
componentes, diretivas, pipes e serviços, que ajudam na criação suave de
aplicativos.
3. Injeção de dependência : Componentes dependentes de outros
componentes podem ser facilmente contornados usando esse recurso.
4. Outras vantagens genéricas incluem código limpo e sustentável, teste de
unidade, componentes reutilizáveis, vinculação de dados e excelente
experiência responsiva.

8. Quais são as novas atualizações com Angular10?

 ● Versões mais antigas do TypeScript não suportadas - Versões anteriores
do Angular suportavam typescript 3.6, 3.7 e até 3.8. Mas com o Angular 10,
o TypeScript mudou para o TypeScript 3.9.
● Avisos sobre importações do CommonJS - O registro de associações de
propriedades desconhecidas ou nomes de elementos em modelos é
aumentado para o nível de "erro", que antes era um "aviso".
● Configuração estrita opcional - a versão 10 oferece uma configuração de
projeto mais rígida quando você cria um novo espaço de trabalho com o
comando ng new.

ng new --strict

Recurso NGCC - Adição de recursos NGCC com um localizador de ponto de entrada

baseado em programa.

● Roteamento de URL atualizado

● APIs obsoletas - Angular 10 tem várias APIs obsoletas.
● Correções de bugs - Com esta versão do Angular 10, houve várias
correções de bugs, sendo as mais importantes o compilador evitando
 expressões indefinidas e o núcleo evitando um erro de migração quando
um símbolo inexistente é importado.
● Nova configuração padrão do navegador - A configuração do navegador
para novos projetos foi atualizada para superar os navegadores mais
antigos e menos usados.

9. O que são Templates em Angular?

Os modelos Angular são escritos com HTML que contém elementos e atributos
específicos do Angular. Em combinação com as informações do modelo e do
controlador, esses modelos são renderizados para fornecer uma visão dinâmica ao
usuário.

10. O que são Anotações em Angular?

As anotações em Angular são usadas para criar uma matriz de anotação. Eles são
os metadados definidos na classe usados ​para refletir a biblioteca de metadados.

11. O que são Diretivas em Angular?

As diretivas são atributos que permitem ao usuário escrever uma nova sintaxe
HTML específica para seus aplicativos. Eles são executados sempre que o
compilador Angular os encontra no DOM. Angular suporta três tipos de diretivas.

1. Diretivas de componentes
2. Diretivas Estruturais
3. Diretivas de atributo

12. O que é uma compilação AOT? Quais são as suas

vantagens?
O compilador Ahead-of-time (AOT) converte o código Angular HTML e TypeScript
em código JavaScript durante a fase de construção, ou seja, antes que o navegador
baixe e execute o código.

Algumas de suas vantagens são as seguintes.

1. Renderização mais rápida

2. Menos solicitações assíncronas
3. Tamanho de download da estrutura angular menor
4. Detecção rápida de erros de modelo
5. Melhor segurança

13. O que são Componentes em Angular?

Os componentes são os blocos de construção básicos da interface do usuário em

um aplicativo Angular. Cada componente está associado a um modelo e é um
subconjunto de diretivas. Um aplicativo Angular geralmente consiste em um
componente raiz, que é o AppComponent, que se ramifica em outros componentes
criando uma hierarquia.

14. O que são tubos em Angular?

Pipes são funções simples projetadas para aceitar um valor de entrada, processar e
retornar como saída, um valor transformado em um entendimento mais técnico.
Angular suporta vários tubos embutidos. No entanto, você também pode criar tubos
personalizados que atendam às suas necessidades.

Alguns recursos principais incluem:

1. Pipes são definidos usando o pipe “|” símbolo.

2. Os tubos podem ser encadeados com outros tubos.
3. Pipes podem ser fornecidos com argumentos usando o sinal de dois
pontos (:).

15. O que é a interface PipeTransform?

Como o nome sugere, a interface recebe um valor de entrada e o transforma no
formato desejado com um método transform(). Normalmente é usado para
implementar pipes customizados.

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
 name: 'demopipe'

})

export class DemopipePipe implements PipeTransform {

transform(value: unknown, ...args: unknown[]): unknown {

return null;

16. O que são Cachimbos Puros?

Esses pipes são pipes que usam funções puras. Como resultado disso, um pipe puro
não usa nenhum estado interno e a saída permanece a mesma desde que os
parâmetros passados ​permaneçam os mesmos. Angular chama o canal apenas
quando detecta uma alteração nos parâmetros que estão sendo passados. Uma
única instância do pipe puro é usada em todos os componentes.

17. O que são Tubos Impuros?

Para cada ciclo de detecção de alteração no Angular, um canal impuro é chamado
independentemente da alteração nos campos de entrada. Várias instâncias de pipe
são criadas para esses pipes. As entradas passadas para esses canais podem ser
mutáveis.

Por padrão, todos os pipes são puros. No entanto, você pode especificar pipes
impuros usando a propriedade pure, conforme mostrado abaixo.

@Pipe({
 name: 'demopipe',

pure : true/false

})

export class DemopipePipe implements PipeTransform {

18. O que é um ngModule?

NgModules são contêineres que reservam um bloco de código para um domínio de
aplicativo ou um fluxo de trabalho. @NgModule pega um objeto de metadados que
geralmente descreve a maneira de compilar o modelo de um componente e gerar
um injetor em tempo de execução. Além disso, identifica os componentes, diretivas
e pipes do módulo, tornando alguns deles públicos, por meio da propriedade export
para que componentes externos possam utilizá-los.

19. O que são filtros no Angular? Cite alguns deles.

Os filtros são usados ​para formatar uma expressão e apresentá-la ao usuário. Eles
podem ser usados ​em modelos de exibição, controladores ou serviços. Alguns
filtros embutidos são os seguintes.

● date - Formata uma data para um formato especificado.

● filtro - Selecione um subconjunto de itens de uma matriz.
● Json - formata um objeto para uma string JSON.
● limitTo - Limita uma matriz/string em um número especificado de
elementos/caracteres.
● lowercase - Formata uma string para letras minúsculas.

20. O que é encapsulamento de visualização em

Angular?
O encapsulamento de exibição define se o modelo e os estilos definidos no
componente podem afetar todo o aplicativo ou vice-versa. Angular fornece três
estratégias de encapsulamento:

1. Emulados - os estilos do HTML principal se propagam para o componente.

2. Nativo - os estilos do HTML principal não se propagam para o
componente.
3. Nenhum - os estilos do componente se propagam de volta para o HTML
principal e, portanto, são visíveis para todos os componentes da página.

21. O que são controladores?

Os controladores AngularJS controlam os dados dos aplicativos AngularJS. Eles são
objetos JavaScript regulares. A diretiva ng-controller define o controlador de
aplicativo.

22. O que você entende por escopo em Angular?

O escopo em Angular vincula o HTML, ou seja, a visualização e o JavaScript, ou seja,
o controlador. Como esperado, é um objeto com os métodos e propriedades
disponíveis. O escopo está disponível para a exibição e o controlador. Quando você
faz um controlador em Angular, você passa o objeto $scope como um argumento.

23. Explique os ganchos do ciclo de vida em Angular

No Angular, cada componente tem um ciclo de vida. Angular cria e renderiza esses
componentes e também os destrói antes de removê-los do DOM. Isso é obtido com
a ajuda de ganchos de ciclo de vida. Aqui está a lista deles -

1. ngOnChanges() - Responde quando o Angular define/redefine as

propriedades de entrada vinculadas a dados.
 2. ngOnInit() - Inicializa a diretiva/componente depois que Angular primeiro
exibe as propriedades vinculadas a dados e define as propriedades de
entrada da diretiva/componente
3. ngDoCheck () - detecta e age sobre as alterações que o Angular não pode
ou não detecta por conta própria.
4. ngAfterContentInit() - Responde depois que Angular projeta conteúdo
externo na visualização do componente.
5. ngAfterContentChecked() - Responde após Angular verificar o conteúdo
projetado no componente.
6. ngAfterViewInit() - Responde após Angular inicializar as exibições do
componente e as exibições filhas.
7. ngAfterViewChecked() - Responde após Angular verificar as exibições do
componente e as exibições filhas.
8. ngOnDestroy - Limpeza antes de Angular destruir a diretiva/componente.

24. O que é Interpolação de String em Angular?

String Interpolation é uma técnica de ligação de dados unidirecional que gera os
dados do código TypeScript para a exibição HTML. É denotado por chaves duplas.
Essa expressão de modelo ajuda a exibir os dados do componente para a exibição.

{{ dados }}

25. O que são declarações de modelo?

As declarações de modelo são propriedades ou métodos usados ​em HTML para
responder a eventos do usuário. Com essas instruções de modelo, o aplicativo que
você cria ou no qual está trabalhando pode ter a capacidade de envolver os usuários
por meio de ações como envio de formulários e exibição de conteúdo dinâmico.

Por exemplo,
<button (click)="deleteHero()">Excluir herói</button>

O modelo aqui é deleteHero. O método é chamado quando o usuário clica no botão.

Perguntas de entrevista angular para nível avançado

26. Qual é a diferença entre AOT e JIT?

A compilação Ahead of Time (AOT) converte seu código durante o tempo de
compilação antes que o navegador baixe e execute esse código. Isso garante uma
renderização mais rápida para o navegador. Para especificar a compilação AOT,
inclua a opção --aot com o comando ng build ou ng serve.

O processo de compilação Just-in-Time (JIT) é uma maneira de compilar código de

computador para código de máquina durante a execução ou tempo de execução.
Também é conhecida como compilação dinâmica. A compilação JIT é o padrão
quando você executa os comandos ng build ou ng serve da CLI.

27. Explique o @Component Decorator.

A classe TypeScript é aquela que é usada para criar componentes. Esse gênero de
classe é então decorado com o decorador "@Component". A finalidade do decorato
é aceitar um objeto de metadados que forneça informações relevantes sobre o
componente.
A imagem acima mostra um componente App - uma classe TypeScript pura
decorada com o decorador “@Component”. O objeto de metadados que é aceito
pelo decorador fornece propriedades como templateUrl, selector e outras, onde a
propriedade templateUrL aponta para um arquivo HTML definindo o que você vê no
aplicativo.

28. O que são Serviços em Angular?

Os serviços angulares executam tarefas que são usadas por vários componentes.
Essas tarefas podem ser busca de dados e imagens, conexões de rede e
gerenciamento de banco de dados, entre outros. Eles executam todas as tarefas
operacionais dos componentes e evitam reescrever o código. Um serviço pode ser
escrito uma vez e injetado em todos os componentes que usam esse serviço.
29. O que são promessas e observáveis ​em Angular?
Embora ambos os conceitos lidem com eventos assíncronos em Angular, os
Promises lidam com um desses eventos por vez, enquanto os observáveis ​lidam
com uma sequência de eventos ao longo de algum tempo.

Promessas - Emitem um único valor por vez. Eles são executados imediatamente
após a criação e não podem ser cancelados. Eles são erros de push para as
promessas de criança.

Observables - Eles são executados apenas quando inscritos neles usando o método
Subscribe(). Eles emitem vários valores durante um período de tempo. Eles ajudam
a executar operações como forEach, filter e retry, entre outras. Eles entregam erros
aos assinantes. Quando o método unsubscribe() é chamado, o ouvinte para de
receber outros valores.

30. O que é ngOnInit? Como é definido?

ngOnInit é um gancho de ciclo de vida e um método de retorno de chamada que é
executado pelo Angular para indicar que um componente foi criado. Não requer
parâmetros e retorna um tipo void.
classe de exportação MyComponent implementa OnInit {

construtor() { }

ngOnInit(): void {

//....

31. Como usar ngFor em uma tag?

A diretiva ngFor é usada para construir listas e tabelas nos modelos HTML. Em
termos simples, esta diretiva é usada para iterar sobre uma matriz ou um objeto e
criar um modelo para cada elemento.

<ul>

<li *ngFor = "deixar itens na lista de itens"> {{ item }} </li>

</ul>

1. “Deixar item” cria uma variável local que estará disponível no template
2. “Of items” indica que estamos iterando sobre os itens iteráveis.
3. O * antes de ngFor cria um modelo pai.

32. O que são formulários Modelo e Reativo?

Abordagem baseada em modelo
 ● Nesse método, a tag de formulário convencional é usada para criar
formulários . Angular interpreta e cria automaticamente uma
representação de objeto de formulário para a tag.
● Os controles podem ser adicionados ao formulário usando a tag NGModel.
Vários controles podem ser agrupados usando o módulo NGControlGroup.
● Um valor de formulário pode ser gerado usando o objeto “form.value”. Os
dados do formulário são exportados como valores JSON quando o método
submit é chamado.
● As validações HTML básicas podem ser usadas para validar os campos do
formulário. No caso de validações personalizadas, diretivas podem ser
usadas.
● Indiscutivelmente, esse método é a maneira mais simples de criar um
aplicativo Angular.

Abordagem de formulário reativo

● Esta abordagem é o paradigma de programação orientado em torno de

fluxos de dados e propagação de mudanças.
● Com formulários reativos, o componente gerencia diretamente os fluxos
de dados entre os controles de formulário e os modelos de dados.
● Os formulários reativos são orientados por código, ao contrário da
abordagem orientada por modelo.
● As formas reativas rompem com a abordagem declarativa tradicional.
● Os formulários reativos eliminam o antipadrão de atualização do modelo
de dados por meio de vinculação de dados bidirecional.
● Normalmente, a criação de controle de formulário reativo é síncrona e
pode ser testada na unidade com técnicas de programação síncrona.

33. O que é Bootstrap? Como ele é incorporado ao

Angular?
Bootstrap é um kit de ferramentas poderoso. É uma coleção de ferramentas HTML,
CSS e JavaScript para criar e construir páginas da web responsivas e aplicativos da
web.

Há duas maneiras de incorporar a biblioteca bootstrap em seu aplicativo.

1. Angular Bootstrap via CDN - Bootstrap CDN é uma rede pública de

distribuição de conteúdo. Ele permite que você carregue os arquivos CSS e
JavaScript remotamente de seus servidores.
2. Angular Bootstrap via NPM - Outra maneira de adicionar o Bootstrap ao
seu projeto Angular é instalá-lo na pasta do projeto usando o NPM (Node
Package Manager).

npm install bootstrap

npm instalar jquery

34. O que é carregamento rápido e lento?

O carregamento antecipado é a estratégia de carregamento de módulo padrão. Os
módulos de recursos em carregamento antecipado são carregados antes do início
do aplicativo. Isso é normalmente usado para aplicações de tamanho pequeno.

O carregamento lento carrega dinamicamente os módulos de recursos quando há

uma demanda. Isso torna o aplicativo mais rápido. É usado para aplicações maiores
onde todos os módulos não são necessários no início da aplicação.

35. Que tipo de DOM o Angular implementa?

DOM (Document Object Model) trata um documento XML ou HTML como uma
estrutura de árvore na qual cada nó é um objeto que representa uma parte do
documento.

Angular usa o DOM regular. Isso atualiza toda a estrutura em árvore das tags HTML
até atingir os dados a serem atualizados. No entanto, para garantir que a velocidade
e o desempenho não sejam afetados, o Angular implementa a detecção de
alterações.

Com isso, você chegou ao final do artigo. É altamente recomendável revisar os

conceitos básicos para uma entrevista. É sempre uma vantagem adicional escrever
o código nos locais necessários.

36. Por que as estruturas do lado do cliente como o

Angular foram introduzidas?
Estruturas do lado do cliente, como Angular, foram introduzidas para fornecer uma
experiência de usuário mais responsiva. Ao usar uma estrutura, os desenvolvedores
podem criar aplicativos da Web mais interativos e, portanto, fornecer uma melhor
experiência do usuário.

Estruturas como o Angular também facilitam a criação de aplicativos de página

única (SPAs) pelos desenvolvedores. SPAs são aplicativos da web que precisam
carregar apenas uma única página HTML. Isso os torna muito mais rápidos e
responsivos do que os aplicativos da Web tradicionais.

No geral, as estruturas do lado do cliente, como Angular, foram introduzidas para

melhorar a experiência do usuário em aplicativos da web. Ao tornar os aplicativos da
Web mais responsivos e fáceis de desenvolver, eles fornecem uma experiência
melhor para desenvolvedores e usuários.
37. Como funciona uma aplicação Angular?
Um aplicativo Angular é um aplicativo de página única ou SPA. Isso significa que
todo o aplicativo reside em uma única página e todos os recursos (HTML, CSS,
JavaScript etc.) são carregados quando a página é carregada pela primeira vez.
Angular usa o padrão de arquitetura Model-View-Controller, ou MVC, para gerenciar
seus dados e visualizações. O Model são os dados que o aplicativo usa, o View é o
que o usuário vê e o Controller é responsável por gerenciar a comunicação entre o
Model e o View.

Quando um usuário interage com um aplicativo Angular, a estrutura Angular

atualizará automaticamente a exibição para refletir quaisquer alterações nos dados.
Isso significa que os aplicativos Angular são muito responsivos e rápidos, pois o
usuário não precisa esperar a página recarregar para ver os dados atualizados.

Os aplicativos angulares também são muito escaláveis, pois podem ser divididos
em pequenos módulos que podem ser carregados independentemente uns dos
outros. Isso significa que um aplicativo Angular pode ser facilmente estendido com
novas funcionalidades sem a necessidade de reescrever todo o aplicativo.

No geral, os aplicativos Angular são muito rápidos, responsivos e escaláveis. Eles

são fáceis de desenvolver e estender e fornecem uma ótima experiência ao usuário.

Veja a seguir um exemplo de codificação de um arquivo angular.json:

"construir": {

"builder": "@angular-devkit/build-angular:browser",

"opções": {
 "outputPath": "dist/angular-starter",

"index": "src/index.html",

"main": "src/main.ts",

"polyfills": "src/polyfills.ts",

"tsConfig": "tsconfig.app.json",

"aot": falso,

"ativos": [

"src/favicon.ico",

"origem/ativos"

],

"estilos": [

"./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",

"src/estilo.css"

}
38. Explicar componentes, módulos e serviços em
Angular.
Componentes, módulos e serviços são os três blocos de construção fundamentais
no Angular. Os componentes são as menores unidades independentes em um
aplicativo Angular. Eles são normalmente usados ​para representar uma exibição ou
elemento de interface do usuário, como um botão ou um campo de entrada de
formulário.

Exemplo de código:

importar { Componente, OnInit } de '@angular/core';

@Componente({

seletor: 'app-test',

templateUrl: './test.component.html',

styleUrls: ['./test.component.css']

})

export lass TestComponent implementa OnInit {

construtor() {}

ngOnInit() {

}
Módulos são unidades maiores que agrupam um ou mais componentes
relacionados. Os serviços são objetos singleton que fornecem funcionalidade
específica em um aplicativo Angular, como acesso a dados ou registro.

Exemplo de código:

importar { BrowserModule } de '@angular/platform-browser';

importar { NgModule } de '@angular/core';

importar { AppComponent } de './app.component';

importar { TestComponent } de './test/text.component';

@NgModule({

declarações: [

AppComponent,

TestComponent

],

importações: [

BrowserModule

],

provedores: [],
 bootstrap: [AppComponent]

})

exportar classe AppModule { }

Cada componente em Angular tem seu próprio escopo isolado. Isso significa que as
dependências de um componente (serviços, outros componentes etc.) não são
acessíveis a nenhum outro componente fora de seu próprio escopo. Esse
isolamento é importante para garantir modularidade e flexibilidade em um aplicativo
Angular.

Já os serviços não são isolados e podem ser injetados em qualquer outra unidade
de uma aplicação Angular (componente, módulo, serviço, etc.). Isso os torna ideais
para compartilhar dados ou funcionalidades em todo o aplicativo.

Exemplo de código:

importar { Injetável } de '@angular/core';

@Injetável({

fornecidoIn: 'raiz'

})

classe de exportação TestServiceService {

construtor() { }

}
Ao projetar um aplicativo Angular, é importante manter esses três blocos de
construção em mente. Os componentes devem ser pequenos e independentes, os
módulos devem agrupar componentes relacionados e os serviços devem fornecer
funcionalidade compartilhada em todo o aplicativo. Seguindo esse princípio de
design, você pode criar um aplicativo Angular que seja modular, flexível e fácil de
manter.

39. Como as expressões Angular são diferentes das

expressões JavaScript?
Uma grande diferença entre expressões Angular e expressões JavaScript é que as
expressões Angular são compiladas enquanto as expressões JavaScript não são.
Isso significa que as expressões Angular são mais eficientes, pois já são
pré-processadas. Além disso, expressões Angular podem acessar propriedades de
escopo enquanto expressões JavaScript não podem. Por fim, as expressões Angular
oferecem suporte a alguns recursos adicionais, como filtros e diretivas, que não
estão disponíveis nas expressões JavaScript.

Exemplo de expressão Javascript:

<!DOCTYPE html>

<html lang="en">

<cabeça>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Teste de JavaScript</title>
 </head>

<corpo>

<div id="foo"><div>

</body>

<script>

'use estrito';

deixe a barra = {};

document.getElementById('foo').innerHTML = bar.x;

</script>

</html>

Exemplo de expressão angular:

importar { Componente, OnInit } de '@angular/core';

@Componente({

seletor: 'aplicativo-novo',

modelo: `

<h4>{{mensagem}}</h4>
 `,

styleUrls: ['./new.component.css']

})

classe de exportação NewComponent implementa OnInit {

mensagem:objeto = {};

construtor() { }

ngOnInit() {

40. Angular por padrão, usa renderização do lado do

cliente para seus aplicativos.
Isso significa que o aplicativo Angular é renderizado no lado do cliente — no
navegador da Web do usuário. A renderização do lado do cliente tem várias
vantagens, incluindo melhor desempenho e melhor segurança. No entanto, também
existem algumas desvantagens em usar a renderização do lado do cliente. Uma das
maiores desvantagens é que isso pode tornar seu aplicativo mais difícil de depurar.

A renderização do lado do cliente é normalmente usada para aplicativos que não

são fortemente orientados por dados. Se seu aplicativo depende de muitos dados
de um servidor, a renderização do lado do cliente pode ser muito lenta. Além disso,
se você estiver usando a renderização do lado do cliente, é importante ter cuidado
ao carregar e armazenar em cache seus dados. Se você não for cuidadoso, você
pode facilmente acabar com um aplicativo muito lento e difícil de usar. Quando
renderizado no lado do servidor, isso é chamado de Angular Universal.

41. Como você compartilha dados entre componentes

no Angular?
Compartilhar dados entre componentes no Angular é simples e fácil. Para
compartilhar dados, basta usar o Angular CLI para gerar um novo serviço. Este
serviço pode ser injetado em qualquer componente e permitirá que os componentes
compartilhem dados.

Para gerar um novo serviço, use o seguinte comando Angular CLI:

ng gerar serviço meu-serviço-de-dados

Isso criará um novo arquivo de serviço chamado my-data-service.ts na pasta

src/app.

Injete o serviço em qualquer componente que precise compartilhar dados:

importar { MyDataService } de './my-data.service';

constructor(private myDataService: MyDataService) { }

Uma vez injetado, o serviço estará disponível no componente como

this.myDataService.

Para compartilhar dados entre componentes, basta usar os métodos setData() e

getData():
this.myDataService.setData('alguns dados');

dados const = this.myDataService.getData();

42. Explique o conceito de injeção de dependência.

A injeção de dependência é uma técnica usada para criar código fracamente
acoplado. Ele permite que partes do código sejam reutilizadas sem a necessidade
de dependências embutidas no código. Isso torna o código mais fácil de manter e
testar. A injeção de dependência é frequentemente usada em estruturas como
AngularJS, ReactJS e VueJS. Também é possível usar injeção de dependência no
JavaScript vanilla. Para usar injeção de dependência em JavaScript, você precisa de
uma biblioteca de injeção de dependência. Existem muitas bibliotecas diferentes
disponíveis, mas todas funcionam basicamente da mesma maneira.

A primeira etapa é criar um contêiner de injeção de dependência. Este é um objeto

simples que conterá todas as dependências de que seu código precisa. Em seguida,
você precisa registrar todas as dependências que seu código precisará no contêiner.
O processo de registro varia dependendo da biblioteca que você está usando, mas
geralmente é apenas uma questão de fornecer o nome da dependência e a função
do construtor.

Depois que todas as dependências forem registradas, você poderá injetá-las em seu
código. O processo de injeção irá novamente variar dependendo da biblioteca que
você está usando, mas geralmente é apenas uma questão de fornecer o nome da
dependência. A biblioteca se encarregará de instanciar a dependência e passá-la
para o seu código.

A injeção de dependência pode ser uma ótima maneira de tornar seu código mais
modular e fácil de manter. Também pode facilitar o teste de unidade do seu código,
pois você pode injetar dependências fictícias em vez das reais. Se você estiver
usando uma estrutura que oferece suporte à injeção de dependência, provavelmente
ela já está sendo usada em seu código. Se você não estiver usando uma estrutura,
ainda poderá usar a injeção de dependência escolhendo uma biblioteca e seguindo
as etapas descritas acima.

Exemplo de código:

importar { Injetável } de '@angular/core';

@Injetável({

fornecidoIn: 'raiz'

})

classe de exportação TestService {

valorimportante:número = 42;

construtor() { }

returnImportantValue(){

return this.importantValue;

As dependências injetáveis ​são criadas após adicionar o decorador @Injectable a

uma classe. A dependência acima é então injetada no seguinte componente:
importar { TestService } de './../test.service';

importar { Componente, OnInit } de '@angular/core';

@Componente({

seletor: 'app-test',

templateUrl: './test.component.html',

styleUrls: ['./test.component.css']

})

classe de exportação TestComponent implementa OnInit {

valor:número;

constructor(private testService:TestService) { }

ngOnInit() {

this.value = this.testService.returnImportantValue();

43. Explique a arquitetura MVVM.

A arquitetura MVVM é um padrão de arquitetura usado principalmente na
engenharia de software. Significa Model-View-ViewModel. MVVM é uma variação do
 padrão de design de software tradicional MVC (Model-View-Controller). A principal
diferença entre os dois é que o MVVM separa a lógica da interface do usuário da
lógica de negócios, enquanto o MVC separa a lógica de acesso a dados da lógica de
negócios. Essa separação de preocupações torna mais fácil desenvolver, testar e
manter aplicativos de software.

A camada Model na arquitetura MVVM é responsável por armazenar e gerenciar

dados. Pode ser um banco de dados, um serviço da Web ou uma fonte de dados
local. A camada View é responsável por exibir os dados para o usuário. Pode ser
uma interface gráfica do usuário (GUI), uma interface de linha de comando (CLI) ou
uma página da Web. A camada ViewModel é responsável por manipular a entrada do
usuário e atualizar a camada View de acordo. Ele contém a lógica de negócios do
aplicativo.

A arquitetura MVVM é frequentemente usada em conjunto com outros padrões de

design de software, como Model-View-Presenter (MVP) e Model-View-Controller
(MVC). Esses padrões podem ser usados ​juntos para criar um aplicativo de software
completo.

A arquitetura MVVM é uma escolha popular para aplicativos de software modernos.

Ele permite que os desenvolvedores criem aplicativos mais responsivos e fáceis de
manter. Além disso, a arquitetura MVVM pode ser usada para criar aplicativos que
podem ser facilmente transferidos para diferentes plataformas.

O que é o SDLC?
O ciclo de vida de desenvolvimento de software (SDLC) é o processo econômico e rápido que as
equipes de desenvolvimento usam para projetar e criar software de alta qualidade. O objetivo do
SDLC é minimizar os riscos do projeto por meio do planejamento antecipado, para que o software
atenda às expectativas do cliente durante e depois da produção. Essa metodologia descreve uma
série de etapas que dividem o processo de desenvolvimento de software em tarefas que você pode
atribuir, concluir e avaliar.

Por que o SDLC é importante?

O gerenciamento do desenvolvimento de software pode ser desafiador, devido às alterações dos
requisitos, as atualizações na tecnologia e a colaboração multifuncional. A metodologia do ciclo de
vida de desenvolvimento de software (SDLC) oferece uma estrutura de gerenciamento sistemática,
com produtos específicos em cada estágio do processo de desenvolvimento do software. Como
resultado, todos os participantes do processo concordam antecipadamente com as metas e os
requisitos do desenvolvimento do software e têm um plano para alcançar essas metas.

Alguns benefícios do SDLC:

● Maior visibilidade do processo de desenvolvimento para todas as partes envolvidas

● Estimativa, planejamento e programação eficientes

● Melhor gerenciamento de riscos e estimativa de custos

● Entrega sistemática do software e maior satisfação do cliente

Como o SDLC funciona?

O ciclo de vida do desenvolvimento de software (SDLC) destaca várias tarefas necessárias para
criar uma aplicação de software. O processo de desenvolvimento passa por vários estágios, à
medida que os desenvolvedores adicionam novos recursos e corrigem bugs no software.

Os detalhes dos processos do SDLC variam para diferentes equipes. Porém, destacamos abaixo
algumas fases comuns do SDLC:

Planejamento

A fase de planejamento normalmente inclui tarefas como a análise do custo-benefício, a

programação, a estimativa e a alocação de recursos. A equipe de desenvolvimento coleta
requisitos de várias partes envolvidas, como clientes, especialistas internos e externos e gerentes,
a fim de criar um documento de especificação de requisitos do software.
O documento define as expectativas e as metas comuns que ajudarão no planejamento do projeto.
A equipe estima os custos, cria uma programação e tem um plano detalhado para atingir suas
metas.

Projeto

Na fase de projeto, os engenheiros de software analisam os requisitos e identificam as melhores

soluções para criar o software. Por exemplo, eles poderão considerar a integração de módulos
pré-existentes, fazer escolhas tecnológicas e identificar ferramentas de desenvolvimento. Eles
analisarão qual a melhor forma de integrar o novo software às infraestruturas de TI existentes que
a organização já tiver.

Implementação

Na fase de implementação, a equipe de desenvolvimento codifica o produto. Eles analisam os

requisitos para identificar as tarefas de codificação menores que podem realizar diariamente para
alcançar o resultado final.

Teste

A equipe de desenvolvimento combina testes manuais e automatizados para identificar bugs no

software. A análise de qualidade inclui testar o software para identificar erros e verificar se ele
atende aos requisitos do cliente. Como muitas equipes testam o código que desenvolvem, a fase
de teste pode ocorrer em paralelo à fase de desenvolvimento.

Implantação

Quando as equipes desenvolvem software, eles criam e testam o código em uma cópia do software
diferente daquela à qual os usuários têm acesso. O software usado pelo cliente é considerado em
produção, enquanto outras cópias são consideradas como o ambiente de compilação ou ambiente
de teste.

O uso de ambientes de compilação e produção separados garante que os clientes possam

continuar a usar o software, mesmo quando ele estiver sendo alterado ou atualizado. A fase de
implantação inclui várias tarefas para mover a cópia mais recente para o ambiente de produção,
como empacotamento, configuração de ambientes e instalação.

Manutenção

Na fase de manutenção, entre outras tarefas, a equipe corrige bugs, soluciona problemas do
cliente e gerencia as alterações do software. Além disso, a equipe monitora a performance geral do
sistema, a segurança e a experiência do usuário para identificar novas formas de melhorar o
software existente.

O que são os modelos de SDLC?

Um modelo de ciclo de vida de desenvolvimento de software (SDLC) apresenta conceitualmente o
SDLC de forma organizada para ajudar as empresas a implementá-lo. Diferentes modelos
organizam as fases do SDLC em ordens cronológicas variadas, a fim de otimizar o ciclo de
desenvolvimento. Analisaremos abaixo alguns modelos de SDLC mais usados:

Cascata

O modelo cascata organiza todas as fases sequencialmente, de forma que cada fase nova
dependa do resultado da fase anterior. Conceitualmente, o design flui de uma fase para a outra,
como uma cascata.

Prós e contras

O modelo cascata proporciona disciplina para o gerenciamento de projetos e oferece um resultado

tangível ao final de cada fase. Porém, não é possível fazer alterações depois que uma fase for
concluída, pois as alterações podem afetar o tempo de entrega, os custos e a qualidade do
software. Portanto, esse modelo é mais adequado para pequenos projetos de desenvolvimento de
software, nos quais é mais fácil organizar e gerenciar tarefas e os requisitos podem ser
predefinidos com precisão.

Iterativo
O processo iterativo sugere que as equipes comecem o desenvolvimento de software com um
pequeno subconjunto de requisitos. Com o passar do tempo, eles aprimoram as versões
iterativamente até que o software completo esteja pronto para produção. A equipe produz uma
nova versão do software ao final de cada iteração.

Prós e contras

A identificação e o gerenciamento de riscos são fáceis, uma vez que os requisitos podem ser
alterados entre as iterações. Porém, a repetição de ciclos pode levar à alteração do escopo e a
subestimação de recursos.

Espiral

O modelo espiral combina os pequenos ciclos repetidos do modelo iterativo com o fluxo sequencial
linear do modelo cascata, a fim de priorizar a análise de riscos. O modelo espiral pode ser usado
para garantir o lançamento e o aprimoramento gradual do software, com a criação de protótipos em
cada fase.

Prós e contras

O modelo espiral é adequado para projetos grandes e complexos, que exigem alterações
frequentes. Porém, ele pode ter um custo alto para projetos menores com escopo limitado.

Ágil

O modelo ágil organiza as fases do SDLC em vários ciclos de desenvolvimento. A equipe itera as
fases rapidamente, fazendo apenas alterações pequenas e incrementais ao software em cada
ciclo. Eles avaliam continuamente os requisitos, planos e resultados para que possam responder
rapidamente às alterações. O modelo ágil é iterativo e incremental, o que o torna mais eficiente do
que outros modelos de processo.

Prós e contras
Os ciclos de desenvolvimento rápidos ajudam as equipes a identificar e resolver questões
antecipadamente em projetos complexos, antes que elas se tornem problemas significativos. Eles
também podem envolver clientes e outras partes interessadas para obter feedback em todo o ciclo
de vida do projeto. Porém, a dependência exagerada do feedback de clientes pode levar a
alterações excessivas no escopo ou ao encerramento prematuro do projeto.

Como o SDLC administra a segurança?

Nos métodos tradicionais de desenvolvimento de software, o teste de segurança era um processo
separado do ciclo de vida do desenvolvimento de software (SDLC). A equipe de segurança
descobria as falhas de segurança somente depois de criar o software. Isso levava a um alto
número de bugs que permaneciam ocultos e aumentavam os riscos de segurança.

Hoje, a maioria das equipes reconhece que a segurança é uma parte integral do ciclo de vida do
desenvolvimento de software. Você pode administrar a segurança no SDLC adotando as práticas
de DevSecOps e conduzindo avaliações de segurança durante todo o processo do SDLC.

DevSecOps

DevSecOps é a prática de integrar testes de segurança em todas as etapas do processo de

desenvolvimento de software. Ele inclui ferramentas e processos que incentivam a colaboração
entre desenvolvedores, especialistas em segurança e equipes operacionais para criar software
resiliente às ameaças modernas. Além disso, o DevSecOps garante que as atividades de
segurança, como revisão de código, análise da arquitetura e testes de penetração, sejam parte
integrante das iniciativas de desenvolvimento.