JS Flashcards
What is event delegation?
Event delegation is an event handling pattern that allows events to be handled at higher levels of the DOM tree other than where the event was first received.
How does event delegation work?
Event delegation works because of event bubbling, which allows events to propagate up through the DOM tree to the root. Because of this, events can be handled on any ancestor element of the element where the event was received.
Explain why the following doesn’t work as an IIFE: function foo(){ }();. What needs to be changed to properly make it an IIFE?
An IIFE is an anonymous function, thus cannot be named. To make the function an IIFE the name ‘foo’ must be dropped to make it anonymous and the function must be enclosed within a grouping operator. (function () {})()
What is an IIFE in JS?
An IIFE is an immediately invoked function expression meaning that it is a function that is runs as soon as it is defined.
What’s the difference between a variable that is: null, undefined or undeclared? How would you go about checking for any of these states?
A variable that is undeclared has not been created yet. A variable that is undefined has been declared, but does not have a value. A variable that is null has been declared and has a value of nothing.
To check is a variable is undeclared, one could console.log the variable. If it does not exist a ReferenceError will be thrown.
To check for undefined or null, one could compare the variable with the primative values of undefined or null using the ‘===’.
What is a closure? How/Why would you use one?
A closure is the combination of a function bundled together with references to its surrounding state. A closure gives access to an outer function’s scope from an inner function.
Closures are useful because they associate data with a function that operates on that data. You can use closures anywhere that might normally use an object with only a single method.
Describe the main difference between a .forEach() loop and a .map() loop. Why you would pick one versus the other?
The main difference is that a forEach loop mutates the calling array while a map loop utilizes return values and returns a new Array of the same size.
What’s a typical use case for anonymous functions?
A typical use case for an anonymous function would be an IIFE, where a function is created and then immediately run.
How do you organize your code? (module pattern, classical inheritance?)
no answer yet
What’s the difference between host objects and native objects?
Native objects are standard javascript objects provided by javascript itself. They are also know as built-in objects, pre-defined objects, or global objects. (ex: String(), Number(), true).
Host objects are environment-specific javascript objects, and may vary as per the environment of the machine in which the javascript is being used. Host objects are host specific and may differ from one host to another. (ex: window, NodeList, console).
Difference between: function Person(){}, var person = Person(), and var person = new Person()?
no answer yet
What’s the difference between .call and .apply?
The difference is that call() takes arguments separately and apply() takes arguments as an array.
Explain Function.prototype.bind().
The bind() method creates a new function that, when called, calls this function with its ‘this’ keyword set to the provided value, and a given sequence of arguments preceding any provided when the new function is called.
When would you use document.write()?
Conventional wisdom would deem using document.write() as bad practice as using it after a page load would replace all the content of the page with whatever is placed as a parameter. A possible ‘approved’ time would be for third party code to add their scripts to a page.
What’s the difference between feature detection, feature inference, and using the UA string?
Feature detection tries to verify if a feature exists, such as geolocation.
Feature inference infers if A exists that it can be assumed that B exists. Geolocation exists so the user must be using a modern browser.
UA string helps identify which browser is used by the user.
What is AJAX?
AJAX stands for Asynchronous Javascript and XML and it allows web pages to be updated asynchronously by exchanging data with a web server behind the scenes. This makes it possible to update parts of a web page without reloading the whole page.
What are the advantages and disadvantages of using AJAX?
The advantages of using AJAX:
1. Can use asynchronous calls to reload parts of a web page without having to reload the whole page.
2. Can reduce server traffic and increase speed by allowing applications to render without data.
3. XMLHttpRequest transfers and manipulates the XML data to and from a web service using HTTP. Its purpos is to establish an independent connection between the webpage’s client-side and server.
4. Can reduce bandwidth usage by fetching particle contents instead of transmitting the entire page’s content; meaning you can bring data from the db and store it into the db to perform background without reloading the page.
5. AJAX method enables precise and immediate form validation.
The disadvantages of using AJAX:
1. Open-source making it less secure than other technologies.
2. Search engines cannot index AJAX pages.
3. AJAX can cause difficulties for web pages to debug as well as make them prone to security issues in the future.
4. AJAX has a dependency on JS, so only browsers that support JS or XMLHttpRequest can use AJAX techniques.
5. Bookmarking a specific state can be challenging due to the dynamic web page.
6. If clicking the browser back button, the page may not return to the previous state because successive AJAX requests are unable to register with the browser’s history.
What is hoisting?
not answered yet
Describe event bubbling.
Event bubbling happens when an element receives an event, and that event propagates to its parent and ancestor elements in the DOM tree until it gets to the root element. This is default behavior and can be prevented by using the ‘stopPropagation’ method of the event object.
What’s the difference between an “attribute” and a “property”?
Attributes:
1. Defined by the HTML and are used to customize a tag.
2. Value is constant.
3. Used to initialize the DOM properties.
Properties:
1. Defined by the DOM
2. Value is variable
3. No job is defined
Why is extending built-in JS objects not a good idea?
How do you extend built-in objects in JS?
What is the difference between the document load event and document DOMContentLoaded event?
What is the difference between == and ===?
Explain the same-origin policy with regards to JS.
Make this work: duplicate([1,2,3,4,5]); result: [1,2,3,4,5,1,2,3,4,5]
Why is it called a ternary expression? What does the word ternary indicate?
What is ‘use strict’? What are the advantages and disadvantages to using it?