I went to the interview today and filled in the basic experience information of the occupational personality test, personality test and recruitment. The interviewer is the technical head, soft in the steel belt, the question is smooth and silent feeling, which tests the basic skills.
10:30 am interview a dada front end, using the online Tencent conference way, the interviewer is a big beauty, the most suffocating operation is to let me cast the screen in the browser console knock code, with the compiler it is not sweet? The interview at 4:00 PM is an ecological monitoring company, which pays more attention to perfect personality. In addition to the technical problems mentioned by the technical director, the other procedures are professional personality test, professional experience, personality test, etc. Here’s a summary of a few questions that weren’t well answered.
directory
1. Verify the mobile phone number using the regular expression
2. Draw a 0.5px line.
3. What happens between entering the URL and loading the page?
4.JavaScript is single-threaded. How can asynchronous code be executed?
5. What are forward and reverse proxies?
1. Verify the mobile phone number using the regular expression
Validating regular interpretation
- If I start at the beginning, the first one is 1;
- The second is 3,4,5,7,8;
- The third digit to the end is a number from 0 to 9.
function checkPhone(phone) {
// Verify phone number Mobile number, including all number segments up to now? ?
var ab = ,4,5,7,8 / ^ [1] [3] [0-9] {9} $/;
if (ab.test(phone) == false) {
layer.alert("Please fill in your phone number correctly!", { icon: 5.offset: '200px'}); returnfalse; }}Copy the code
2. Draw a 0.5px line.
I then came directly to a border: 0.5px. The interview asked me sure? Because usually it may be a direct border: 1px. I didn’t pay attention to details. So let’s do that.
<! DOCTYPEhtml>
<html>
<head>
<meta charset="utf-8">
<title>Test 0.5 px.</title>
<style type="text/css">
#demo{
border:0.5 px. solid # 000000;
background-color: red;
width: 150px;
height: 150px;
}
</style>
</head>
<body>
<div id="demo">I'm a job seeker</div>
</body>
</html>
Copy the code
It doesn’t seem to be a problem
That’s probably not what the interviewer is asking, so do some research. This should refer to some 0.5px problem with 0px in the lower version on the mobile. After the test you will find that some versions may have errors, the minimum size problem is unknown, according to his train of thought it.
Use the Meta ViewPort approach.
<meta name="viewport" content="initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no" />
Copy the code
usingtransform: scale()
Scale the height of the drawn line by half
<! DOCTYPEhtml>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="Initial - scale = 1.0, the maximum - scale = 1.0, user - scalable = no" />
<title>boardTest</title>
<style>
p{
margin: 50px auto;
padding: 5px 10px 5px 10px;
color: red;
text-align: center;
width: 60px;
}
p:first-child{
border-bottom: 1px solid red;
}
p:last-child{
position: relative;
}
p:last-child:after {
position: absolute;
content: ' ';
width: 100%;
left: 0;
bottom: 0;
height: 1px;
background-color: red;
-webkit-transform: scale(1.0.5);
transform: scale(1.0.5);
-webkit-transform-origin: center bottom;
transform-origin: center bottom
}
</style>
</head>
<body>
<div>
<p>Click on the 1</p>
<p>Click on the 2</p>
</div>
</body>
</html>
Copy the code
It is basically the above method, of course, it may also use the gradient method of linear-gradient, but forget it.
3. What happens between entering the URL and loading the page?
1. DNS domain name resolution
The moment the return enter hits, the browser checks the input box and says, “what the hell is www.sunjiaoshou.com?” What I need is an IP address! In desperation, I turned to the browser cache and asked it to find whether there was a record of this guy, but the result was not found. At this time, I turned to the system cache, mainly to find the hosts file in the system. Similarly, I did not find the router cache at this time to check the router mapping table. So, the computer will be sent to the local DNS domain name server (service provider) for local connection, local DNS server to send a domain name to other server can not find, recursive process, will first sent to the root name servers to find and return to the top-level domain name server IP address, request a top-level domain name server IP back to the secondary domain name server IP, The secondary DNS server IP address is returned to the tertiary DNS server IP address…… Until the corresponding IP address is found, return to the browser.
2. Initiate a TCP connection (three-way handshake)
The browser is happy to get the IP address, and can finally contact a distant “friend” with a purpose. The TCP protocol at the transport layer sends a request to the remote server, which is called the three-way handshake:
① Source -> Remote: Hello, may I speak to you? (SYN = 1, seq = x)
② Remote -> source: Yes, are you sure you want to connect? (SYN = 1, ACK = 1, seq = y, ACK = x + 1)
③ Source -> remote: Ok, let’s connect! (ACK = 1, seq = x + 1, ACK = y + 1)
3. Send HTTP requests and receive HTTP responses
In this case, you need to encapsulate the address entered by the user into an HTTP Request packet and send it to the server. After receiving the Request, the server will send a response, that is, the response data.
HTTP request packet format: request line + request header + Blank line + message body. The request line contains the request mode (GET, POST, DELETE, or PUT), request resource path (URL), and HTTP version
HTTP response packet format: status line + response header + blank line + message body. The status line contains the HTTP version number, status code, and status description.
4. Disconnect THE TCP connection (wave four times)
The transmission is finished, so let’s disconnect!
FIN=1,seq=u (FIN=1,seq=u)
(ACK=1,seq=v, ACK= u+1)
(FIN=1,ACK=1,seq=w, ACK= u+1)
(ACK=1,seq=u+1, ACK= w+1)
5. The browser parses THE HTML code, requests JS, CSS and other resources, and finally renders the page to the user
After the browser obtains the file, it starts to use the kernel to parse it. During the parsing process, some HTTP requests will also appear to request some resources, such as JS and CSS files, and then download these files to the local PC. When the browser parses HTML files from top to bottom, a DOM tree is generated at first, and CSS rule tree is generated after parsing CSS. Then the two trees are fused and synthesized into a rendering layer, and finally the API of the Native GUI of the operating system is called for rendering.
4.JavaScript is single-threaded. How can asynchronous code be executed?
One of the hallmarks of the JavaScript language is single-threaded, which means you can only do one thing at a time. So why can’t JavaScript have multiple threads? It’s more efficient.
The single thread of JavaScript, relative to its purpose. As a browser scripting language, JavaScript’s primary purpose is to interact with users and manipulate the DOM. This means that it has to be single-threaded, which can cause complex synchronization problems. For example, if there are two threads of JavaScript at the same time, one thread adds content to a DOM node, and the other thread removes that node, which thread should the browser use?
So, to avoid complexity, JavaScript has been single-threaded since its inception, and this has been a core feature of the language and will not change.
In order to make use of the computing power of multi-core CPU, HTML5 proposes the Web Worker standard, which allows JavaScript scripts to create multiple threads, but the child threads are completely controlled by the main thread and cannot operate DOM. So, this new standard doesn’t change the single-threaded nature of JavaScript.
Single threading means that all tasks need to be queued until the first one is finished before the next one can be executed. If the first task takes a long time, the second task has to wait forever. The JS engine executes asynchronous code instead of waiting because of message queues and event loops.
- Message queue: A message queue is a first-in, first-out queue that holds various messages.
- Event loop: An event loop is the process by which the main thread repeatedly fetches and executes messages from the message queue.
In fact, the main thread does only one thing: fetch messages from the message queue, execute messages, fetch messages, execute messages. When the message queue is empty, it waits until the message queue becomes non-empty. And the main thread will not fetch the next message until the current message has been executed. This mechanism is called an event loop, and the process of taking a message and executing it is called a loop.
while(true) {
var message = queue.get();
execute(message);
}
Copy the code
After executing all the code in the current loop, the main thread goes to the message queue to fetch the message (the message function) and execute it. At this point, the worker thread notifies the main thread, and the callback is executed. If the main thread does not provide a callback function in the first place, there is no need for the AJAX thread to notify the main thread when it receives an HTTP response and thus place a message on the message queue.
5. What are forward and reverse proxies?
Forward agent
A forward proxy is like a jump board in that the proxy accesses external resources
For example, if we visit Google in China and cannot access it directly, we can send a request to the proxy server through a forward proxy server. The proxy server can access Google, so that the proxy will fetch the returned data from Google and then return it to us, so that we can access Google
Forward proxy uses:
**** (1) Access previously inaccessible resources, such as Google
(2) Can do cache, speed up access to resources
(3) Authorize client access and authenticate Internet access
(4) The agent can record user access records (online behavior management) and hide user information externally
The reverse proxy
In the actual operation mode of Reverse Proxy, the Proxy server receives Internet connection requests, forwards the requests to the server on the internal network, and returns the results obtained from the server to the client requesting Internet connection. In this case, the Proxy server acts as a server externally
Reverse proxy functions:
(1) To ensure the security of the Intranet and prevent Web attacks, large websites usually use the reverse proxy as the public network access address, and the Web server is the Intranet
(2) Load balancing, through the reverse proxy server to optimize the load of the website
Well, that’s all for this episode, and we’ll see you next time!
A good book is none the worse for being read many times before we are familiar with it. Let learning become a habit, with knowledge to change fate, let the blog witness growth, with action to prove hard. If my blog is helpful to you, if you like my blog content, please “like” “comment” “favorites” one key three even oh! I heard that the people who like 👉 👈 are not too lucky, and will feel full of vitality every day! ^ _ ^ ❤️ ❤️ ❤️ Code word is not easy, everyone’s support is my motivation to keep going. Don’t forget to follow 👉 👈 after you like me! For more exciting content, please visit Sun’s blog
Wechat public account [E-commerce Programmer] to share and change their own projects.
If there are any errors or inaccuracies in the above content, feel free to leave a comment below at 👇. Or you have a better idea, welcome to exchange learning ~~~