cross-DomainSame- origin policy: Security policies that are implemented on the browser for security reasons. A URL consists of a protocol, a domain name, a port number, and a path, if the protocol, domain name, and port number of the two URLs are the same, the same origin. Ajax requests are limited by the same-origin policyJsonp Use the src attribute of the <script> tag to load the features of the cross-domain JS script, dynamically create a script tag to load cross-domain resources, jquery encapsulates the method, need to set datatype to JSONP, only support GET request two, Domain three, CORS server in response header plus allow access to domain and HTTP method four, Server Agent because there is no cross-domain problem on the server. A, the cross-domain request into the domain of the request B, the server side of the dynamic script is responsible for forwarding the client's actual requestClosed PackageVariable scope: There are two types of variables, local variables and global variables. A global variable can be read inside a function, and a local variable inside a function cannot be read outside the function. Closures can be implemented to read local variables inside a function outside the function. Use: First, read the function internal variable two, let the value of the variable is always saved in memory, not by garbage collection mechanism recovery disadvantage: First, the variable is stored in memory, memory consumption, affecting the performance of the Web page, in IE may lead to memory leaks. WORKAROUND: Delete the unused local variables before exiting the function the closure will change the value of the internal variable of the parent function outside the parent functionprototype chain_proto_ is a property of every object, prototype is the property that the function has, and the _proto_ pointer points to who sees how the object is created. Three ways to create an object: A, the literal way _proto_ points to OBJECTB, the constructor way _proto_ points to the constructor C, Object.create (a) _proto_ points to a prototype chain: JS all objects, and each object has _proto_ genus , so a chain of _proto_ is formed, and this chain is the prototype chain. When JS looks up the properties of an object, it is found on the object itself, and if it is not found, it is found on the prototype chain until the head is found.several ways to realize the inheritance of JSCreating a parent constructor Child,child needs to inherit the properties and methods of the parents, the inherited constructor implements the inheritance in child set Parent.call (this), cannot inherit the parent's prototype property and method two, To borrow a prototype to implement inheritance by setting Child.prototype = new Parent (); Iii. combination of two ways of combining inheritanceBrowser Kernel resident processFirst, the browser GUI rendering processsecond, JavaScript engine processthird, the browser event trigger processIv. Browser Timer trigger processv. Browser HTTP asynchronous request threadPerformance Optimization1, Sprite Figure 2, mobile response image 3, static resource CDN4, reduce DOM operations (using event delegation) 5, compression Html,css,jsBrowser Rendering Principle1. After parsing the HTML into DOM tree, parsing the CSS into rule Tree2, integrating the DOM tree and the rule tree into render Tree3, and calculating the position of each element, the browser places the element where it should be, and draws it on the screen through the graphics card.front-end routingDefinition: Routes show different content or page usage based on different URLs: commonly used in single-page applications (SPA), since spas are both front-and back-end, the backend does not provide routing technology to the front-end: HTML5 The new API before the advent of a hash to achieve, compatibility is better. Hash is the part of the URL in the back of the section, by listening to the hash change trigger Onhashchange event, when the hash value changes, the history of the browser will generate records, but will not make a request to the server, can be used by the client to do forward and backward HTML5 History has added two api,history.pushstate and history.replacestate, and these two APIs will allow the browser to generate records, but none of them will make a request to the server: The backend routing client sends a request to the server and the server responds to the request to the client with network latency, the front-end route has no network latency, and the user experience is betterscript Tag defer, async differenceDefer: Executes after HTML loading is complete, if there are more than one, executes async in the order of loading: Executes immediately after loading, if there are multiple, regardless of the load orderafter entering a URL in the browser, what happens? 1, the browser to find the domain name of the IP address 2, the browser according to the resolution of the IP address, the Web server to send an HTTP request 3, the server received the request and processing 4, the server returned a response 5, the browser to decode the response, rendering page 6, the page display is complete, The browser sends an asynchronous requesta complete HTTP request processA complete HTTP request starts after a successful connection from the TCP three handshake, the client sends an HTTP request to the server in the specified format, the service ends the request, resolves the HTTP request, processes the business logic, and returns a specified format of the HTTP response to the client. HTTP request format: consists of a request line, a request header, a blank line, a message body four parts, each part of the content of the HTTP response format: The status line, response header, blank line, message body four parts, each part of the content of a rowHTTP protocolThe HTTP protocol is an abbreviation for Hypertext Transfer Protocol, which is used to transfer hypertext to a local browser from a World Wide Web server. The HTTP protocol transmits data based on the TCP/IP communication protocol.Features:1, simple and fast. When a client sends a request to the server, it only needs to transfer the request method and path 2, flexible. The HTTP protocol allows the transmission of any type of data 3, no connection. Each connection processes only one request, and after the server finishes processing the request and receives a client response, it disconnects 4, stateless. HTTP protocol does not have memory ability to deal with thingshttp URL: A complete URL consists of the following partsHttp://www.aspxfans.com:8080/news/index.asp?boardID=5&ID=24618&page=1#name 1, Protocol 2, Domain 3, port number 4, virtual directory 5 , file name 6, parameter section 7, anchor partHTTP requests:Consists of the request line, the request header, the blank line, the message body four parts, each section content occupies one rowHTTP response:Consists of a status line, a response header, a blank line, a message body, and a row for each part of the contentHTTP status code:1XX: Indicates information-Indicates that the request has been received, to continue processing 2xx: Success-Indicates that the request has been successfully received, understood, and accepted 3xx: Redirect-Indicates that a request must be further manipulated to complete 4xx: Client Error-Request syntax error or request cannot be implemented 5XX: Server Side Error-Server Failed to implement legitimate request common status code: $ OK Client request succeeded the client request has a syntax error, cannot be understood by the server 403 Forbidden server received the request, but refused to provide service 404 Not Found Request resource not present (wrong URL entered) Internal Server error service side unexpected error 503 Server unavailable service is currently unable to process guest Client request, may return to normal after a period of timeCookie and session, Localstorage and SessionstorageLocalstorage and Sessionstorage are the save locations provided by the H5 Web Storage API: Localstorage, Sessionstorage, and cookies are saved on the browser side, Session saved on server-side data expiration: Localstorage is always valid, browser Close is always saved sessionstorage valid cookies are valid until the browser is closed Sess Ion is required to request to the server, effectively save the size of the service-side set-up period: cookies up to 4k localstorage, sessionstorage are much larger than cookies, reaching 5M or even more pros and cons: The cookie is carried in the same-Origin HTTP request, the Localstorage is passed back and forth between the browser and the server, the sessionstorage is not carried in the request, only the session is held locally to occupy server space, but the data is stored more Safety
Web Front end Interview Knowledge Point summary
