Daily-Interview-Question
我是依扬(木易杨),公众号「高级前端进阶」作者,每天搞定一道前端大厂面试题,祝大家天天进步,一年后会看到不一样的自己。
Top Related Projects
前端面试每日 3+1,以面试题来驱动学习,提倡每日学习与思考,每天进步一点!每天早上5点纯手工发布面试题(死磕自己,愉悦大家),6000+道前端面试题全面覆盖,HTML/CSS/JavaScript/Vue/React/Nodejs/TypeScript/ECMAScritpt/Webpack/Jquery/小程序/软技能……
⚡️ Front End interview preparation materials for busy engineers
A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore.
A long list of (advanced) JavaScript questions, and their explanations :sparkles:
List of 1000 JavaScript Interview Questions
💯 Curated coding interview preparation materials for busy software engineers
Quick Overview
Advanced-Frontend/Daily-Interview-Question is a GitHub repository that provides a collection of daily front-end interview questions and answers. It aims to help developers prepare for technical interviews and improve their knowledge of front-end development concepts. The repository is maintained in Chinese, with some English translations available.
Pros
- Covers a wide range of front-end topics, including JavaScript, CSS, HTML, and browser-related concepts
- Regular updates with new questions and answers
- Encourages community participation through discussions and contributions
- Includes both theoretical questions and practical coding challenges
Cons
- Primarily in Chinese, which may limit accessibility for non-Chinese speakers
- Some answers may lack depth or alternative solutions
- Not all questions have accompanying code examples or explanations
- The organization of topics could be improved for easier navigation
Getting Started
To use this repository:
- Visit the GitHub page: https://github.com/Advanced-Frontend/Daily-Interview-Question
- Browse through the issues to find interview questions and answers
- Use the search functionality to find specific topics or keywords
- Contribute by commenting on existing questions or submitting new ones through issues
Note: Since this is not a code library, there are no code examples or installation instructions. The repository serves as a reference and learning resource for front-end developers preparing for interviews.
Competitor Comparisons
前端面试每日 3+1,以面试题来驱动学习,提倡每日学习与思考,每天进步一点!每天早上5点纯手工发布面试题(死磕自己,愉悦大家),6000+道前端面试题全面覆盖,HTML/CSS/JavaScript/Vue/React/Nodejs/TypeScript/ECMAScritpt/Webpack/Jquery/小程序/软技能……
Pros of fe-interview
- More comprehensive coverage of frontend topics, including HTML, CSS, and JavaScript
- Daily updates with new questions, providing a consistent learning experience
- Includes a wider range of difficulty levels, catering to both beginners and advanced developers
Cons of fe-interview
- Less focus on in-depth explanations for complex topics
- May lack the same level of community engagement and discussions as Daily-Interview-Question
- Questions might be more repetitive or cover similar concepts frequently
Code Comparison
fe-interview:
function debounce(fn, delay) {
let timer = null;
return function() {
clearTimeout(timer);
timer = setTimeout(() => fn.apply(this, arguments), delay);
}
}
Daily-Interview-Question:
function throttle(fn, delay) {
let last = 0;
return function() {
const now = Date.now();
if (now - last > delay) {
last = now;
fn.apply(this, arguments);
}
}
}
Both repositories provide code examples for common frontend concepts, but they may focus on different aspects or implementations of similar topics.
⚡️ Front End interview preparation materials for busy engineers
Pros of front-end-interview-handbook
- Comprehensive coverage of front-end topics, including HTML, CSS, JavaScript, and more
- Well-organized structure with clear categories and subcategories
- Available in multiple languages, making it accessible to a wider audience
Cons of front-end-interview-handbook
- Less frequent updates compared to Daily-Interview-Question
- Focuses more on general knowledge rather than specific, daily challenges
- May lack some of the community engagement and discussion found in Daily-Interview-Question
Code Comparison
front-end-interview-handbook:
function debounce(func, wait) {
let timeout;
return function executedFunction(...args) {
const later = () => {
clearTimeout(timeout);
func(...args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
}
Daily-Interview-Question:
function throttle(fn, delay) {
let last = 0;
return function (...args) {
const now = Date.now();
if (now - last > delay) {
last = now;
fn.apply(this, args);
}
}
}
Both repositories provide valuable resources for front-end developers preparing for interviews. front-end-interview-handbook offers a more structured and comprehensive approach, while Daily-Interview-Question provides regular, focused challenges that can help keep skills sharp. The choice between the two depends on individual learning preferences and goals.
A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore.
Pros of Front-end-Developer-Interview-Questions
- Comprehensive coverage of various front-end topics
- Multi-language support with translations in many languages
- Well-organized structure with categorized questions
Cons of Front-end-Developer-Interview-Questions
- Less frequent updates compared to Daily-Interview-Question
- Lacks detailed answers or explanations for the questions
- May not cover the latest trends in front-end development as quickly
Code Comparison
Front-end-Developer-Interview-Questions doesn't provide code examples directly, while Daily-Interview-Question often includes code snippets in its questions and answers. For example:
Daily-Interview-Question:
const promise = new Promise((resolve, reject) => {
console.log(1);
resolve();
console.log(2);
});
promise.then(() => {
console.log(3);
});
console.log(4);
Front-end-Developer-Interview-Questions focuses more on conceptual questions without code examples:
What is the difference between `==` and `===`?
Explain how `this` works in JavaScript.
What is the difference between variables created using `let`, `var` or `const`?
Both repositories serve as valuable resources for front-end developers preparing for interviews, with Daily-Interview-Question offering more frequent updates and code-based questions, while Front-end-Developer-Interview-Questions provides a broader, multi-lingual collection of conceptual questions.
A long list of (advanced) JavaScript questions, and their explanations :sparkles:
Pros of javascript-questions
- More focused on JavaScript-specific concepts and quirks
- Includes detailed explanations for each question and answer
- Regularly updated with new questions and community contributions
Cons of javascript-questions
- Limited to JavaScript topics, not covering broader frontend development
- Less structured in terms of difficulty levels or categories
- Fewer questions overall compared to Daily-Interview-Question
Code Comparison
javascript-questions:
let a = 3;
let b = new Number(3);
let c = 3;
console.log(a == b);
console.log(a === b);
console.log(b === c);
Daily-Interview-Question:
const promise = new Promise((resolve, reject) => {
console.log(1);
resolve();
console.log(2);
});
promise.then(() => {
console.log(3);
});
console.log(4);
The javascript-questions example focuses on JavaScript's type coercion and object comparison, while Daily-Interview-Question covers more complex topics like asynchronous programming and the event loop.
Both repositories offer valuable resources for frontend developers preparing for interviews or improving their skills. javascript-questions excels in deep JavaScript knowledge, while Daily-Interview-Question provides a broader range of frontend-related topics and challenges.
List of 1000 JavaScript Interview Questions
Pros of javascript-interview-questions
- More comprehensive coverage of JavaScript topics, including ES6+ features
- Well-organized with clear categories and subcategories
- Includes code snippets and explanations for each question
Cons of javascript-interview-questions
- Less frequent updates compared to Daily-Interview-Question
- Focuses solely on JavaScript, while Daily-Interview-Question covers broader frontend topics
- May be overwhelming for beginners due to the large number of questions
Code Comparison
Daily-Interview-Question example:
const list = [1, 2, 3]
const square = num => {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(num * num)
}, 1000)
})
}
javascript-interview-questions example:
function* generateSequence() {
yield 1;
yield 2;
return 3;
}
let generator = generateSequence();
console.log(generator.next().value);
Both repositories provide valuable resources for frontend developers preparing for interviews. Daily-Interview-Question offers a broader range of topics and more frequent updates, making it suitable for daily practice. On the other hand, javascript-interview-questions provides a more in-depth focus on JavaScript, with well-organized categories and detailed explanations. The choice between the two depends on the specific needs and preferences of the developer.
💯 Curated coding interview preparation materials for busy software engineers
Pros of tech-interview-handbook
- Comprehensive coverage of various topics beyond frontend, including system design and behavioral questions
- Well-structured content with clear categorization and navigation
- Includes additional resources like resume preparation and negotiation tips
Cons of tech-interview-handbook
- Less frequent updates compared to Daily-Interview-Question
- May be overwhelming for beginners due to the vast amount of information
- Focuses more on general software engineering concepts rather than specific frontend challenges
Code Comparison
tech-interview-handbook:
function binarySearch(arr, target) {
let left = 0;
let right = arr.length - 1;
while (left <= right) {
const mid = Math.floor((left + right) / 2);
if (arr[mid] === target) return mid;
if (arr[mid] < target) left = mid + 1;
else right = mid - 1;
}
return -1;
}
Daily-Interview-Question:
function debounce(fn, delay) {
let timer = null;
return function () {
clearTimeout(timer);
timer = setTimeout(() => {
fn.apply(this, arguments);
}, delay);
};
}
The code examples highlight the difference in focus between the two repositories. tech-interview-handbook provides more general algorithm implementations, while Daily-Interview-Question offers practical frontend-specific solutions.
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
Daily-Interview-Question
å å ¥ãå端é¢è¯äºå©ç¾¤ãå¦ä¹ å°ç»ï¼æç´¢å ¬ä¼å·ãé«çº§å端è¿é¶ãï¼å ³æ³¨å³å¯å å ¥ï¼
å·¥ä½æ¥æ¯å¤©ä¸é大åå端é¢è¯é¢ï¼ä¸å¹´ååå头ï¼ä¼æè°¢æ¾ç»åªåçèªå·±ï¼
线ä¸çæ¬é 读æ´æµç ï¼ç¹å»é 读
æ¨èä¸ä¸ªä¸éçå端ç®æ³ç³»åï¼ç¹å»æ¥ç
æ¨èæ«ç 使ç¨å¾®ä¿¡å°ç¨åºï¼é¤äºæ¬é¡¹ç®ä¹å¤ï¼è¿åæ¬äºç®æ³é¢ãéæ©é¢çå¤ç§ç±»åé¢ç®å详ç»è§£æ
è®°ä½æ们ç Sloganï¼ä¸ä¸çè·¯ä¸å·ä¸ç¹ï¼åå¹´çªå»è¿å¤§å
ä»æ¥é¢è¯é¢
第 162 é¢ï¼å®ç°å¯¹è±¡ç Map å½æ°ç±»ä¼¼ Array.prototype.map
解æï¼ç¬¬ 162 é¢
æè¿æ±æ»
第 161 é¢ï¼ç¨æç²¾ç¼ç代ç å®ç°æ°ç»éé¶éè´æå°å¼ index
// ä¾å¦ï¼[10,21,0,-7,35,7,9,23,18] è¾åº 5, 7 æå°
function getIndex(arr){
let index=null;
...
return index;
}
解æï¼ç¬¬ 161 é¢
第 160 é¢ï¼è¾åºä»¥ä¸ä»£ç è¿è¡ç»æï¼ä¸ºä»ä¹ï¼å¦æå¸ææ¯é 1s è¾åºä¸ä¸ªç»æï¼åºè¯¥å¦ä½æ¹é ï¼æ³¨æä¸å¯æ¹å¨ square æ¹æ³
const list = [1, 2, 3]
const square = num => {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(num * num)
}, 1000)
})
}
function test() {
list.forEach(async x=> {
const res = await square(x)
console.log(res)
})
}
test()
解æï¼ç¬¬ 160 é¢
第 159 é¢ï¼å®ç° Promise.retry
ï¼æåå resolve
ç»æï¼å¤±è´¥åéè¯ï¼å°è¯è¶
è¿ä¸å®æ¬¡æ°æçæ£ç reject
解æï¼ç¬¬ 159 é¢
第 158 é¢ï¼å¦ä½æ¨¡æå®ç° Array.prototype.splice
解æï¼ç¬¬ 158 é¢
第 157 é¢ï¼æµè§å¨ç¼å ETag éçå¼æ¯æä¹çæç
解æï¼ç¬¬ 157 é¢
第 156 é¢ï¼æ±æç» leftãright ç宽度
<div class="container">
<div class="left"></div>
<div class="right"></div>
</div>
<style>
* {
padding: 0;
margin: 0;
}
.container {
width: 600px;
height: 300px;
display: flex;
}
.left {
flex: 1 2 300px;
background: red;
}
.right {
flex: 2 1 200px;
background: blue;
}
</style>
注ï¼æ¤é¢å 155 é¢ leftãright æ ·å¼æäºä¸å
解æï¼ç¬¬ 156 é¢
第 155 é¢ï¼æ±æç» leftãright ç宽度
<div class="container">
<div class="left"></div>
<div class="right"></div>
</div>
<style>
* {
padding: 0;
margin: 0;
}
.container {
width: 600px;
height: 300px;
display: flex;
}
.left {
flex: 1 2 500px;
background: red;
}
.right {
flex: 2 1 400px;
background: blue;
}
</style>
解æï¼ç¬¬ 155 é¢
第 154 é¢ï¼å¼¹æ§çåä¸ flex: 0 1 auto 表示ä»ä¹ææ
解æï¼ç¬¬ 154 é¢
第 153 é¢ï¼å®ç°ä¸ä¸ªæ¹é请æ±å½æ° multiRequest(urls, maxNum)
â¨è¦æ±å¦ä¸ï¼
-
è¦æ±æ大并åæ° maxNum
-
æ¯å½æä¸ä¸ªè¯·æ±è¿åï¼å°±çä¸ä¸ä¸ªç©ºä½ï¼å¯ä»¥å¢å æ°ç请æ±
-
ææ请æ±å®æåï¼ç»ææç § urls éé¢ç顺åºä¾æ¬¡æåº
解æï¼ç¬¬ 153 é¢
2019-12-31
第 152 é¢ï¼å®ç°ä¸ä¸ª normalize å½æ°ï¼è½å°è¾å ¥çç¹å®çå符串转å为ç¹å®çç»æåæ°æ®
解æï¼ç¬¬ 152 é¢
2019-11-25
第 151 é¢ï¼ç¨æç®æ´ä»£ç å®ç° indexOf æ¹æ³
解æï¼ç¬¬ 151 é¢
2019-11-21
第 150 é¢ï¼äºåæ¥æ¾å¦ä½å®ä½å·¦è¾¹çåå³è¾¹ç
ä¸ä½¿ç¨JSæ°ç»APIï¼æ¥æ¾æåºæ°åæå åºç°çä½ç½®åæååºç°çä½ç½®
解æï¼ç¬¬ 150 é¢
2019-11-12
第 149 é¢ï¼babel æä¹æå符串解ææ ASTï¼æ¯æä¹è¿è¡è¯æ³/è¯æ³åæçï¼
解æï¼ç¬¬ 149 é¢
2019-11-01
第 148 é¢ï¼ webpack ä¸ loader å plugin çåºå«æ¯ä»ä¹ï¼å¹³å®ï¼
解æï¼ç¬¬ 148 é¢
2019-10-31
第 147 é¢ï¼v-ifãv-showãv-html çåçæ¯ä»ä¹ï¼å®æ¯å¦ä½å°è£ çï¼
解æï¼ç¬¬ 147 é¢
2019-10-29
第 146 é¢ï¼Vue ä¸ç computed å watch çåºå«å¨åªéï¼è¾ç®ï¼
解æï¼ç¬¬ 146 é¢
2019-10-24
第 145 é¢ï¼å端项ç®å¦ä½æ¾åºæ§è½ç¶é¢ï¼é¿éï¼
解æï¼ç¬¬ 145 é¢
2019-10-22
第 144 é¢ï¼æåäºè¿å¶è½¬ Base64ï¼é¿éï¼
解æï¼ç¬¬ 144 é¢
2019-10-21
第 143 é¢ï¼å° '10000000000' å½¢å¼çå符串ï¼ä»¥æ¯ 3 ä½è¿è¡åéå±ç¤º '10.000.000.000'
解æï¼ç¬¬ 143 é¢
2019-10-17
第 142 é¢ï¼ï¼ç®æ³é¢ï¼æ±å¤ä¸ªæ°ç»ä¹é´ç交éï¼é¿éï¼
解æï¼ç¬¬ 142 é¢
2019-10-15
第 141 é¢ï¼Vue ä¸ç computed æ¯å¦ä½å®ç°çï¼è ¾è®¯ãå¹³å®ï¼
解æï¼ç¬¬ 141 é¢
2019-10-14
第 140 é¢ï¼ä¸ºä»ä¹ HTTP1.1 ä¸è½å®ç°å¤è·¯å¤ç¨ï¼è ¾è®¯ï¼
解æï¼ç¬¬ 140 é¢
2019-09-17
第 139 é¢ï¼è°ä¸è° nextTick çåç
解æï¼ç¬¬ 139 é¢
2019-09-11
第 138 é¢ï¼å转é¾è¡¨ï¼æ¯ k 个èç¹å转ä¸æ¬¡ï¼ä¸è¶³ k å°±ä¿æåæ顺åºï¼åå©åå©ï¼
解æï¼ç¬¬ 138 é¢
2019-09-04
第 137 é¢ï¼å¦ä½å¨ H5 åå°ç¨åºé¡¹ç®ä¸è®¡ç®ç½å±æ¶é´åé¦å±æ¶é´ï¼è¯´è¯´ä½ çæè·¯
解æï¼ç¬¬ 137 é¢
ææé¢è¯é¢æ±æ»
åæå
- å端 100 é®ï¼è½ææ 80% ç请æç®åç»æ
- ãåæå 1ãå端é«é¢é¢è¯é¢åçæ¡æ±æ»
- ãåæå 2ãå端é«é¢é¢è¯é¢åçæ¡æ±æ»
- ãåæå 3ãå端é«é¢é¢è¯é¢åçæ¡æ±æ»
- ãåæå 4ãå端é«é¢é¢è¯é¢åçæ¡æ±æ»
èç³»æ
è¿é¶ç³»åæç« æ±æ»å¦ä¸ï¼è§å¾ä¸éç¹ä¸ª starï¼æ¬¢è¿ å 群 äºç¸å¦ä¹ ã
ææ¯æ¨ææ¨ï¼å ¬ä¼å·ãé«çº§å端è¿é¶ãä½è ï¼è·çææ¯å¨éç¹æ»å ä¸ä¸ªå端é¢è¯éé¾ç¹ãæ¥ä¸æ¥è®©æå¸¦ä½ èµ°è¿é«çº§å端çä¸çï¼å¨è¿é¶çè·¯ä¸ï¼å ±åï¼
Top Related Projects
前端面试每日 3+1,以面试题来驱动学习,提倡每日学习与思考,每天进步一点!每天早上5点纯手工发布面试题(死磕自己,愉悦大家),6000+道前端面试题全面覆盖,HTML/CSS/JavaScript/Vue/React/Nodejs/TypeScript/ECMAScritpt/Webpack/Jquery/小程序/软技能……
⚡️ Front End interview preparation materials for busy engineers
A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore.
A long list of (advanced) JavaScript questions, and their explanations :sparkles:
List of 1000 JavaScript Interview Questions
💯 Curated coding interview preparation materials for busy software engineers
Convert designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot