You're working on a project where you have to fetch data from an API and display it on a webpage without refreshing it. Which technology would be most suitable for this?
- WebSockets
- Fetch API
- REST API
- GraphQL
The Fetch API is commonly used for making asynchronous network requests, including fetching data from APIs and updating web pages without refreshing. While WebSockets are used for real-time communication, REST and GraphQL are architectural approaches, not technologies.
How do arrow functions affect the call stack and debugging in JavaScript?
- They have no impact on the call stack.
- They add an extra layer to the call stack.
- They make debugging more straightforward.
- They can cause stack overflow errors.
Arrow functions have no impact on the call stack, as they do not create their own execution context or call themselves recursively. This means they don't contribute to the call stack depth, making it easier to avoid stack overflow errors in certain cases. However, it's essential to understand how this behavior can affect debugging and performance when using arrow functions in JavaScript.
Which method returns the first element that matches a CSS selector(s)?
- querySelectorAll()
- selectElementByCSS()
- getElementBySelector()
- getElementsByClassName()
The querySelectorAll() method is used to return all elements in the document that match a specified CSS selector. However, if you want to retrieve only the first matching element, you can use the querySelector() method. The other options are not standard JavaScript methods for selecting elements by CSS selector.
How do you select the last child of an element using pure JavaScript?
- lastChild
- element.lastChild
- lastElementChild
- element.lastElementChild
To select the last child of an element using pure JavaScript, you should use the lastElementChild property of the element. This property returns the last element among the child elements of the specified parent element. The other options, lastChild, element.lastChild, and lastElementChild, do not provide the same functionality.
You are reading through a codebase and find that a block of code within an "else if" statement is not being executed, despite it seeming like the condition should be true. What are some steps you could take to troubleshoot this issue?
- Check condition logic
- Verify variable values
- Examine code dependencies
- Debug with console statements
Troubleshooting such issues involves checking the condition logic within the "else if" statement. Verify that the condition is correctly formulated and that the variables being compared have the expected values. Additionally, inspecting code dependencies and using console statements for debugging can help identify the problem.
You’re developing a web application and need to add a feature where a modal appears when a button is clicked, but users complain that the page scrolls up every time they click the button. What JavaScript method could you use to prevent this default behavior?
- event.stopPropagation()
- event.preventDefault()
- event.stopImmediatePropagation()
- event.cancelBubble()
To prevent the default behavior of a button click, you can use the event.preventDefault() method. This method stops the browser from executing the default action associated with the event, such as submitting a form or navigating to a new page, in this case, preventing the page from scrolling up. event.stopPropagation() is used to stop the event from bubbling up the DOM tree but won't prevent the default behavior.
During a project review, a colleague points out that a piece of code might have a performance impact due to creating a new scope each time it runs. Which type of function is being used: a regular function or an arrow function?
- Regular function
- Arrow function
- Both regular and arrow functions
- It depends on the JavaScript engine used
The piece of code that creates a new scope each time it runs is likely using an arrow function. Arrow functions capture the scope they are created in, which can lead to performance implications when they are used within loops or frequently called functions. Regular functions, on the other hand, do not capture the scope and may be more suitable for certain performance-critical scenarios.
Which looping statement is suitable when the number of iterations is not known beforehand?
- for loop
- while loop
- do...while loop
- forEach loop
A while loop is suitable when the number of iterations is not known beforehand. It allows you to repeat a block of code as long as a specified condition is true. This makes it a flexible choice for situations where the loop's exit condition isn't predetermined.
What is the index of the last element of an array with 5 elements?
- 3
- 4
- 5
- -1 (JavaScript doesn't support accessing the last element directly)
The index of the last element in an array with 5 elements is 4. JavaScript arrays are zero-indexed, so the index of the last element is one less than the total number of elements in the array. The other options are not correct for this scenario.
The fetch function in JavaScript returns a Promise that resolves to the ________ of the request, whether it is successful or not.
- a) Response Object
- b) JSON Data
- c) Status Code
- d) URL
The fetch function in JavaScript returns a Promise that resolves to the Response object of the request, whether it's successful or not. This Response object contains information about the response, including headers and the response body, and allows you to handle the response appropriately.