30-seconds-of-interviews
A curated collection of common interview questions to help you prepare for your next interview.
Archived
12k stars
214 watching
963 forks
Language: JavaScript
last commit: about 2 years ago
Linked from 2 awesome lists
awesome-listcsseducationhtmlinterviewinterview-questionsjavascriptlearn-to-codelearning-resourcessnippetssnippets-collection
30 Seconds of Interviews / Contributing | |||
30 Seconds of Code | |||
30 Seconds of CSS | 16,116 | over 1 year ago | |
30 Seconds of React | 5,079 | over 1 year ago | |
30 Seconds of Knowledge | |||
30 Seconds of Interviews / JavaScript / What is a stateless component? | |||
React docs on State and Lifecycle | |||
30 Seconds of Interviews / JavaScript / What is the difference between the equality operators == and ===? | |||
MDN docs for comparison operators | |||
30 Seconds of Interviews / JavaScript / What is the difference between an element and a component in React? | |||
React docs on Rendering Elements | |||
React docs on Components and Props | |||
30 Seconds of Interviews / JavaScript / What is a stateful component in React? | |||
React docs on State and Lifecycle | |||
30 Seconds of Interviews / JavaScript / In which states can a Promise be? | |||
Official Web Docs Promise | |||
30 Seconds of Interviews / JavaScript / What does the following code evaluate to? | |||
MDN docs for typeof | |||
30 Seconds of Interviews / JavaScript / How do you clone an object in JavaScript? | |||
MDN docs for Object.assign() | |||
Clone an object in vanilla JS | |||
30 Seconds of Interviews / JavaScript / How do you compare two objects in JavaScript? | |||
Object Equality in JavaScript | |||
Deep comparison between two values | |||
30 Seconds of Interviews / JavaScript / What is a cross-site scripting attack (XSS) and how do you prevent it? | |||
Cross-Site Scripting Attack (XSS) | |||
30 Seconds of Interviews / JavaScript / What is CORS? | |||
MDN docs for CORS | |||
30 Seconds of Interviews / JavaScript / What is the DOM? | |||
MDN docs for DOM | |||
30 Seconds of Interviews / JavaScript / What are the differences between var, let, const and no keyword statements? | |||
let vs const | |||
30 Seconds of Interviews / JavaScript / What is event delegation and why is it useful? Can you show an example of how to use it? | |||
Event Delegation | |||
30 Seconds of Interviews / JavaScript / What is the purpose of callback function as an argument of setState? | |||
React docs on setState | |||
30 Seconds of Interviews / JavaScript / What is the difference between an expression and a statement in JavaScript? | |||
What is the difference between a statement and an expression? | |||
30 Seconds of Interviews / JavaScript / What are truthy and falsy values in JavaScript? | |||
Truthy on MDN | |||
Falsy on MDN | |||
30 Seconds of Interviews / JavaScript / Generate an array, containing the Fibonacci sequence, up until the nth term. | |||
Similar problem | 122,112 | 1 day ago | |
30 Seconds of Interviews / JavaScript / What does 0.1 + 0.2 === 0.3 evaluate to? | |||
A simple helper function to check equality | 122,112 | 1 day ago | |
Fix "0.1 + 0.2 = 0.300000004" in JavaScript | |||
30 Seconds of Interviews / JavaScript / What is the difference between the array methods map() and forEach()? | |||
MDN docs for forEach | |||
MDN docs for map | |||
JavaScript — Map vs. ForEach | |||
30 Seconds of Interviews / JavaScript / What is short-circuit evaluation in JavaScript? | |||
JavaScript: What is short-circuit evaluation? | |||
30 Seconds of Interviews / JavaScript / What will the console log in this example? | |||
MDN docs for hoisting | |||
30 Seconds of Interviews / JavaScript / How does hoisting work in JavaScript? | |||
MDN docs for hoisting | |||
Understanding Hoisting in JavaScript | |||
30 Seconds of Interviews / JavaScript / What is the difference between HTML and React event handling? | |||
React docs on Handling Events | |||
30 Seconds of Interviews / JavaScript / What is the reason for wrapping the entire contents of a JavaScript source file in a function that is immediately invoked? | |||
MDN docs for closures | |||
30 Seconds of Interviews / JavaScript / What does the following function return? | |||
Automatic semicolon insertion in JavaScript | |||
30 Seconds of Interviews / JavaScript / What are inline conditional expressions? | |||
React docs on Conditional Rendering | |||
30 Seconds of Interviews / JavaScript / What is a key? What are the benefits of using it in lists? | |||
React docs on Lists and Keys | |||
30 Seconds of Interviews / JavaScript / What is the difference between lexical scoping and dynamic scoping? | |||
Mozilla Docs Closures & Lexical Scoping | |||
30 Seconds of Interviews / JavaScript / What is the output of the following code? | |||
JavaScript Value vs Reference | |||
30 Seconds of Interviews / JavaScript / How does prototypal inheritance differ from classical inheritance? | |||
MDN docs for inheritance and the prototype chain | |||
30 Seconds of Interviews / JavaScript / What is a MIME type and what is it used for? | |||
MIME Type MDN | |||
30 Seconds of Interviews / JavaScript / What are Promises? | |||
Master the JavaScript Interview: What is a Promise? | |||
30 Seconds of Interviews / JavaScript / What are JavaScript data types? | |||
MDN docs for data types and data structures | |||
Understanding Data Types in JavaScript | |||
30 Seconds of Interviews / JavaScript / NodeJS often uses a callback pattern where if an error is encountered during execution, this error is passed as the first argument to the callback. What are the advantages of this pattern? | |||
The Node.js Way Understanding Error-First Callbacks | |||
What are the error conventions? | |||
30 Seconds of Interviews / JavaScript / What is a callback? Can you show an example using one? | |||
MDN docs for callbacks | |||
30 Seconds of Interviews / JavaScript / What is the difference between null and undefined? | |||
MDN docs for null | |||
MDN docs for undefined | |||
30 Seconds of Interviews / JavaScript / Does JavaScript pass by value or by reference? | |||
JavaScript Value vs Reference | |||
30 Seconds of Interviews / JavaScript / How do you pass an argument to an event handler or callback? | |||
React docs on Handling Events | |||
30 Seconds of Interviews / JavaScript / What are fragments? | |||
React docs on Fragments | |||
30 Seconds of Interviews / JavaScript / Create a function pipe that performs left-to-right function composition by returning a function that accepts one argument. | |||
What is function composition? | |||
30 Seconds of Interviews / JavaScript / What is the event loop in Node.js? | |||
Node.js docs on event loop, timers and process.nextTick() | |||
30 Seconds of Interviews / JavaScript / What is the only value not equal to itself in JavaScript? | |||
MDN docs for NaN | |||
30 Seconds of Interviews / JavaScript / Contrast mutable and immutable values, and mutating vs non-mutating methods. | |||
Mutating vs non-mutating array methods | |||
30 Seconds of Interviews / JavaScript / What is Big O Notation? | |||
Big O Notation in JavaScript | |||
30 Seconds of Interviews / JavaScript / What is a pure function? | |||
Pure functions in JavaScript | |||
30 Seconds of Interviews / JavaScript / What is recursion and when is it useful? | |||
In plain English, what is recursion? | |||
30 Seconds of Interviews / JavaScript / What is memoization? | |||
Implementing memoization in JavaScript | |||
30 Seconds of Interviews / JavaScript / What are refs in React? When should they be used? | |||
React docs on Refs and the DOM | |||
30 Seconds of Interviews / JavaScript / Explain the differences between imperative and declarative programming. | |||
Declarative vs Imperative Programming | |||
30 Seconds of Interviews / JavaScript / What is functional programming? | |||
Javascript and Functional Programming: An Introduction | |||
Master the JavaScript Interview: What is Functional Programming? | |||
30 Seconds of Interviews / JavaScript / What are portals in React? | |||
React docs on Portals | |||
30 Seconds of Interviews / JavaScript / What is event-driven programming? | |||
MDN docs on Events and Handlers | |||
Understanding Node.js event-driven architecture | |||
30 Seconds of Interviews / JavaScript / What is context? | |||
React docs on Context | |||
30 Seconds of Interviews / JavaScript / Explain the difference between a static method and an instance method. | |||
Classes on MDN | |||
30 Seconds of Interviews / JavaScript / What is a closure? Can you give a useful example of one? | |||
MDN docs for closures | |||
What is a closure | |||
I never understood JavaScript closures | |||
30 Seconds of Interviews / JavaScript / What is the this keyword and how does it work? | |||
this on MDN | |||
30 Seconds of Interviews / JavaScript / What is the children prop? | |||
React docs on Children | |||
30 Seconds of Interviews / JavaScript / Which is the preferred option between callback refs and findDOMNode()? | |||
React docs on Refs and the DOM | |||
30 Seconds of Interviews / JavaScript / What is the purpose of JavaScript UI libraries/frameworks like React, Vue, Angular, Hyperapp, etc? | |||
Virtual DOM in Hyperapp | 19,091 | 2 months ago | |
30 Seconds of Interviews / JavaScript / What does 'use strict' do and what are some of the key benefits to using it? | |||
MDN docs for strict mode | |||
30 Seconds of Interviews / JavaScript / How can you avoid callback hells? | |||
Avoiding Callback Hell in Node.js | |||
Asynchronous JavaScript: From Callback Hell to Async and Await | |||
30 Seconds of Interviews / JavaScript / What is a virtual DOM and why is it used in libraries/frameworks? | |||
The difference between Virtual DOM and DOM | |||
30 Seconds of Interviews / JavaScript / How do you ensure methods have the correct this context in React component classes? | |||
React docs on Handling Events | |||
React docs on Passing Functions to Components | |||
30 Seconds of Interviews / React / What is a stateless component? | |||
React docs on State and Lifecycle | |||
30 Seconds of Interviews / React / What is a stateful component in React? | |||
React docs on State and Lifecycle | |||
30 Seconds of Interviews / React / What is the difference between an element and a component in React? | |||
React docs on Rendering Elements | |||
React docs on Components and Props | |||
30 Seconds of Interviews / React / How do you pass an argument to an event handler or callback? | |||
React docs on Handling Events | |||
30 Seconds of Interviews / React / What is the purpose of callback function as an argument of setState? | |||
React docs on setState | |||
30 Seconds of Interviews / React / What is the difference between HTML and React event handling? | |||
React docs on Handling Events | |||
30 Seconds of Interviews / React / What are inline conditional expressions? | |||
React docs on Conditional Rendering | |||
30 Seconds of Interviews / React / What is a key? What are the benefits of using it in lists? | |||
React docs on Lists and Keys | |||
30 Seconds of Interviews / React / Which is the preferred option between callback refs and findDOMNode()? | |||
React docs on Refs and the DOM | |||
30 Seconds of Interviews / React / What are fragments? | |||
React docs on Fragments | |||
30 Seconds of Interviews / React / How do you ensure methods have the correct this context in React component classes? | |||
React docs on Handling Events | |||
React docs on Passing Functions to Components | |||
30 Seconds of Interviews / React / What are error boundaries in React? | |||
https://reactjs.org/docs/error-boundaries.html | |||
30 Seconds of Interviews / React / What is context? | |||
React docs on Context | |||
30 Seconds of Interviews / React / What are refs in React? When should they be used? | |||
React docs on Refs and the DOM | |||
30 Seconds of Interviews / React / What is the children prop? | |||
React docs on Children | |||
30 Seconds of Interviews / React / What are portals in React? | |||
React docs on Portals | |||
30 Seconds of Interviews / HTML / What is the purpose of the alt attribute on images? | |||
A good basis for accessibility | |||
30 Seconds of Interviews / HTML / What is the purpose of cache busting and how can you achieve it? | |||
Strategies for cache-busting CSS | |||
30 Seconds of Interviews / HTML / Can a web page contain multiple <header> elements? What about <footer> elements? | |||
StackOverflow Using header or footer tag twice | |||
30 Seconds of Interviews / HTML / Briefly describe the correct usage of the following HTML5 semantic elements: <header>, <article>,<section>, <footer> | |||
HTML 5 Semantic Elements | |||
30 Seconds of Interviews / HTML / Where and why is the rel="noopener" attribute used? | |||
Open external anchors using rel="noopener" | |||
About rel="noopener" | |||
30 Seconds of Interviews / HTML / What are defer and async attributes on a <script> tag? | |||
async vs defer attributes | |||
30 Seconds of Interviews / HTML / What is the difference between HTML and React event handling? | |||
React docs on Handling Events | |||
30 Seconds of Interviews / HTML / What are some differences that XHTML has compared to HTML? | |||
W3Schools docs for HTML and XHTML | |||
30 Seconds of Interviews / HTML / What is the DOM? | |||
MDN docs for DOM | |||
30 Seconds of Interviews / HTML / Discuss the differences between an HTML specification and a browser’s implementation thereof. | |||
HTML 5.2 WWW Specifications | |||
30 Seconds of Interviews / HTML / What is HTML5 Web Storage? Explain localStorage and sessionStorage. | |||
W3Schools HTML5 Webstorage | |||
30 Seconds of Interviews / CSS / What is CSS BEM? | |||
Writing clean and maintainable CSS | |||
30 Seconds of Interviews / CSS / What are the advantages of using CSS preprocessors? | |||
CSS Preprocessors | |||
30 Seconds of Interviews / CSS / Using flexbox, create a 3-column layout where each column takes up a col-{n} / 12 ratio of the container. | |||
MDN docs for basic concepts of flexbox | |||
A complete guide to Flexbox | |||
30 Seconds of Interviews / CSS / Can you name the four types of @media properties? | |||
MDN docs for @media rule | |||
MDN docs for using media queries | |||
30 Seconds of Interviews / CSS / Describe the layout of the CSS Box Model and briefly describe each component. | |||
W3School's CSS Box Model Page | |||
Mozilla's Intro to the CSS Box Model | |||
30 Seconds of Interviews / CSS / What is the difference between em and rem units? | |||
CSS units for font-size: px | em | rem | |||
30 Seconds of Interviews / CSS / What are the advantages of using CSS sprites and how are they utilized? | |||
CSS Sprites explained by CSS Tricks | |||
30 Seconds of Interviews / CSS / What is the difference between '+' and '~' sibling selectors?. | |||
W3School's CSS Combinators Page | |||
Mozilla's Combinators and groups of selectors page | |||
30 Seconds of Interviews / CSS / Can you describe how CSS specificity works? | |||
CSS Specificity | |||
30 Seconds of Interviews / CSS / What is a focus ring? What is the correct solution to handle them? | |||
:focus-visible | |||
30 Seconds of Interviews / Accessibility / What is WCAG? What are the differences between A, AA, and AAA compliance? | |||
Web Content Accessibility Guidelines (WCAG) Overview | |||
How to Meet WCAG | |||
30 Seconds of Interviews / Accessibility / What is ARIA and when should you use it? | |||
WAI-ARIA Overview | |||
WAI-ARIA Spec | |||
ARIA Serious? Eric Eggert presentation | |||
30 Seconds of Interviews / Accessibility / What is the Accessibility Tree? | |||
Accessibility APIs | |||
30 Seconds of Interviews / Accessibility / What are landmark roles and how can they be useful? | |||
ARIA Landmark Roles | |||
Using ARIA landmarks to identify regions of a page | |||
30 Seconds of Interviews / Node / NodeJS often uses a callback pattern where if an error is encountered during execution, this error is passed as the first argument to the callback. What are the advantages of this pattern? | |||
The Node.js Way Understanding Error-First Callbacks | |||
What are the error conventions? | |||
30 Seconds of Interviews / Node / What is REST? | |||
https://medium.com/extend/what-is-rest-a-simple-explanation-for-beginners-part-1-introduction-b4a072f8740f | ]( ) | ||
30 Seconds of Interviews / Node / How can you avoid callback hells? | |||
Avoiding Callback Hell in Node.js | |||
Asynchronous JavaScript: From Callback Hell to Async and Await | |||
30 Seconds of Interviews / Node / What is the event loop in Node.js? | |||
Node.js docs on event loop, timers and process.nextTick() | |||
30 Seconds of Interviews / Security / What is a cross-site scripting attack (XSS) and how do you prevent it? | |||
Cross-Site Scripting Attack (XSS) |