Brainscape's Knowledge GenomeTM

Browse over 1 million classes created by top students, professors, publishers, and experts.


See full index

panel study java2004usf > Angular and Typescript > Flashcards

Angular and Typescript Flashcards

1
Q

What is Typescript?

A

-Typescript is a superset of JavaScript which primarily provides the option of
static typing, classes, and interfaces.
-It is a transpiled into plain JavaScript

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What are some of Typescripts benefits?

A
  • It’s a language utilized in many front-end frameworks such as Angular.
  • It provides optional static typing and type inference
  • It offers enhanced IDE support (intelesense/autocomplete)
  • it offers the access modifiers public and private for added data protection
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What does the “let” keyword mean?

A

Let is similar to var in some respects but let forces local scoping

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What does the Arrow Function (=>) do?

A

Defines a nameless function with the benefits of:

  • More concise code
  • Simplifies function scoping and usage of the ‘this’ keyword
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What is Angular?

A

Angular is a popular front-end framework built on top of typescript, it’s features include:

  • A powerful CLI to aid in creating easily maintainable file structures.
  • Built in development tools for DOM manipulation, Http services and testing.
  • Fully integrated dependency injection based loose coupling.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What is a Single Page Application (SPA)

A

A web application or web site that interacts with the
user dynamically by rewriting the current page rather than loading a whole new page
from a server.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is a Webpack?

A 
A Webpack is a module bundler. It takes care of bundling your application for deployment alongside a separate task
runner.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What is minification?

A

The process of removing unnecessary or redundant data without affecting how the resources is processed by the browser.
-Example would be removing of white space, comments, unused code, shorter variable
and function names and so on.
-Used to compress source code files for deployment

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

In Angular, what is a module?

A

It’s a mechanism to group components, directives, pipes, and
services that are related, in such a way that can be combined with other modules to
create an application
-Modules can be easily imported and exported for use.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What are components?

A

The most basic building block of a UI in an Angular application
Everything in Angular components and the application is represented as a tree of these
components.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What are decorators? What are some common decorators?

A 
A keyword preceded by an "@"  who's purpose is to store metadata about a class, method, or
property.
It defines the entity, to which it is attached, so Angular knows how it should handle it internally.
Common decorations:
@NgModule()
-@Component()
-@Input()
-@Output()
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What is a directive?

A

Directives allow you to attach behavior to elements in the DOM.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What are the two main types of directives? What are some examples of each?

A
  • Structural Directives, for changing HTML layout or Manipulating the DOM’s structure
  • -*ngIf
  • -*ngFor
  • -ngSwitch

-Attribute Directives, for change the appearance or behavior of a DOM element,
component, or another directive.
–ngStyle
–ngClass

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What is a Dependency Injection? Why is it beneficial?

A

It is a specific example of the concept of Inversion of Control. The Angular framework handles where and when resources are injected into our code, so we can focus primarily on business logic.
Dependency Injection is beneficial because it keeps your classes loosely
coupled and isolates test cases.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is ngModel? What are it’s benefits?

A

It’s an Angular Directive used to track key information about a FormControl instance (ex. input element). Its benefits include:

  • It provides information for enhanced input validation
  • It can be used to achieve two-way data binding
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What is Data Binding?

A

A mechanism in Angular for coordinating the parts of a template(HTML) with the parts of a component(TypeScript)

17
Q

What are the types of Data Bindings? How do you implement them?

A

One-way
{{ value }}
-Interpolation, used in the template HTML to move data from the component to the DOM

[ property ] = “value”
-Property binding, used in an HTML tag to to move data from the component to the DOM

( event ) = “handler”
-Event binding, used in an HTML tag to move data from the DOM to the component

Two-way
[( ngModel )] = “property”
ng-model, used in an HTML tag to achieve two-way binding.

18
Q

How do you make a class a component?

A 
Normally we use Angular's CLI to create classes preconfigured to be components.
To manually make a class a component, add the decorator "@Component" to the class.
19
Q

How do you make asynchronous calls using Angular?

A

Assuming you are using a service with a predefined function that is returning an
observable or a promise.
Make the call to the service and subscribe to it with the subscribe method.
Inside the subscribe method, define a callback to execute when the service call is
resolved and inside that you can store it in a variable or do any manipulation you want.

20
Q

What is a Pipe? What are some built in pipes?

A

A pipe takes in data as input, does some transformations, returns some output
Used for writing formatting tasks or other repetitive tasks
Common pipes:
-DatePipe
-LowerCasePipe
-CurrencyPipe

21
Q

What is a Service?

A 
A class with the @Injectable()  decorator.  It encapsulates 
 non-UI logic and code that can be reused across an application. It provides its logic or code via dependency injection to other components.
22
Q

What is an Observable?

A

A collection that arrives over time(aka lazy loading)
Often used to handle async data requests
You can subscribe to the call and when the observable populates you can get the data
you need from it

23
Q

What is a Provider?

A 
It's an object or class that provides a component with data.
Providers, such as services, must be registered to a component or module for dependency injection to function properly.
24
Q

What is an Injectable?

A

A Decorator that tells Angular that the class is available to the Injector for creation.

25
Q

What is Routing?

A

Routing is the ability to send users from one page in an application to another
page in the application and back.

26
Q

What are the Lifecycle Hooks? What are some commonly used hooks?

A

The lifecycle of a component is managed by Angular itself, creation, rendering, databound properties. Hooks allow you to respond to these
events.
Common LifecycleHooks:
- ngOnInit - run after component is intialized
- ngOnDestroy - just before the component is destroyed

27
Q

What is CLI?

A
  • CLI stands for Command Line Interface.
  • Set of commands that you can run on the command line
  • The Angular CLI is used for constructing the scaffolds of apps and components from
    the command line.
28
Q

What are template literals?

A

A way of assigning strings. They are defined between two backticks `` and variables can
be inserted with ${var} without having to break the strings and do concatenation.
Another benefit is that they support multiline formatting.

29
Q

What is linting?

A

Linting is the process of running a program that analyses your code for programmatic and stylistic errors.
A Linting tool, or a linter, checks any potential errors in your code such as syntax errors, incorrectly spelled variable names, and many more.
This can save time and help you write better code.

30
Q

What is NPM?

A

It stands for Node Package Manager, a popular a package manager used for web technologies.
NPM may refer to:
-its software registry with a lots of packages (modules).
-its website used to browse and find software.
-its Client CLI used to manage local and remote packages

31
Q

What are Event Emitters?

A

a class in Angular that is used by directives and components to
emit custom events.
Event emitters are defined as output events.
example:
@Output() customEvent = new EventEmitter()

32
Q

What is bootstrapping? What is the default component bootstrapped?

A

Bootstrapping is the creation of specified components when the app is loaded and
the addition of those components to the browser DOM.
Components to be bootstrapped are specified by listing them in the NgModule’s
bootstrap array.
By defualt the base application bootstraps with AppComponent.

33
Q

What are the data types in Typescript?

A
  • Boolean
  • String
  • Number
  • Array
  • Enum
  • Any
  • Void
34
Q

What are the CLI commands to generate components and services?

A
  • ng g c component-name - generates a component.

- ng g service service-name - generates a service.

35
Q

What is a template?

A

Code that defines how to render a component’s view.

36
Q

What is the HttpClientModule used for?

A

It allows access to the HttpClient class that provides tools for performing HTTP requests.

37
Q

When I use the CLI to create a component what files does it create?

A
  • component.ts, for logic related to the component presentation
  • component.spec.ts, created with built in tests and a testing bed
  • component.css, for component-level styling
  • component.html, for code related to the components view
38
Q

What are Jasmine and Karma?

A

Jasmine is a JavaScript testing framework

Karma is a tool which lets us spawn browsers and run Jasmine tests inside of them all from the command line.

39
Q

How do I bundle my Angular application?

A

Ng build command for the CLI will bundle the application into a dist/ folder
Specifying a production built with –prod will be more optimized for user interaction

panel study java2004usf (6 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2024 Bold Learning Solutions. Terms and Conditions