Categories
AJAX Angular CSS CSS3 HTML HTML5 JavaScript jQuery NodeJS UI

UI Architect Interview Questions and Answers

what is tail call optimization ?
TCO (Tail Call Optimization) is the process by which a smart compiler can make a call to a function and take no additional stack space.

Recursive function approach has a problem. It builds up a call stack of size O(n), which makes our total memory cost O(n). This makes it vulnerable to a stack overflow error, where the call stack gets too big and runs out of space. Tail Cost Optimization (TCO) Scheme. Where it can optimize recursive functions to avoid building up a tall call stack and hence saves the memory cost.

what is Map, Set, WeakMap and WeakSet ?
Map is a collection of keyed data items, just like an Object. But the main difference is that Map allows keys of any type.

A Set is a collection of values, where each value may occur only once means it will contain unique set of keys. 

WeakSet is a special kind of Set that does not prevent JavaScript from removing its items from memory. WeakMap is the same thing for Map.
WeakMap does not support iteration and methods keys(), values(), entries(), so there’s no way to get all keys or values from it.

Map – is a collection of keyed values.

The differences from a regular Object:

Any keys, objects can be keys.
Iterates in the insertion order.
Additional convenient methods, the size property.
Set – is a collection of unique values.

Unlike an array, does not allow to reorder elements.
Keeps the insertion order.
Collections that allow garbage-collection:

WeakMap – a variant of Map that allows only objects as keys and removes them once they become inaccessible by other means.

It does not support operations on the structure as a whole: no size, no clear(), no iterations.
WeakSet – is a variant of Set that only stores objects and removes them once they become inaccessible by other means.

Also does not support size/clear() and iterations.
WeakMap and WeakSet are used as “secondary” data structures in addition to the “main” object storage. Once the object is removed from the main storage, if it is only found in the WeakMap/WeakSet, it will be cleaned up automatically.

how to do peer to peer communication in ANgular ?

what is directive & components in angular ?

if loop functions are removed from script, how can you achieve same functionality ?

how to drop both data and collection in mongodb ?

what is generic types in Typescript ? advantages ?

how to define custom types in Typescript ?

how to capture the process specific exceptions in NodeJS ?

how do you print name of file currently executing in NodeJS ?

how to use custom pipes in Angular ? can you pass additional parameters in custom pipes ?

what is the max data can be stored in a mongodb document ?

how to acheieve variable length documents in mongodb ?

how do you set autoincrement field in mongodb ?

what is the difference between throttling & debouncing ?
Throttling enforces a maximum number of times a function can be called over time. As in “execute this function at most once every 100 milliseconds.”
Debouncing enforces that a function not be called again until a certain amount of time has passed without it being called. As in “execute this function only if 100 milliseconds have passed without it being called.”

what is event bubbling ? how to stop ?
what is digest cycle in angularJS ?
how to stop propgation ?
what is interpolation ? how does it work ?
what is shadow dom ?
what is webworker ?
how to cache the page/data in HTML 5 ?
how to give offline view expereince in HTML5 ?
what is lazyloadng? how it works ?
what are pure / impure pipes ?
what is redux ? how does it work ?
unit testing code coverage how to check ?
what tool used for unit test ?
streaming , how does it work ?
any custom video/audio player developed?
how does cache works in HTML5 ?
what is method chaining ?
difference between canvas vs SVG ?
what is XSS and how to avoid it ?

difference between Responsive and Adaptive design ?
diff b/w flexbar & grid designs ?
what is cors ? how to allow ?
symmetric & asymetric keys ?
scope usage in OAuth token ?
explain component lifecycle
how to use service in Angular ?
what is event emitters ?
latest ECMA version ?
INPUT & OUTPUT variables usage in Angular
explain Digest Lifecycle in Angular ?
difference between Angular 1.x & Angular 2.x
what is SASS & SCSS ?
what is ViewChild ? OR ViewCildren ?

Explain the following :

Directives,
decorators,
Services,
Modules,
Data Binding,
Components,
Filters,
DOM ,
Events ,
Routing,
Dependency injection.

Categories
Agile AJAX Angular CSS CSS3 HTML HTML5 JavaScript jQuery NodeJS UI

Javascript / UI / Angular Architect Questions and Answers

1.Difference between var let and const. ?

a. Var is hoisted in JS, let and const are not hoisted.

b. Let, const are block level, var is function level The candidate has to tell at least one of these apart from any other difference he tells.

2. What is a closure and how does it work

a. A closure is an inner function that has access to the outer (enclosing) function’s variables—scope chain.

A closure is an inner function that has access to the outer (enclosing) function’s variables—scope chain.

3. What is a JavaScript class

a. ES 6 standard introduced classes in JS, which internally use the prototypal approach to implement Class .

4. How does JS implement inheritance

a. JS uses prototypal inheritance in which objects inherit properties from other objects (or) JS uses prototypes to implement inheritance

5. What is the difference between == and === in JS

a. == checks only for the value, where === checks for both value and data type

6. What is the use of hasOwnProperty method in JS

a. This method returns true, only when the passed property is present directly on the object.

7. Explain call, apply and bind

a. Call and apply are used to invoke a method, by setting the context of ‘this’ keyword. Call takes comma separated individual parameters, and apply takes array of parameters as arguments

b. Bind method does the same operation as call and apply, but returns a new function definition instead of invoking the method

8. What is ‘arguments’ keyword in JS

a. Arguments is a special property in every function, that holds all the parameters passed to that function. Its an array-like object.

9. What is arrow function

a. Arrow function is introduced in ES 6 standard of JS, and does implicit binding of this property.

10. What are benefits of TypeScript

a. * TS provides type safety for the variables

Skills checked:

JS core – Intermediate / Advanced

  1. What is a closure and how it works in JavaScript
  2. What is a ‘hosting’ , How this works in JavaScript ?
  3. call, apply and bind with example
  4. Event bubbling and Event capturing
  5. event delegation
  6. prototypical inheritance / prototypical chain
  7. strict mode and usual mode
  8. What is EventLoop?

ECMA

  1. Difference between var, let and const?
  2. What is a promise and how it works?
  3. What is a arrow function and its difference from function syntax?
  4. Generator and how it works
  5. JS modules, export and export default
  6. async/await

Angular – Intermediate / Advanced

  1. Virtual DOM concept.
  2. Subscribe, Observables and Promises.
  3. Different ways of data bindings.
  4. Sequence of Angular Lifecycle Hooks
  5. Routing
  6. Reactive Forms.

React JS and Redux – Novice / Intermediate

  1. Virtual DOM concept.
  2. Explain lifecycle of React component.
  3. Difference between state and props.
  4. Redux
  5. Role of reducer

HTML – Novice / Intermediate

  1. What is a Doctype?
  2. quirks mode and standart mode
  3. new features in html5
  4. Html storage Localstorage and sessionstorage

CSS – Novice

  1. Difference between adaptive and responsive design?
  2. What is a repaint and reflow?
  3. Media query.
  4. Layout Methodology.
  5. How browser search selector?

Networking – Intermediate

  1. What is REST?
  2. REST principles.
  3. Difference between POST and PUT requests

Design Patterns – Advanced

  1. Factory Patterns
  2. Singleton Patterns

Unit testing

  1. TDD/BDD
  2. jasmine/karma

Processes

  1. GIT
  2. Code review process and tools
  3. CI/CD
  4. SOLID
  5. SCRUM
  6. Webpack
  7. IDE

Categories
Angular JavaScript NodeJS UI

BARCO – MEAN Architect – NodeJS developer Interview Questions and Answer

BARCO – MEAN Architect – NodeJS developer Interview Questions and Answer

what is tail call optimization ?
TCO (Tail Call Optimization) is the process by which a smart compiler can make a call to a function and take no additional stack space.

Recursive function approach has a problem. It builds up a call stack of size O(n), which makes our total memory cost O(n). This makes it vulnerable to a stack overflow error, where the call stack gets too big and runs out of space. Tail Cost Optimization (TCO) Scheme. Where it can optimize recursive functions to avoid building up a tall call stack and hence saves the memory cost.

what is Map, Set, WeakMap and WeakSet ?
Map is a collection of keyed data items, just like an Object. But the main difference is that Map allows keys of any type.

A Set is a collection of values, where each value may occur only once means it will contain unique set of keys. 

WeakSet is a special kind of Set that does not prevent JavaScript from removing its items from memory. WeakMap is the same thing for Map.
WeakMap does not support iteration and methods keys(), values(), entries(), so there’s no way to get all keys or values from it.

Map – is a collection of keyed values.

The differences from a regular Object:

Any keys, objects can be keys.
Iterates in the insertion order.
Additional convenient methods, the size property.
Set – is a collection of unique values.

Unlike an array, does not allow to reorder elements.
Keeps the insertion order.
Collections that allow garbage-collection:

WeakMap – a variant of Map that allows only objects as keys and removes them once they become inaccessible by other means.

It does not support operations on the structure as a whole: no size, no clear(), no iterations.
WeakSet – is a variant of Set that only stores objects and removes them once they become inaccessible by other means.

Also does not support size/clear() and iterations.
WeakMap and WeakSet are used as “secondary” data structures in addition to the “main” object storage. Once the object is removed from the main storage, if it is only found in the WeakMap/WeakSet, it will be cleaned up automatically.

how to do peer to peer communication in ANgular ?

what is directive & components in angular ?

if loop functions are removed from script, how can you achieve same functionality ?

how to drop both data and collection in mongodb ?

what is generic types in Typescript ? advantages ?

how to define custom types in Typescript ?

how to capture the process specific exceptions in NodeJS ?

how do you print name of file currently executing in NodeJS ?

how to use custom pipes in Angular ? can you pass additional parameters in custom pipes ?

what is the max data can be stored in a mongodb document ?

how to achieve variable length documents in mongodb ?

how do you set auto increment field in mongodb ?

Categories
AJAX Angular HTML HTML5 JavaScript jQuery NodeJS UI VueJS

Angular Interview Questions and Answers | UI Architect Advanced Level Questions

Angular Interview Questions and Answers | UI Architect Advanced Level Questions

How to write Custom Filter in Angular ?

Angular exposes a simple API for creating a filter. similiar to controller declaration with syntax  app.controller(‘myCtrl', function(){});, you can create a new filter by appending .filter(‘filterName', function(){}) to your Angular application. A filter is very similar to a factory or service but has a global scope once its created.You can invoke a filter on both the data binding in your html or directly inside of your controller or directive by using the $filter service.

Function to find the longest word in a sentence ?
First take string sentence and convert this into a array using split()  with separator as space (‘ ‘).

const stringArray = str.split(" ");

And than pass this array into custom sort function to sort based on the word length.

function findLongestWord(str) {
  const stringArray = str.split(" ");
  const orderedArray = stringArray.sort((a, b) => {
    return a.length < b.length;
  });
  return orderedArray;
}

Now just return the  first word (0-index of the array) of the array which contains longest word of the sentence.

Difference between service & factory in Angular ?

The difference between factory and service is just like the difference between a function and an object

Factory Provider

  • Gives us the function’s return value ie. You just create an object, add properties to it, then return that same object.When you pass this service into your controller, those properties on the object will now be available in that controller through your factory. (Hypothetical Scenario)
  • Singleton and will only be created once
  • Reusable components
  • Factory are a great way for communicating between controllers like sharing data.
  • Can use other dependencies
  • Usually used when the service instance requires complex creation logic
  • Cannot be injected in .config() function.
  • Used for non configurable services
  • If you’re using an object, you could use the factory provider.
  • Syntax: module.factory('factoryName', function);

Service Provider

  • Gives us the instance of a function (object)- You just instantiated with the ‘new’ keyword and you’ll add properties to ‘this’ and the service will return ‘this’.When you pass the service into your controller, those properties on ‘this’ will now be available on that controller through your service. (Hypothetical Scenario)
  • Singleton and will only be created once
  • Reusable components
  • Services are used for communication between controllers to share data
  • You can add properties and functions to a service object by using the this keyword
  • Dependencies are injected as constructor arguments
  • Used for simple creation logic
  • Cannot be injected in .config() function.
  • If you’re using a class you could use the service provider
  • Syntax: module.service(‘serviceName’, function);

AngularJS .service


module.service('MyService', function() {

    this.method1 = function() {
            //..method1 logic
        }

    this.method2 = function() {
            //..method2 logic
        }
});

AngularJS .factory


module.factory('MyFactory', function() {

    var factory = {}; 

    factory.method1 = function() {
            //..method1 logic
        }

    factory.method2 = function() {
            //..method2 logic
        }

    return factory;
});

Explain CSS position attribute ?

The position property specifies the type of positioning method used for an element (static, relative, absolute, fixed, or sticky).

static Default value. Elements render in order, as they appear in the document flow
absolute The element is positioned relative to its first positioned (not static) ancestor element
fixed The element is positioned relative to the browser window
relative The element is positioned relative to its normal position
sticky The element is positioned based on the user’s scroll position
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Explain Isolate Scope in Angular ?
Scope in AngularJS inherits from Parent Scope by default. Isolated scope does not inherit from the parent scope by default. It can access its parent scope through the $parent property.  So, Directive has three options for isolating its scope from parent scope. The following are the three options:

  1. scope: false  It is default in Directive. It lets to reuse the scope from the place where the component is being used.
  2. scope: true – It creates a child scope. This child scope prototypically inherits from the scope where the component is being used.
  3. scope: {…} – It creates Isolates scope. It does not prototypically inherit from the scope where the component is being used.

Isolated scope completely decouples component or template from the rest of the application or a place where it is being used.

There are three types of interface to specify between the element’s attributes and the isolated scope:
  1. interpolate (@)
  2. data bind (=)
  3. expression (&)
Attributes or Interpolate (@)
An Isolated scope property can be bind with DOM attributes. Interpolate or attribute sets up a one-way data binding from the Parent scope to the Isolated Scope of Directive.
Binding (=)
Binding works almost exactly like the attribute except that it provides two-way mode binding.
Expression (&)
Expression is used to call a function on the Parent scope from the Isolated Scope.

Explain angular Prototype ? 

 

Difference between async and defer tags in Javascript ?
Defer and Async tags are available only for external scripts (with src=”” tag). If you will try to use them for internal scripts like <script>…</script> tags, defer and async will be ignored.
Adding an async tag to the JavaScript code , so that creation of the DOM model happens in parallel, and won’t be interrupted while the JavaScript is loading and executed.
Adding a defer tag with JavaScript code, it will not stop loading the DOM and CSSOM models. All scripts with a defer tag will be loaded and run immediately after the DOM and CSSOM models are completed. Any scripts will be loaded in the order you code.

What is Event delegation in JS ?
JavaScript event delegation is a simple technique by which you add a single event handler to a parent element in order to avoid having to add event handlers to multiple child elements.

What is Closure in JS ?
A closure is basically when an inner function has access to variables outside of its scope. Closures can be used for things like implementing privacy and creating function factories.

What is Debouncing & Throttling in JS ?
Debouncing is one way to solve the issue of same function calling multiple times on event action, by limiting the time that needs to pass by until a function is called again.

Throttling is another technique that’s is similar to debouncing, except that instead of waiting for some time to pass by before calling a function, throttling just spreads the function calls across a longer time interval.
So if an event occurs 10 times within 100 milliseconds, throttling could spread out each of the function calls to be executed once every 2 seconds instead of all firing within 100 milliseconds.

Difference between  TDD vs BDD ?
In TDD (Test Driven Development), the test is written to check the implementation of functionality, but as the code evolves, tests can give false results. BDD (Behavior Driven Development) is also a test-first approach, but differs by testing the actual behavior of the system from the end users perspective.