JS Flashcards
What is a closure?
A closure is an inner function that has access to the outer functions(parent function) variables that are defined in the outer functions scope.
What is event delegation?
Event delegation is adding event listeners to a parent element instead of to the descendant elements. The listener will fire whenever the event is triggered on the descendant elements due to event bubbling up the DOM
Explain the ‘this’ keyword
The this keyword is bound to different values based on the context in which it’s called.
With arrow functions, ‘this’ is lexically bound. It uses ‘this’ from the code that contains the arrow function.
If the new keyword is used when calling the function, ‘this’ inside the function is a brand new object.
If apply, call, or bind are used to call/create a function, ‘this’ inside the function is the object that is passed in as the argument.
If a function is called as a method, such as obj.method() — ’this’ is the object that the function is a property of.
If a function is invoked as a free function invocation, meaning it was invoked without any of the conditions present above, this is the global object. In a browser, it is the window object. If in strict mode (‘use strict’), this will be undefined instead of the global object.
If multiple of the above rules apply, the rule that is higher wins and will set the this value.
If the function is an ES2015 arrow function, it ignores all the rules above and receives the this value of its surrounding scope at the time it is created.
Explain how prototypal inheritance works
When a property is accessed on an object and not found, the JavaScript engine looks at the object’s prototype, and then the prototype’s prototype and so on, until it finds the property defined on one of the prototypes or until it reaches the end of the prototype chain.
What is specificity?
When the browser decides which CSS property value is most relevant and applies it.
For ex., CSS of an ID overrides CSS
of a class unless !important is used
What is Static positioning?
Default position, element remains in the natural flow of the page. Top, bottom, left, right, and z-index don’t apply.
