‐: ( Publicis Sapient ) :‐ - sakib03/Interview GitHub Wiki
Any experience in Responsive? How do you achieve responsive behavior? What breakpoints and viewports do you support for responsive? How do you handle landscape vs portrait Views using media queries?
Do you know what does “Context” mean in JavaScript? How do you change the Context of a given function?
Have you used or familiar with automated testing in JS? Have you written unit/end to end test cases in JS? (Test driven Development)
Variables, Scope, Data Types, operators, loops, if statements, error handling and functions. Execution Context (this). [Call, Apply, Bind]
Callbacks and setTimeOut, Promises, chaining promises, [Promise.all, Promise.race ], error handling, async / await
FUNCTIONAL PROGRAMMING: Pure Functions / Side Effects / Purifying closures, Point-free style, Composition / Compound functions, Immutability, Map / Reduce / Filter, Higher-order functions, Currying / Composing
Webpack / Parcel / Rollup - config from-ground setup, Code Splitting, Tree Shaking, Fedration, Loaders and plugins
How do you secure your Javascript code? What is CSRF (Cross-Site Request Forgery)? What do you understand with XSS (Cross Site Scripting)?
Do you think JS files added inside the body tag can impact page rendering? If yes – then how can we make them unblocking?
How can one find out the Execution scope and order of functions with their time taken using some tool?
Semantic Markup, RWD, Responsive Images, Atomic Design, Design System, OOJS Concepts, Closures, DOM manipulation
Compression, Caching / CDN / Expirations, HTTP Headers, JS Profiling (CPU/MEM), HTTP2, Universal View State, Perf Analysis / Log monitoring tools
Basic perf testing: lighthouse, webpagetests. Awareness of metrices like TTFB, TTI and their possible high no. causes
Security: SSL/TLS, CORS, XSS, CSRF, Access / Refresh Tokens / Encryptions, Validations / Encoding, HTTP Cookies / Sec. Headers, Sessions / Authentication / Authorization / protect user data, RBAC, ABAC
Accessibility: Understands A/ AA / AAA accessibility guidelines and write code adhering to meet the accessibility benchmarks, , Has a fair understanding to make dynamic content accessible with ARIA, Uses enhanced techniques to meet accessibility standards viz: skip navigation, no js etc. Creating accesible forms, content and best practices
Gulp/Grunt - create tasks / custom scripts, Webpack / Parcel / Rollup - config from-ground setup, Code Splitting, Loaders and plugins, Understands GIT hooks and can use them. - Code bundling/minification/production ready assets using Webpack etc, Test Case runners. Docker, Vagrant and the differences.
Logging Standards: Can customize logging framework to extend to create own formats with additional data like session id, hostname for log statements.
Estimation / Planning: Check understanding of top-down / bottom-up approaches and how estimations are refined over time, WBS / Poker. Planning for tracks, traging etc
The localStorage and sessionStorage objects, part of the web storage API, are two great tools for saving key/value pairs locally. Using localStorage and sessionStorage for storage is an alternative to using cookies and there are some advantages:
- The data is saved locally only and can’t be read by the server, which eliminates the security issue that cookies present.
- It allows for much more data to be saved (10mb for most browsers).
- The syntax is straightforward.
Yes, but with a catch. The W3 documents state that the tags represent the header and footer areas of their nearest ancestor section. I would recommend having as many as your want, but only 1 of each for each "section" of your page, i.e. body, section etc.
If we do not include the <!DOCTYPE> element in our HTML page or Document, it will go to Quirks Mode. In this mode, the HTML element depends on the browser. Hence the content will be displayed according to the browser.
DOM: Beginners often mislead DOM with what they create as an HTML structure of their website or application. But HTML becomes the DOM after the browser parses it, then it becomes the DOM. The definition says that DOM is an API for HTML or XML documents and it creates a logical structure which can be accessed and manipulated. Shadow DOM and Virtual DOM: The only thing which is common for both is that they help with performance issues. Both create a separate instance of the Document Object Model; besides this, both concepts are different. Virtual DOM is creating a copy of the whole DOM object, and Shadow DOM creates small pieces of the DOM object which has their own, isolated scope for the element they represent. Read more
Are basically a specification identifying the related set of properties and methonds. It can be used as a data type, where we identify a set of properties for a specific type. It can be used by 'implements' keyword on a class, where we identify a feature set by declaring properties and methods, only declarations.
export interface interfaceName {
property: type;
method(): type;
}
process.stdout.write console in same line.
Object.freeze() prevents mutability. const prevents reassignment.
Every script has access to the global scope, and if everyone uses the global namespace to define their variables, collisions will likely occur. Use the module pattern (IIFEs) to encapsulate your variables within a local namespace.
What are object prototypes? What are difference between classes and prototypes? What are some potential problems that can arise when using prototypes?
Grunt and Gulp are task runners, while Webpack is a module bundler. Task runners are basically used to automate tasks in a development process. Some of these tasks include compressing JS files, compiling Sass files, watching out for file changes, minifying files and auto-prefixing. Module bundlers take several modules of the application that each have dependencies and bundle them into static assets. Module bundlers perform the task of task runners, and take several steps further.
The more complex a tool is, the more difficult it is to use it. Being task runners, Gulp and Grunt offer features like code minification, CSS preprocessing, unit testing and a list of others.
Compared to Grunt or Webpack, Gulp is a lot easier to use. It is possible to start up a project using Gulp in a few minutes. Grunt, however, has less configuration hassle than Webpack.
TypeScript provides a Optional parameters feature. By using Optional parameters features, we can declare some parameters in the function optional, so that client need not required to pass value to optional parameters. We need to add a question mark "?" at the end of parameter name to mark this parameter optional. Below is the syntax.
-
function functionName(par1: number, par2?: number) {
-
// Code goes here...
-
}
Optional parameters always come last in the parameter list of function. We can not put optional parameter first and then required parameters in the function.
A Decorator is a special kind of declaration that can be attached to a class declaration, method, accessor, property, or parameter.
Decorators use the form @expression, where expression must evaluate to a function that will be called at run-time with information about the decorated declaration.
The single purpose of a decorator in Angular is to attach metadata to a class.
There are four types of decorator:
- Class decorators-@component
- Property-@input
- Method-@hostlistner
- Parameter-@inject
Three components of typescript:
- Language
- The TypeScript Compiler
- The TypeScript Language Services
JavaScript Testing Best Practices
Browser Rendering Optimization