How can you use a for...in loop to access the properties of an object?
- By using the index values.
- By using the Object.keys() method.
- By using the Object.entries() method.
- By using the Object.getOwnPropertyNames() method.
A for...in loop is used to iterate over the enumerable properties of an object. To access the properties of an object, you can use the Object.keys() method, which returns an array of the object's own enumerable property names. This allows you to loop through the keys (property names) of the object and access their corresponding values. It's a safer and more controlled way to work with object properties than a simple for...in loop.
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.
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.
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.
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.
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.
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.
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.
The insertBefore method is used to insert an element before the _________ child of a specified parent.
- first
- last
- next
- previous
The insertBefore method is used to insert an element before the specified next child of a parent element. It allows you to precisely control the position of the new element within the parent's children.
In which scenario might you prefer to use Object.create(null) over {} to create an empty object?
- When you need an empty object with no prototype chain (no inherited properties or methods)
- When you need an empty object with default prototype properties
- When you need an object with prototype properties
- When you need an object with getter and setter methods
Object.create(null) is used when you want an empty object with no prototype chain. This is useful when you want to create a clean slate object without inheriting any properties or methods from the Object prototype.
What will be the output of console.log(typeof null); in JavaScript?
- "object"
- "null"
- "undefined"
- "number"
The expression console.log(typeof null); in JavaScript will output "object." This is a quirk in JavaScript because typeof null returns "object," even though null is not an object but a special value representing the absence of a value.
You are troubleshooting an issue where the Fetch API call to a third-party API is not returning any data, and you suspect it might be due to a CORS policy. How might you validate and debug this issue?
- Use a CORS proxy
- Check the browser console
- Modify the server's CORS policy
- Reboot the server
To validate and debug a CORS (Cross-Origin Resource Sharing) issue, you can check the browser console for error messages, which often provide information about the CORS policy violation. Modifying the server's CORS policy or using a CORS proxy can help resolve such issues. Rebooting the server is unlikely to fix CORS problems.