Front end interview questions

[Question and answer] 
You know HTTP Status code? Please introduce it casually.
-------------------------------------------------------------------------------------
From: front end engineer advanced detection
 reference resources:
100 Continue   Continue, usually sending post The request was sent http header After that, the server will return this information to confirm, and then send specific parameter information
200 OK     Normal return information
201 Created   The request succeeded and the server created a new resource
202 Accepted   The server accepted the request but has not yet processed it
301 Moved Permanently   The requested page has been permanently moved to a new location
302 Found   Temporary redirections 
303 See Other   Temporary redirection and always use
GET Request new URI 
304 Not Modified   The requested page has not been modified since the last request
400 Bad Request   The server cannot understand the format of the request, and the client should not try to initiate the request with the same content again
401 Unauthorized   Request not authorized
403 Forbidden   No access
404 Not Found   Can't find how to communicate with URI Matching resources
500 Internal Server Error   The most common server-side errors
503 Service Unavailable The server side is temporarily unable to process the request (possibly overload or maintenance)

The status code is very necessary for data interaction between our front and rear ends. He said that it is a state of the server,

When a browser visits a web page, the browser will send a request to the server where the web page is located. Before the browser receives and displays the web page, the server where the web page is located will return a server header containing HTTP Status Code to respond to the browser's request. The English of HTTP Status Code is HTTP Status Code. This is the original words in the rookie tutorial

In this way, we can better understand the working state of the server at this time.

How to obtain UA?

How to get UA?
function whatBrowser() {   
    //Get the full browser name
    document.Browser.Name.value=navigator.appName;   
    //Get the browser version, which generally does not correspond to the actual browser version
    document.Browser.Version.value=navigator.appVersion;   
    //Gets the name of the browser. It's usually Mozilla, even in non Mozilla browsers
    document.Browser.Code.value=navigator.appCodeName;   
    //Gets the user agent string for the browser
    document.Browser.Agent.value=navigator.userAgent;   
}

The function of UA identification is to enable the server to identify the operating system and version, CPU type, browser and version, browser rendering engine, browser language and browser plug-in used by the customer, so as to judge whether the user is browsing by computer or mobile phone, and make the web page adapt automatically. As a headache IE browser, this is still very annoying

js how to get cookies

// Create cookie
function setCookie(name, value, expires, path, domain, secure) {
     var cookieText = encodeURIComponent(name) + '=' + encodeURIComponent(value);
     if (expires instanceof Date) {
         cookieText += '; expires=' + expires;
     }
     if (path) {
         cookieText += '; expires=' + expires;
     }
     if (domain) {
         cookieText += '; domain=' + domain;
     }
     if (secure) {
         cookieText += '; secure';
     }
     document.cookie = cookieText;
}
// Get cookie
function getCookie(name) {
     var cookieName = encodeURIComponent(name) + '=';
     var cookieStart = document.cookie.indexOf(cookieName);
     var cookieValue = null;
     if (cookieStart > -1) {
         var cookieEnd = document.cookie.indexOf(';', cookieStart);
         if (cookieEnd == -1) {
             cookieEnd = document.cookie.length;
         }
         cookieValue = decodeURIComponent(document.cookie.substring(cookieStart +             
         cookieName.length, cookieEnd));
     }
     return cookieValue;
}
// Delete cookie
function unsetCookie(name) {
     document.cookie = name + "= ; expires=" + new Date(0);
}

Cookies are still very useful for us. Maybe some little friends don't know what cookie s are. I checked a lot of information and thought they didn't speak human words, so I'll make a simple analogy to understand it when I see it correctly

If you want to go to a supermarket now, the supermarket is our server. You must go to the supermarket to make a transaction, right? Then this transaction or this transaction is an interaction between us and the server. You (client) enter the supermarket (server) and buy a lot of this commodity (data), but when you check out, the server says, I have to save your commodity record (generally speaking, issuing an invoice). Then the invoice at this time is our cookie. This invoice can only be used by the supermarket, or this cookie can only be recognized by the server. This transaction is like a stateless http protocol.

js array de duplication

[Question and answer] 
js Array de duplication.
----------------------------------------------------------------------------------------------------------------------------
From: front end engineer advanced detection
 reference resources:
There are two points to note: 1. Whether the return value is the current reference; 2. The judgment condition of "duplicate".
Array.prototype.uniq = function () {
 // The length is only 1, and the current copy is returned directly
    if (this.length <= 1) {
        return this.slice(0);
    }
    
    var aResult = [];
    for (var i = 0, l = this.length; i < l; i++) {
        if (!_fExist(aResult, this[i])) {
            aResult.push(this[i]);
        }
    }
    return aResult;
 // Determine whether to repeat
 function _fExist(aTmp, o) {
        if (aTmp.length === 0) {
        return false;
    }
    var tmp;
    for (var i = 0, l = aTmp.length; i < l; i++) {
        tmp = aTmp[i];
        if (tmp === o) {
            return true;
        }
 // NaN requires special treatment
        if (!o && !tmp && tmp !== undefined && o !== undefined && isNaN(tmp) && 
isNaN(o)) {
            return true;
        }
    }
    return false;
 }
}

Talk about the understanding of website reconstruction

[Question and answer] 
Talk about the understanding of website reconstruction.
----------------------------------------------------------------------------------------------------------------------------
From: front end engineer advanced detection
 reference resources:
Website reconstruction: without changing the external behavior, simplify the structure, add readability, and maintain a good reputation at the front end of the website
 The act of causing. In other words, it is not changing UI In the case of, optimize the website and maintain consistency while expanding
UI. 
For traditional websites, refactoring is usually:
1. form(table)Layout changed to DIV + CSS 
2. Make the website front end compatible with modern browsers(For non-conforming CSS,Such as right IE6 effective) 
3. Optimization of mobile platform
4. For SEO Optimize
5. Aspects that should be considered in deep-seated website reconstruction
6. Reduce coupling between codes
7. Keep code flexible
8. Write code in strict accordance with specifications
9. Design scalable API 
10. Replace the old framework and language(as VB) 
11. Enhance user experience
12. In general, speed optimization is also included in refactoring
13. compress JS,CSS,image Other front-end resources(It is usually solved by the server) 
14. Program performance optimization(Such as data reading and writing) 
15. use CDN To speed up resource loading
16. about JS DOM Optimization of
17. HTTP Server's file cache

Tags: network server http

Posted on Wed, 24 Nov 2021 07:14:57 -0500 by djfox