Preface
Hello everyone, I’m Lin Sanxin, most difficult knowledge points in the most easy-to-understand is my motto, is the premise of advanced is my original intention
One big factory a week is a new series of articles published by me. The general process is as follows:
- I will collect some interviews from big factories and try to answer
- If they are all cities, wait for another round next week
- If you don’t, write it down, overcome them, write an article, and then the next round
The purpose of this series is: yourself to learn, write articles to consolidate new knowledge, and review old knowledge
Pinduoduo
Today is a giant one week second period, and today we look to re-set fight a lot face was found inadequate, and one by one break them!
one side
1. Inquiries about resume items-details
slightly. . . . .
2. Center vertically and horizontally
- 1、position: absolute + left: 50% + top: 50% + transform: translate(-50%, -50%)
- 2、display: flex + justify-content: center + align-items: center
3、display: table-cell + text-align: center + vertical-align: middle
3. What fields will the header of a simple request have?
Accept
: MIME types supported by the browserAccept-Encoding:gzip, deflate
: The compression codes supported by the browser are gzip and deflateAccept-Language:zh-cn,zh;q=0.5
: The languages supported by the browser are simplified Chinese and Chinese, the former is supported firstConnection:keep-alive
: The connection type between the client and the server is a persistent connectionContent-length
: content lengthContent-type
: content formatHost
: domain nameOrigin
: Visit source address (protocal + host)Referer
: Visit source address (complete)4. How to use map, filter and reduce?
You can read my article good foundation? Summarized 38 ES6-ES12 development skills, but to see how many points you can get? 🐶 Part in
map、filter、reduce
5. Have you ever learned about Symbol?
You can read my article foundation good? Summarized 38 ES6-ES12 development skills, but to see how many points you can get? 🐶 Part in
Symbol
6. ES5 inheritance, ES6 class inheritance, static method?
- ES5 inheritance: basic knowledge encountered in the work of 50 JavaScript in the
inheritance
ES6 class inheritance: good foundation? Summarized 38 ES6-ES12 development skills, but to see how many points you can get? 🐶 in
Class
7. Promise timeout control?
Use
Promise.all
const request = (delay) => ( new Promise((resolve, reject) => { setTimeout(() => { resolve('数据') }, delay) }) ) const time = (delay) => ( new Promise((resolve, rejct) => { setTimeout(() => { resolve('超时啦!') }, delay) }) ) const getData = (delay1, delay2) => ( Promise.race([request(delay1), time(delay2)]) ) // 不超时情况 getData(1000, 2000).then(res => console.log(res)) // 超时情况 getData(2000, 1000).then(res => console.log(res))
8. DFS find node
function depthFirstSearchNoRecursion (target) { const res = []; const stack = target.slice(); // console.log(stack) while (stack.length > 0) { const node = stack.shift(); // 最上层节点出栈 res.push(node.id); // 如果该节点有子节点,将子节点存入栈中,继续下一次循环 const len = node.children && node.children.length; for (let i = len - 1; i >= 0; i--) { stack.unshift(node.children[i]); } } return res; }
9. What are the characteristics of Node and what is it suitable for?
characteristic
1. It is a Javascript runtime environment
2. Rely on Chrome V8 engine for code interpretation
3. Event-driven
4. Non-blocking I/O
5. Lightweight, scalable, suitable for real-time data interactive applications
6. Single process, single thread
Scenes
1. High concurrency (the most important advantage)
2. Suitable for I/O intensive applications
10. What are the advantages of midway over egg?
As far as I know,
typescript
is very good
11. Has typescript been practiced?
Practiced:
Vue3 + TS + Vite
React + TS + Vite
12. Are there any design patterns in normal use?
It may be used, but I didn’t pay attention to it, and I didn’t summarize it.
13. Usual packaging tools-Webpack related
Recommend a few articles:
2020, and the code won't be fragrant if you don't type webpack again (
webpack ten consecutive questions how many questions you can answer
14. Do you have anything I didn't ask you to say?
slightly
15. Cache-related, CDN cache processing?
CDN cache is similar to
browser http cache, this one is not proficient, you have to take a look
16. What do you want to ask?
Am I handsome?
Two sides
Two sides
1. Pressure side, questioning opinions?
1. Pressure side, questioning opinions?
slightly
2. Flatten the array
2. Flatten the array
Require
Require
const flatten = (list, level = +Infinity) => {
// ...
};
const array = [1, [2, [3, 4, [5]], 3], -4];
const list1 = flatten(array);
const list2 = flatten(array, 2);
console.log(list1); // [1, 2, 3, 4, 5, 3, -4]
console.log(list2); // [1, 2, 3, -4]
Problem solving
Problem solving
const flatten = (list, level = +Infinity) => {
let res = list
for (let i = 0; i < level; i++) {
res = [].concat(...res)
if (!res.some(item => Array.isArray(item))) break
}
return res
};
3、Promise
3、Promise
Require
Require
const myPromise = val => Promise.resolve(val);
const delay = duration => {
// ...
};
myPromise(`hello`)
.then(delay(1000))
.then(val => console.log(val)); // 一秒之后输出 hello
Problem solving
Problem solving
const delay = duration => {
return (val) => (
new Promise((resolve, reject) => {
setTimeout(() => resolve(val), duration)
})
)
};
Three sides
Three sides
1. Inquiry about project details
1. Inquiry about project details
slightly. . .
2. Do you read the Vue source code?-Responsive principle, nextTick
2. Do you read the Vue source code?-Responsive principle, nextTick
You can see my Vue source code analysis column
3. Have you studied any new technologies recently?
3. Have you studied any new technologies recently?
Rap
4. What are the practices for project optimization?
4. What are the practices for project optimization?
slightly. . . Answer these aspects according to your own project:
1. Business optimization
2. Optimize the request
3. Optimized packaging
4. Optimized architecture
5. How does V8 execute a piece of code?
The first step:
Parser
convert the code toAST (Abstract Syntax Tree)
Step 2:
interpreter Ignition generates bytecode
Step 3: Implementation
6, 72-Edit distance
Will not. . Has been collected in Dachang algorithm questions
7, 226-flip binary tree
Will not. . Has been collected in Dachang algorithm questions
8. The practice of performance optimization?
slightly. . . Answer according to your own project. .
9. Any other questions?
Am I handsome
Concluding remarks
Concluding remarks
I am Lin Sanxin, an enthusiastic front-end rookie programmer. If you are motivated, like the front-end, and want to learn the front-end, then we can make friends, fish together haha, fish school, add me, please note [think]
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。