Feb 08, 2020 • ☕️☕️ 10 min read
Cracking the Frontend Interview is an original series on my preparation for frontend interview, this series acts like my notes and summary on what's really important to tackle the job.
This post will help you cover frequently asked topics by listing as a learning path with short introduction and optional links to further reading, reread before interviews to see the big picture and fill the gaps as you go.
AMD (Asynchronous Module Definition) is a module format that allows module and its dependencies can be asynchronously loaded. This is particularly well suited for the browser environment where synchronous loading of modules incurs performance, usability, debugging, and cross-domain access problems.
UMD (Universal Module Definition) is a universal module format which is ugly, but is both AMD and CommonJS compatible, as well as supporting the old-style
global variable definition.
A programming paradigm is a style, or “way,” of programming, they are not meant to be mutually exclusive. A single program can feature multiple paradigms. Very few languages implement a paradigm 100% — when they do, they are pure. It is incredibly rare to have a
pure OOP language or a
pure functional language.
Reflectobjects allowing you to intercept and define custom behavior for fundamental language operations (e.g. property lookup, assignment, enumeration, function invocation, etc).
Each paradigm has their own benefits and drawbacks, mix them nicely to build products which are performant, reusable and maintainable.
Iterators are an implementation of Iterable objects such as maps, arrays and strings which enables us to iterate over them using next(). They have a wide variety of use cases across Generators, Observables and Spread operators.
Generators are functions whose executions are not continuous, they can stop midway and then continue from where they stopped, written using the
function* syntax, appear to be functions but behave like iterators.
Async generators are special because you can use both
yield, different from async functions and generators in that they don’t return a promise or an iterator but rather an async iterator. You can think of an async iterator as an iterator whose next() function always returns a promise.
A promise is an object that may produce a single value some time in the future, either a resolved value, or a reason that it’s not resolved, may be in one of 3 possible states — fulfilled, rejected, or pending.
Async functions enable us to write promise based code as if it were synchronous, but without blocking the execution thread. It operates asynchronously via the event-loop. An async function can contain an await expression that pauses the execution of the async function and waits for the passed Promise’s resolution, and then resumes the async function’s execution and evaluates as the resolved value.
Scope is the accessibility of variables, functions, and objects in some particular part of your code during runtime.
Lexical scoping defines how variable names are resolved in nested functions: inner functions contain the scope of parent functions even if the parent function has returned.
Currying is a process in functional programming in which we can transform a function with multiple arguments into a sequence of nesting functions. It returns a new function that expects the next argument inline.
Regular expression is an object that describes a pattern of characters,
RegExp class represents regular expressions, and both String and RegExp define methods that use regular expressions to perform powerful pattern-matching and search-and-replace functions on text.
Mixin is a class containing methods that can be used by other classes without a need to inherit from it. A mixin provides methods that implement a certain behavior, but we do not use it alone, we use it to add the behavior to other classes.
Inexperienced technical interviewers are unpredictable and prefer to challenge you than wish you succeed. More experienced ones are wiser, they seem to know your levels already and believe that you can reach to where they are by learning the right things.
Failing to list all possible cases is fine, but having no clue of something is definitely a red flag
Reread this post multiple times to familiarize all keywords and concepts, keep digging deep on unfamiliar ones by searching Google or reading following excellent resources:
Grunt and Gulp are two popular tools to automate repetitive, mundane, painful and time-consuming tasks effectively
Pros and cons of using CSS frameworks like Bootstrap, Foundation, Materialize CSS, Semantic UI, Tailwind, Ant Design