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
1. Pressure side, questioning opinions?
slightly
2. Flatten the array
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
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
Require
const myPromise = val => Promise.resolve(val);
const delay = duration => {
// ...
};
myPromise(`hello`)
.then(delay(1000))
.then(val => console.log(val)); // 一秒之后输出 hello
Problem solving
const delay = duration => {
return (val) => (
new Promise((resolve, reject) => {
setTimeout(() => resolve(val), duration)
})
)
};
Three sides
1. Inquiry about project details
slightly. . .
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?
Rap
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
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) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。