Frontend Developer

The set of types in the JavaScript language consists of primitive values and objects.

1. Primitive values (immutable datum represented directly at the lowest level of the language)
1.1 Boolean type : Boolean represents a logical entity and can have two values: true and false. 
1.2 Null type : The Null type has exactly one value: null.
1.3 Undefined type : A variable that has not been assigned a value has the value undefined. 
1.4 Number type : ECMAScript has two built-in numeric types: Number and BigInt.
The Number type is a double-precision 64-bit binary format IEEE 754 value (numbers between -(2^53 − 1) and 2^53 − 1). In addition to representing floating-point numbers, the number type has three symbolic values: +Infinity, -Infinity, and NaN ("Not a Number").
The BigInt type is a numeric primitive in JavaScript that can represent integers with arbitrary precision. With BigInts, you can safely store and operate on large integers even beyond the safe integer limit for Numbers. BigInt is created by appending n to the end of an integer or by calling the constructor.
1.5 String type : JavaScript's String type is used to represent textual data. It is a set of "elements" of 16-bit unsigned integer values. Each element in the String occupies a position in the String. The first element is at index 0, the next at index 1, and so on. The length of a String is the number of elements in it.
1.6 Symbol type : A Symbol is a unique and immutable primitive value and may be used as the key of an Object property. In some programming languages, Symbols are called "atoms".

2. Objects (collections of properties) : In JavaScript, objects can be seen as a collection of properties. With the object literal syntax, a limited set of properties are initialized; then properties can be added and removed.

In JavaScript, the typeof operator returns the data type of its operand in the form of a string. The operand can be any object, function, or variable.
Syntax: typeof operand

The possible types that exists in javascript are:

undefined
Object
boolean
number
string
symbol
function

The getElementsByClassName method of Document interface returns an array-like object of all child elements which have all of the given class name(s).

JavaScript is a single-threaded language, which means it has only one call stack that is used to execute the program. The call stack is the same as the stack data structure that you might read in Data structures. As we know stacks are FILO that is First In Last Out. Similarly, within the call stack, whenever a line of code gets inside the call stack it gets executed and move out of the stack. In this way, JavaScript is a single-thread language because of only one call stack.
JavaScript is a single-threaded language because while running code on a single thread, it can be really easy to implement as we don’t have to deal with the complicated scenarios that arise in the multi-threaded environment like deadlock.

Async/Await is the extension of promises which we get as a support in Javascript. 

Async: It simply allows us to write promises based code as if it was synchronous and it checks that we are not breaking the execution thread. It operates asynchronously via the event-loop. Async functions will always return a value. It makes sure that a promise is returned and if it is not returned then javascript automatically wraps it in a promise which is resolved with its value.
Await : Await function is used to wait for the promise. It could be used within the async block only. It makes the code wait until the promise returns a result. It only makes the async block wait.

Every Angular application consists of components and templates which the browser cannot understand. Therefore, all the Angular applications need to be compiled first before running inside the browser.

Angular provides two types of compilation:
JIT(Just-in-Time) compilation
AOT(Ahead-of-Time) compilation

In JIT compilation, the application compiles inside the browser during runtime.
Whereas in the AOT compilation, the application compiles during the build time.

The advantages of using AOT compilation are:
Since the application compiles before running inside the browser, the browser loads the executable code and renders the application immediately, which leads to faster rendering.
In AOT compilation, the compiler sends the external HTML and CSS files along with the application, eliminating separate AJAX requests for those source files, which leads to fewer ajax requests.
Developers can detect and handle errors during the building phase, which helps in minimizing errors.
The AOT compiler adds HTML and templates into the JS files before they run inside the browser. Due to this, there are no extra HTML files to be read, which provide better security to the application.

Every component in Angular has a lifecycle, different phases it goes through from the time of creation to the time it's destroyed. Angular provides hooks to tap into these phases and trigger changes at specific phases in a lifecycle.

ngOnInit( ) This hook gets called once, after the ngOnChanges hook. It initializes the component and sets the input properties of the component.

Child to parent using @Output and EventEmitter : 
In this method, we bind a DOM element inside the child component, to an event ( click event for example ) and using this event we emit data that will captured by the parent component:

Child Component:
import {Component, Output, EventEmitter} from '@angular/core';

@Component({
selector: 'app-child',
template:`
Click to emit data
`,
styleUrls: ['./child.component.css']
})
export class ChildComponent {

data:string = "Message from child to parent";

@Output() dataEvent = new EventEmitter();

constructor() { }

emitData(){
this.dataEvent.emit(this.data);
}
}

Here, we have used @Output property to bind an EventEmitter. This event emitter emits data when the button in the template is clicked.
In the parent component’s template we can capture the emitted data like this: 


Then inside the receiveData function we can handle the emitted data:
receiveData($event){
this.dataFromChild = $event;
}

There mainly two types of data binding in angular

One way data binding
One way data binding is a change in the state affects the view from component to view template or change in the view affects the state from view template to component.

Two-way data binding
Two-way data binding is a change from the view can also change the model and similarly changes in the model can also change in the view from component to view template, and also from view template to the component.