HTTP in Angular

It offers :

1. Ability to request typed response objects.
2. Streamlined error handling.
3. Testability features.
4. Request and response interception.

HTTPClientModule #

It configures the dependency injector for the HTTP Client. We can dd the interceptors to the chain behind HTTPClient by binding them to the multiprovider for built-in HTTP interceptors.

Synchronous HTTP requests #

One task must be executed in some way that is dependent on the other, such as wait to start until the other task is completed.

Ways: connected or dependent

Asynchronous HTTP requests #

Totally independent and neither one must consider the oher in any way, either in the initialtion or execution.

Callbacks #

It is a function that is passed into another funtion as an argument, which is then invoked inside the other function to complete some kind of action.

function greeting(name) {
  alert("Hello " + name);
}
function processInput(callback) {
  var name = prompt("Please enter name", "Harry Potter");
  callback(name);
}
processInput(greeting);

Promises #

It allows us to associate the handlers with an asynchronous action’s eventual success value or failure reason.

States : pending, fulfilled, rejected

Promise can neither be fullfilled with a value or rejected with a reason. When either of these happens the associated handlers queued up by a promise’s then menthods are invoked.

Async Functions #

It can be placed before a function to make it an async function. It means that the function will return a promise.

async function foo() {
  return "Hello World";
}
foo().then(console.log);

Await #

It makes the js wait until that promise settles and returns its result.

Syntax : let value = await promise;

async function foo() {
  let promise = new Promise((resolve, reject) => {
    setTimeout(() => resolve("Hello World"), 1000);
  });
  let result = await promise;
  console.log(result);
}
foo();

Note:
 - Promise : then
 - Observable : subscribe

The promise or observable implementation throws an error with the throw keyword. The promise or observable implementation calls the reject function or error method on the observer.

Ways to handle error emitted in the promise #

1. then method

2. Method chaining - catch method

Ways to call the subscribe method of an observable #

1. implementing the observer as argument.

observable.subscribe({
  next : nextfunc
  error : errorfunc
});
function nextfunc(value) {
  console.log(value);
}
function errorfunc(error) {
  console.log(error);
}

Note : In object argument the object containing the optional `function` properties `next` , `error` and `complete`.

2. function as an argument.

observable.subscribe(nextfunc, errorfunc);
function nextfunc(value) {
  console.log(value);
}
function errorfunc(error) {
  console.log(error);
}

Single v/s multiple Values #

1. Promise emits a single value.

2. Observable emits multiple values.

Eager v/s lazy #

1. Promise are eager : the executor function is called as soon as the promise is created.

2. Observable are lazy : the executor function is called only when the observer subscribes to the observable.

Non-cancelable v/s cancelable #

1. When we subscribe to a promise with then - keyword then the handler function which we pass to then is called immediately.

2. After subscribing to an observable with subscribe - keyword we can cancel the subscription at anytime by calling the unsubscribe method of the subscription.

Multicast v/s unicast #

1. The executor function of a promise is executed only once. It means that all the calls to then on a given promise object just ‘tap’ into the ongoing execution of the executor function and in the end get a copy of the result value. The promise performs multicast because the same execution and result value is used for multiple subscribers.

2. Subscriber function of an observable is executed on each call to subscribe on this observable. The observable performs the unicast because there is a separate execution and result value for each subscriber.

Async Handlers v/s Sync Handlers #

1. Handler functions of a promise are executed asynchronously. (Executed after all the code in the main program or the current function is executed.)

2. Handler functions of observables are executed synchronously. (Executed within the flow of the current function or the main program.)