所有练习题

前端面试的 500+ 题库,题目数量最多。
由前面试官解答
测试用例
在浏览器中编码
省去在网络上搜索前端面试题的麻烦。我们有 500+ 道练习题,涵盖各种框架、格式和主题,每道题都配有来自大厂高级/资深工程师的高质量答案和测试。

题目列表

  • Counter热身问题Build a simple counter that increments whenever a button is clicked
    可用的框架
  • 制作计数器实现一个接受整数值的函数,并返回一个可以重复调用的函数,以返回递增的值
    语言
  • 均值实现一个可以找到数组内数值均值的函数
    语言
  • Function.prototype.call实现 Function.prototype.call() 函数,该函数使用给定的 `this` 值和提供的参数调用该函数
    语言
  • Min By实现一个基于指定条件的查找最小元素的函数
    语言
  • Selection SortImplement a function that performs a selection sort
    语言
  • StackImplement a stack data structure containing the common stack methods
    语言
  • useBoolean实现一个管理布尔状态的 Hook,并提供额外的便捷实用方法
    语言
  • useCounter实现一个管理计数器状态的 Hook,并提供一些额外的便捷实用方法
    语言
  • 类型实用程序实现实用程序以确定 JavaScript 中的基本变量类型
    语言
  • AccordionBuild an accordion component that a displays a list of vertically stacked sections with each containing a title and content snippet
    可用的框架
  • Array.prototype.reduce实现 Array.prototype.reduce() 方法
    语言
  • Contact FormBuild a contact form which submits user feedback and contact details to a back end API
    可用的框架
  • Count Set Bits in a Binary NumberImplement a function to find set bits in binary representation of a given integer
    语言
  • Find Duplicates in ArrayImplement a function to check if there are any duplicate numbers in the array
    语言
  • Find Missing Number in SequenceImplement a function to find the missing element in a sorted array
    语言
  • Holy GrailBuild the famous holy grail layout consisting of a header, 3 columns, and a footer
    可用的框架
  • Insertion SortImplement a function that performs an insertion sort
    语言
  • Optimal Stock TradingImplement a function to find the maximum profit achievable by buying and selling a stock once
    语言
  • Pair sumImplement a function to find two numbers within an array of integers that add up to a target integer
    语言
  • Progress BarsBuild a list of progress bars that fill up gradually when they are added to the page
    可用的框架
  • String AnagramImplement a function to determine if two strings are anagram of each other
    语言
  • useClickAnywhere实现一个处理文档任何位置的点击事件的 Hook
    语言
  • useCounter II实现 useCounter hook 的优化版本
    语言
  • useCycle实现一个循环遍历一系列值的 hook
    语言
  • 循环实现一个函数,该函数接受一个或多个值,并返回一个函数,该函数在每次调用时循环遍历这些值
    语言
  • 类型工具 II实现实用程序以确定 JavaScript 中非原始变量类型
    语言
  • Binary Tree Maximum DepthImplement a function to find the maximum depth of a binary tree
    语言
  • Flip Binary TreeImplement a function to flip the nodes in a binary tree
    语言
  • Mortgage CalculatorBuild a calculator that computes the monthly mortgage for a loan
    可用的框架
  • Staircase Climbing CombinationsImplement a function to find the number of ways to reach at the top of staircase
    语言
  • Balanced BracketsImplement a function to determine if a string contains balanced brackets
    语言
  • Binary Tree EqualImplement a function to determine whether two binary trees are equal
    语言
  • Bit CountingImplement a function to find number of set bits from 0 to n
    语言
  • Bit ReversalImplement a function to flip the order of the bits in a given number
    语言
  • Linked List ReversalImplement a function to reverse a linked list
    语言
  • String PalindromeImplement a function to determine if a string is a palindrome
    语言
  • Linked List Detect CycleImplement a function to detect if there are cycles in a linked list
    语言
  • Binary Tree SubtreeImplement a function to check if a binary tree is a subtree of another binary tree
    语言
  • Linked Lists Combine Two SortedImplement a function to combine two sorted linked list
    语言
  • Meeting CalendarImplement a function to check if all meetings can be attended
    语言
  • Array Product Excluding CurrentImplement a function to find the product of elements in an array excluding the current element
    语言
  • Binary SearchImplement a function that performs binary search on an array of numbers
    语言
  • Breadth-first SearchImplement a breadth-first search algorithm that traverses a directed graph in a breadth-first manner
    语言
  • Depth-first SearchImplement a depth-first search algorithm that traverses a directed graph in a depth-first manner
    语言
  • Heap SortImplement a function that performs a heap sort
    语言
  • Is the Graph a TreeImplement a function to determine if a graph is a valid tree
    语言
  • Maximum Water Trapped Between WallsImplement a function to find the maximum water volume between two walls in an array of walls
    语言
  • Promisify实现一个函数,该函数接受一个遵循常见错误优先回调风格的函数,并返回一个返回 Promise 的版本
    语言
  • QueueImplement a queue data structure containing the common queue methods
    语言
  • TabsBuild a tabs component that displays a list of tab elements and one associated panel of content at a time
    可用的框架
  • useArray实现一个管理项目数组的 Hook
    语言
  • useDebounce实现一个对值进行防抖的 Hook
    语言
  • useSet实现一个管理 JavaScript Set 的 Hook
    语言
  • useTimeout实现一个在指定延迟后调用回调函数的 Hook
    语言
  • useWindowSize实现一个返回窗口当前高度和宽度的 Hook
    语言
  • 按…计数实现一个函数,该函数根据函数或属性名称计算值在数组中出现的次数。
    语言
  • 柯里化实现一个函数,该函数将接受多个参数的函数转换为一个可以重复调用,每次只接受一个参数的函数。
    语言
  • 节流实现一个函数,通过限制其在一段时间内可以执行的次数来控制函数的执行。
    语言
  • 防抖实现一个函数,通过延迟函数执行,直到其最后一次执行尝试后经过指定时间,来限制函数可以执行的次数。
    语言
  • Classnames实现一个有条件地将 CSS 类名连接在一起的函数
    语言
  • Data TableBuild a users data table with pagination features
    可用的框架
  • Dice RollerBuild a dice roller app that simulates the results of rolling 6-sided dice
    可用的框架
  • File ExplorerBuild a file explorer component to navigate files and directories in a tree-like hierarchical viewer
    可用的框架
  • getElementsByStyle实现一个函数,以获取使用指定样式呈现的所有 DOM 元素
    语言
  • HTML 序列化器实现一个将对象序列化为带有缩进的 HTML 字符串的函数
    语言
  • JSON.stringify实现一个将 JavaScript 值转换为 JSON 字符串的函数
    语言
  • Like ButtonBuild a Like button that changes appearance based on the states
    可用的框架
  • Memoize实现一个函数,该函数返回一个函数的记忆化版本,该函数接受单个参数
    语言
  • Merge SortImplement a function that performs a recursive merge sort
    语言
  • Modal DialogBuild a reusable modal dialog component that can be opened and closed
    可用的框架
  • Promise.all实现 Promise.all() 函数,如果所有输入元素都已解决,则解析为结果数组,否则拒绝。
    语言
  • Promise.any实现 Promise.any() 函数,当任何一个输入元素被解决时,它就会被解决
    语言
  • Quick SortImplement a function that performs a recursive quick sort
    语言
  • Squash Object实现一个函数,在将输入对象压扁成单层深度后,返回一个新对象
    语言
  • Star RatingBuild a star rating component that shows a row of star icons for users to select the number of filled stars corresponding to the rating
    可用的框架
  • Todo ListBuild a Todo list that lets users add new tasks and delete existing tasks
    可用的框架
  • Topological SortImplement a function that performs a topological sort
    语言
  • Traffic LightBuild a traffic light where the lights switch from green to yellow to red after predetermined intervals and loop indefinitely
    可用的框架
  • useInputControl实现一个管理受控输入值并跟踪其脏和已触及状态的 hook
    语言
  • useMediaQuery实现一个订阅并响应媒体查询变化的 Hook(例如屏幕大小、分辨率、方向等)
    语言
  • useMediatedState实现一个类似于 useState 的 hook,但支持一个中介过程
    语言
  • useQuery实现一个管理 promise 结果的 hook
    语言
  • 中间件实现一个类似于 Koa.js 中间件函数的异步中间件函数组合。
    语言
  • 事件发射器实现一个可以订阅和发出事件的类,这些事件会触发附加的回调函数
    语言
  • 列表格式实现一个函数,将项目列表格式化为单个可读字符串
    语言
  • 扁平化实现一个函数,该函数将数组递归地扁平化为单层深度。
    语言
  • 数据合并实现一个函数,用于合并来自同一用户的数据行
    语言
  • Binary Tree Level Order TraversalImplement a function to find the level order traversal of a binary tree
    语言
  • Digital ClockBuild a 7-segment digital clock that shows the current time
    可用的框架
  • getElementsByClassName实现一个函数,获取包含指定类的所有 DOM 元素
    语言
  • Map Async Limit实现一个函数,该函数使用异步映射函数映射一个项目数组,同时不超过并发限制
    语言
  • Maximum Sum in Contiguous ArrayImplement a function to find the subarray with the maximum sum
    语言
  • Smallest element in rotated sorted arrayImplement a function to find the smallest element in rotated sorted array
    语言
  • Tic-tac-toeBuild a tic-tac-toe game that is playable by two players
    可用的框架
  • 深度相等实现一个确定两个值是否相等的函数
    语言
  • 深拷贝实现一个对值进行深拷贝的函数
    语言
  • Find Element in Rotated ArrayImplement a function to find an integer in a rotated sorted array
    语言
  • Image CarouselBuild an image carousel that displays a sequence of images
    可用的框架
  • Job BoardBuild a job board that displays the latest job postings from Hacker News
    可用的框架
  • Maximum Product in Contiguous ArrayImplement a function to find the subarray which has the largest product
    语言
  • StopwatchBuild a stopwatch widget that can measure how much time has passed
    可用的框架
  • Transfer ListBuild a component that allows transferring of items between two lists
    可用的框架
  • 深度 Omit实现一个函数,该函数从对象中删除指定的键及其对应的值,包括嵌套对象或数组。
    语言
  • Binary Search Tree Kth Smallest ElementImplement a function to find the kth smallest node in a BST
    语言
  • Binary Search Tree Lowest Common AncestorImplement a function to find the LCA in a binary search tree
    语言
  • Count Islands in a GridImplement a function to count distinct islands in a 2D binary grid
    语言
  • Delete Nth Node from End of Linked ListImplement a function to delete the nth node from the end of a linked list
    语言
  • Distinct Paths in GridImplement a function to calculate distinct paths for a robot moving on an m x n grid
    语言
  • Matrix ZeroingImplement a function to set matrix rows and columns to zero
    语言
  • Merge Overlapping IntervalsImplement a function to merge overlapping intervals
    语言
  • Most Common ElementsImplement a function to determine the most common elements in an integer array
    语言
  • Neighborhood TheftImplement a function to find maximum money to rob without alerting police
    语言
  • Rearrange Linked ListImplement a function to rearrange the nodes in a linked list
    语言
  • Sum Without AdditionImplement a function to find the sum of two integers without using + and - operator
    语言
  • Triplet SumImplement a function to find all unique triplets with distinct indices that sum to 0
    语言
  • Validate Binary Search TreeImplement a function to validate whether a binary tree is a valid binary search tree
    语言
  • Combinations for Target SumImplement a function to count combinations that sum to the target
    语言
  • Course DependencyImplement a function to check if all courses can be completed given prerequisites
    语言
  • Decode MessageImplement a function to count ways to decode a numeric string
    语言
  • Longest Consecutive Number SequenceImplement a function to find the length of the longest consecutive number sequence
    语言
  • Longest Increasing SubsequenceImplement a function to find the length of the longest increasing subsequence
    语言
  • Minimum Coins for ChangeImplement a function to return minimum coins needed to make the given amount
    语言
  • Palindromic SubstringsImplement a function to count all palindromic substrings in a string
    语言
  • Segment WordsImplement a function to check whether a string be formed from dictionary words
    语言
  • String Anagram GroupsImplement a function to group an array of strings into anagrams
    语言
  • Task CoordinationImplement a function to find minimum intervals for tasks with cooldown
    语言
  • Trie (Prefix Tree)Implement a trie-prefix-tree with insert, search, and starts with functionality
    语言
  • Binary Tree Rebuilding from Preorder and Inorder TraversalsImplement a function to construct a binary tree from preorder and inorder traversals
    语言
  • Disjoint IntervalsImplement a function to determine the minimum amount of removals to get non-overlapping intervals
    语言
  • End of Array ReachableImplement a function to determine if the end of the array is reachable
    语言
  • Find the Longest Palindromic SubstringImplement a function to find the longest palindromic substring
    语言
  • Find Word in GridImplement a function to check the existence of a word in a grid
    语言
  • Graph Count Connected ComponentsImplement a function to count connected components in a graph
    语言
  • Longest Common SubsequenceImplement a function to find the longest common subsequence in two strings
    语言
  • Longest Non-repeating SubstringImplement a function to find the length of longest substring with unique characters
    语言
  • Longest Repeating Substring After ReplacementsImplement a function to find the longest uniform substring after up to k replacements
    语言
  • Matrix RotationImplement a function to rotate the given matrix by 90 degrees
    语言
  • Matrix Spiral TraversalImplement a function to traverse the matrix in spiral order
    语言
  • Merge New IntervalImplement a function to insert a new interval in the given intervals
    语言
  • Neighborhood Theft (Circular)Implement a function to find maximum money to rob in circular houses without alerting police
    语言
  • Ocean FlowImplement a function returning cells with water flow to both oceans
    语言
  • Word FinderImplement a data structure where words can be added and support wildcard searching
    语言
  • Graph CloneImplement a function to deeply clone a connected and undirected graph
    语言
  • Minimum Meeting Rooms NeededImplement a function to find the minimum number of required conference rooms
    语言
  • Binary Tree Serialization and DeserializationImplement a function to serialize and deserialize a binary tree
    语言
  • Binary Tree Maximum Total PathImplement a function to find the maximum total of nodes in a binary tree path
    语言
  • Find Words in GridImplement a function to find all the words present in the grid
    语言
  • Nested CheckboxesBuild a nested checkboxes component with parent-child selection logic
    可用的框架
  • Linked Lists Combine K SortedImplement a function to combine k sorted linked lists
    语言
  • Shortest Substring Containing CharactersImplement a function to return the smallest substring of a string containing all characters from another string
    语言
  • Extraterrestrial LanguageImplement a function to verify and return an extraterrestrial language's alphabet order
    语言
  • Number Stream MedianImplement a function to find the median of a dynamic stream of integers
    语言
  • Clamp高级实现一个函数,将一个数字限制在包含下限和上限的范围内
    语言
  • Sleep高级实现一个在恢复执行之前暂停指定时长的函数
    语言
  • 函数长度高级实现一个函数,该函数返回函数期望的参数数量
    语言
  • 参数个数高级实现一个函数,该函数返回它被调用时所带的参数个数
    语言
  • Array.prototype.square高级实现一个自定义的 Array.prototype.square() 方法,该方法将数组中的值平方。
    语言
  • Compact高级实现一个函数,该函数创建一个数组,其中移除了所有假值
    语言
  • Drop Right While高级实现一个函数,该函数从数组末尾排除元素,直到谓词返回 false
    语言
  • Drop While高级实现一个函数,该函数从数组的开头排除元素,直到谓词返回 false
    语言
  • Function.prototype.apply高级实现 Function.prototype.apply() 函数,该函数使用给定的 `this` 值和作为数组的参数调用该函数
    语言
  • Once高级实现一个接受回调函数并将其调用限制为最多一次的函数
    语言
  • Promise.reject高级实现一个函数,返回一个被拒绝的 Promise 对象,并附带一个原因
    语言
  • Range Right高级实现一个按降序返回数字序列的函数
    语言
  • 交集高级实现一个计算数组交集的函数,返回一个新数组,其中包含所有给定数组中存在的唯一值。
    语言
  • 从键值对高级实现一个从键值对创建对象的函数
    语言
  • 最大值依据高级实现一个基于指定条件查找最大元素的函数
    语言
  • 分块高级实现一个函数,该函数将元素数组拆分成指定大小的较小组。
    语言
  • 单例模式高级实现一个单例类,确保一个类只有一个实例,同时提供对该实例的全局访问点
    语言
  • 可取消的超时高级实现一个类似于 setTimeout 的函数,但返回一个用于取消待处理回调的函数
    语言
  • 可取消的间隔高级实现一个类似于 setInterval 的函数,但返回一个用于取消间隔的函数
    语言
  • 唯一数组高级实现一个函数,从数组中删除所有重复的值
    语言
  • 在范围内高级实现一个函数来检查一个数字是否在两个数字之间
    语言
  • 填充高级实现一个用指定值填充数组指定索引范围的函数
    语言
  • 对象映射高级实现一个函数来转换对象中的值
    语言
  • 差异高级实现一个函数,该函数查找数组之间值的差异。
    语言
  • 查找最后一个索引高级实现一个函数,该函数返回数组中满足提供的测试函数的最后一个元素的索引
    语言
  • 查找索引高级实现一个函数,该函数返回数组中满足提供的测试函数的第一个元素的索引
    语言
  • 范围高级实现一个函数,该函数以升序返回一系列数字
    语言
  • 获取高级实现一个函数,用于安全地访问 JavaScript 对象中深层嵌套的属性
    语言
  • Array.prototype.at高级实现 Array.prototype.at() 方法
    语言
  • Array.prototype.filter高级实现 Array.prototype.filter() 方法
    语言
  • Array.prototype.map高级实现 Array.prototype.map() 方法
    语言
  • Compose高级实现一个函数,该函数将多个函数作为参数,并返回一个新函数,该函数以相反的顺序应用这些函数
    语言
  • Flight Booker高级Build a component that books a flight for specified dates
    可用的框架
  • Function.prototype.bind高级实现 Function.prototype.bind() 函数,该函数创建一个新函数,并将 `this` 关键字设置为提供的值
    语言
  • Generate Table高级Generate a table of numbers given the rows and columns
    可用的框架
  • jQuery.css高级实现一个类似 jQuery 的函数,用于设置 DOM 元素的样式
    语言
  • Progress Bar高级Build a progress bar component that shows the percentage completion of an operation
    可用的框架
  • Promise.race高级实现 Promise.race() 函数,当任何一个输入元素被解决或拒绝时,它就会被解决或拒绝。
    语言
  • Temperature Converter高级Build a temperature converter widget that converts temperature values between Celsius and Fahrenheit
    可用的框架
  • useBoolean II高级实现 useBoolean hook 的优化版本
    语言
  • useDefault高级实现一个在状态为 null 或 undefined 时返回默认值的 hook
    语言
  • useEffectOnce高级实现一个只运行一次 effect 的 hook
    语言
  • useFocus高级实现一个可以对元素进行程序化聚焦的 Hook
    语言
  • usePrevious高级实现一个返回状态前一个值的 Hook
    语言
  • useStateWithReset高级实现一个类似于 useState 的 hook,但它有一个额外的 reset 函数,可以将状态重置为其初始值
    语言
  • useToggle高级实现一个管理布尔切换状态的 Hook
    语言
  • 大小高级实现一个返回集合大小的函数
    语言
  • 求和高级实现一个函数,该函数通过接受一个数字进行求和,并允许重复调用,传入更多数字,直到不传入任何数字为止。
    语言
  • Tweet高级Build a component that resembles a Tweet from Twitter
    可用的框架
  • 创建计数器 II高级实现一个函数,该函数返回一个计数器对象,该对象具有用于检索和操作值的各种方法
    语言
  • Array.prototype.concat高级实现 Array.prototype.concat() 方法
    语言
  • Intersection By高级实现一个函数,该函数根据提供的迭代函数返回一个包含所有给定数组中包含的唯一值的数组。
    语言
  • Promise 合并高级实现一个函数,将两个 Promise 的结果合并成一个单一的值
    语言
  • Promise 超时高级实现一个函数,如果 promise 在超时期限内被 fulfilled,则解析该 promise,否则拒绝。
    语言
  • Promise.resolve高级实现一个函数,将给定值解析为 Promise
    语言
  • Promise.withResolvers高级实现一个函数,该函数返回一个包含新的 `Promise` 对象和两个用于解决或拒绝它的函数的对象
    语言
  • Promisify II高级实现一个 promisify 函数,允许原始函数覆盖返回值
    语言
  • Union By高级实现一个函数,该函数从所有给定数组中创建一个按顺序排列的唯一值数组。
    语言
  • useBreakpoint高级实现一个基于当前窗口宽度返回当前断点名称的 Hook
    语言
  • useClickOutside高级实现一个检测指定元素外部点击的 Hook
    语言
  • useCountdown高级实现一个管理倒计时的 Hook
    语言
  • useEventListener高级实现一个订阅浏览器事件的 Hook
    语言
  • useHover高级实现一个跟踪元素是否被悬停的 Hook
    语言
  • useInterval高级实现一个创建间隔的 hook,该间隔在指定的延迟后调用回调函数
    语言
  • useKeyPress高级实现一个订阅键盘事件的 Hook
    语言
  • useMap高级实现一个管理 JavaScript map 的 Hook
    语言
  • useObject高级实现一个管理对象值的 Hook
    语言
  • useStep高级实现一个管理多步骤流程的步骤计数器的 hook
    语言
  • useThrottle高级实现一个节流值的 Hook
    语言
  • 交集运算高级使用自定义比较器函数计算数组的交集,以确定元素之间的相等性
    语言
  • 分组高级实现一个函数,该函数根据函数或属性名称对数组中的值进行分组
    语言
  • 是否为空高级实现一个函数来检查一个值是否为空对象、集合、映射或集合
    语言
  • 海龟高级实现一个在二维平面上移动海龟的 Turtle 类
    语言
  • 限制高级实现一个接受回调函数并将其调用限制为最多 N 次的函数
    语言
  • Accordion II高级Build an accessible accordion component that has the right ARIA roles, states, and properties
    可用的框架
  • Accordion III高级Build a fully accessible accordion component that has keyboard support according to ARIA specifications
    可用的框架
  • Analog Clock高级Build an analog clock where the hands update and move like a real clock
    可用的框架
  • Compact II高级实现一个函数,该函数返回一个对象,其中删除了所有假值
    语言
  • Data Table II高级Build a users data table with sorting features
    可用的框架
  • Debounce II高级实现一个带有取消方法以取消延迟调用和立即调用它们的 flush 方法的 debounce 函数
    语言
  • File Explorer II高级Build a semi-accessible file explorer component that has the right ARIA roles, states, and properties
    可用的框架
  • File Explorer III高级Build a file explorer component using a flat DOM structure
    可用的框架
  • getElementsByTagName高级实现一个函数,获取所有匹配标签的 DOM 元素
    语言
  • Grid Lights高级Build a grid of lights where the lights deactivate in the reverse order they were activated
    可用的框架
  • jQuery 类操作高级实现一组类似 jQuery 的函数,用于操作 DOM 元素的类
    语言
  • Map Async高级实现一个函数,该函数使用异步映射函数映射一个项目数组
    语言
  • Modal Dialog II高级Build a semi-accessible modal dialog component that has the right ARIA roles, states, and properties
    可用的框架
  • Modal Dialog III高级Build a moderately-accessible modal dialog component that supports common ways to close the dialog
    可用的框架
  • Progress Bars II高级Build a list of progress bars that fill up gradually in sequence, one at a time
    可用的框架
  • Promise.allSettled高级实现 Promise.allSettled() 函数,当所有输入元素都已解决或已拒绝时,该函数将解析为一个结果数组。
    语言
  • Tabs II高级Build a semi-accessible tabs component that has the right ARIA roles, states, and properties
    可用的框架
  • Tabs III高级Build a fully accessible tabs component that has keyboard support according to ARIA specifications
    可用的框架
  • useIdle高级实现一个检测用户不活动状态的 Hook
    语言
  • 事件发射器 II高级实现一个可以订阅和发出事件的类,这些事件会触发附加的回调函数。返回订阅对象,并且可以取消订阅。
    语言
  • 可恢复的 Interval高级实现一个创建可恢复 interval 对象的函数
    语言
  • 文本搜索高级实现一个函数,如果搜索词出现在文本中,则突出显示该文本
    语言
  • 柯里化 II高级实现一个函数,将接受多个参数的函数转换为可以重复调用任意数量参数的函数
    语言
  • 相同的 DOM 树高级实现一个函数来确定两棵 DOM 树是否相同
    语言
  • 符合条件高级实现一个函数,用于检查对象是否符合源对象
    语言
  • 驼峰命名转换高级实现一个函数,将对象中的所有键转换为驼峰命名。
    语言
  • Progress Bars III高级Build a list of progress bars that fill up gradually concurrently, up to a limit of 3
    可用的框架
  • 文本搜索 II高级实现一个函数,如果搜索词出现在文本中,则突出显示文本
    语言
  • 深度映射高级实现一个递归转换值的函数
    语言
  • Birth Year Histogram高级Build a widget that fetches birth year data from an API and plot it on a histogram
    可用的框架
  • Connect Four高级Build a game for two players who take turns to drop colored discs from the top into a vertically suspended board/grid
    可用的框架
  • Image Carousel II高级Build an image carousel that smoothly transitions between images
    可用的框架
  • Memoize II高级实现一个函数,该函数返回一个函数的 memoized 版本,该函数接受任意数量的参数
    语言
  • Pixel Art高级Build a pixel art drawing tool where users can paint pixels with selected colors
    可用的框架
  • Signup Form高级Build a signup form that does validation on user details and submits to a back end API
    可用的框架
  • Undoable Counter高级Build a counter with a history of the values and ability to undo/redo actions
    可用的框架
  • Users Database高级Build a UI to filter, create, update, and delete users
    可用的框架
  • Whack-A-Mole高级Build a popular arcade game where players attempt to hit moles as they pop up from holes in a board
    可用的框架
  • 深度合并高级实现一个将两个对象合并在一起的函数
    语言
  • Memory Game高级Build a memory game where the player needs to match pairs of cards
    可用的框架
  • 柯里化 III高级实现一个函数,将接受可变参数的函数转换为可以重复调用任意数量参数的函数
    语言
  • Auth Code Input高级Build an auth code input component that allows users to enter a 6-digit authorization code
    可用的框架
  • Classnames II高级实现一个有条件地将 CSS 类名连接在一起的函数,并处理去重和函数值
    语言
  • Progress Bars IV高级Build a list of progress bars that fill up gradually concurrently, up to a limit of 3 and allows for pausing and resuming
    可用的框架
  • Backbone Model高级实现一个类似于 Backbone.Model 的类,该类允许存储属性/值并响应特定属性值的更改
    语言
  • Data Table III高级Build a generalized data table with pagination and sorting features
    可用的框架
  • getElementsByTagNameHierarchy高级实现一个函数,获取所有匹配标签层级的 DOM 元素
    语言
  • Modal Dialog IV高级Build a fully-accessible modal dialog component that supports all required keyboard interactions
    可用的框架
  • 数据选择高级实现一个函数来过滤与指定要求匹配的数据行
    语言
  • 目录高级实现一个从 HTML 文档构建目录的函数
    语言
  • Data Table IV高级Build a generalized data table with pagination, sorting and filtering features
    可用的框架
  • Image Carousel III高级Build an image carousel that smoothly transitions between images that has a minimal DOM footprint
    可用的框架
  • Selectable Cells高级Build an interface where users can drag to select multiple cells within a grid
    可用的框架
  • Tic-tac-toe II高级Build an N x N tic-tac-toe game that requires M consecutive marks to win
    可用的框架
  • Transfer List II高级Build a component that allows transferring of items between two lists, bulk selection/unselection of items, and adding of new items
    可用的框架
  • JSON.stringify II高级实现一个将 JavaScript 值转换为 JSON 字符串的函数
    语言
  • 深度克隆 II高级实现一个对值进行深拷贝的函数,但也要处理循环引用
    语言
  • Wordle高级Build Wordle, the word-guessing game that took the world by storm
    可用的框架

500+ Front End Interview Questions and Answers

Hone your skills with a variety of front end interview questions designed to cover every aspect of the interview process. Whether you need to practice coding in a particular framework, brush up on your algorithmic thinking, or prepare for behavioral questions, we have you covered.

Question formats

Explore different question formats commonly encountered in front end interviews:

  1. JavaScript Coding interview questions: Solve coding challenges that require you to implement JavaScript functions, often used for utility functions or polyfills.
  2. User Interface Coding interview questions: Practice implementing UI components and features.
  3. Front End System Design interview questions: Work on technical design questions that test your ability to create scalable and maintainable front end architectures, typically asked in mid to senior level interviews.
  4. Quiz interview questions: Answer short, knowledge-based questions with clear, non-subjective answers. Ideal for recruiter screens or companies that do not include coding rounds.
  5. Data Structures and Algorithms Coding interview questions: Tackle algorithmic coding questions similar to those found on platforms like LeetCode, aimed at testing your data structures and algorithmic knowledge.
  6. Behavioral interview questions: Prepare for non-technical interview questions that assess your communication, teamwork, and problem-solving abilities, key components of any professional role.

Frameworks and languages

Get targeted practice in the specific front end frameworks and languages you're working with:

Why practice for your front end interviews here?

1. Developed by experienced interviewers: All questions, solutions, test cases, and categories on our platform have been meticulously crafted by engineers who have conducted numerous interviews at leading tech companies. Their expertise ensures that the questions are current and relevant, with solutions and test cases designed to meet the expectations of today's interviewers.

2. Wide-ranging collection of practice questions: We offer an extensive selection of realistic and challenging questions across various categories, reflecting the latest trends and practices in front end development. These questions are thoughtfully organized to help you build expertise in the required areas, whether it's JavaScript, front end system design, or the latest UI frameworks.

3. Detailed and instructive solutions: Each question is accompanied by a comprehensive solution that clearly explains the correct approach, breaking down both the "how" and "why" behind each answer. These solutions are designed to deepen your understanding, ensuring you can apply the knowledge effectively in interviews and real-world scenarios.

4. State-of-the-art coding environment: Our in-browser coding workspace is designed to closely replicate the conditions of actual front end coding interviews. This environment helps you become familiar with the tools you'll use during interviews. Additionally, we offer convenience features and shortcuts to make your practice sessions as smooth and efficient as possible.

5. Real-time feedback with automated testing: To enhance your learning experience, we provide automated test cases that give you immediate feedback on your solutions. This real-time evaluation helps you quickly identify areas for improvement, ensuring continuous progress as you prepare for front end engineering roles.