A thorough understanding of the browser cache mechanism

Two concepts

Strong cache
request sent by the user, directly from the client cache, do not send the request to the server, it does not interact with the server behavior occurs.
Caching negotiation
request sent by the user, after sending to the server, determines whether or not access to resources from the cache by the server.
Both have in common: the client data obtained are finally obtained from the client cache.
Difference between the two: you can see from the name, strong cache does not interact with the server, and negotiate the cache requires interaction with the server.

Four process detailed

(A) determine whether a browser cache

(B) the cache has expired

(C) in consultation with the server whether to use the cache

(D) consultations cache

7591556.html

Understand the execution environment, active objects and the scope chain

Execution Environment

JavaScript execution environment is the most important concept. Perform other data functions defined variables or functions have access to, determine their own behavior. Each execution environment variable object has an associated (variable object) chain and a scope (scope chain), it is defined in the environment variables and functions are stored in their variable object. Execution environment is divided into two types, one is the global execution environment, one is a function of the execution environment.

Global Execution Environment

Global execution environment is the most peripheral of an execution environment, the global variable object is the active object (window activation object), global execution environment until the application exits - such as web pages or close the browser - when will be destroyed.
Function Execution Environment

Each function has its own execution environment. When the stream enters performing a function, a function of the ambient environment will be pushed into the stack. When the function is executed, it will pop up the stack environment, returning control to the execution environment before. Execution environment variable object function is the function of the active object (activation object).

The scope chain

For each execution environment, will create a scope chain associated with it. Each front-end scope chain execution environment, execution is always the variable object environment for the implementation of the global environment is equivalent to the window object, the execution environment for the function equivalent to the function of the active object; for global execution environment has been It is the root, no follow-up, a function of the execution environment, which follow the scope of the strand is the function object [[scope]] properties in the scope chain.

Function object

When a function definition, this will create a function object [[scope]] property (internal attributes, JS engine can access only, but a few FireFox engine (SpiderMonkey and Rhino) to provide private property __parent__ access to it), and the [[scope]] attribute points to define its scope chain. The problem here, because the funcA defined in the global environment, so at this time [[scope]] only to the global activities of the object window active object.

Active Object

When a function object is called, creates an active object, the first argument for each parameter and function, are added attributes and values for the active object; the body of the function display variable and function declarations also added that the activities of the property (when you enter the function execution environment, unassigned, so the value is undefined, this statement is JS advance mechanism).

Then the active object as the forefront of the scope chain execution environment function, and this function object [[scope]] property in scope link into the back end of the function scope chain execution environment.

ES6 Promise Usage Summary

1. What is the Promise

Promise asynchronous programming is a solution, in fact, is a constructor, himself a all, reject, resolve these methods, there is then, catch methods on the prototype.

Promise object has the following two characteristics.

State (1) is not subject to outside influence. Promise object represents an asynchronous operation, there are three states: pending (in progress), fulfilled (been successful) and rejected (failed). Only results of asynchronous operations, you can decide what kind of current state, no other operations can change that state. Promise This is the origin of the name, which in English means "commitment", he said other means can not be changed.

(2) Once the status change, it will not change, at any time this result can be obtained. Promise object changes state, only two possibilities: from pending from pending changes to become fulfilled and rejected. As long as these two things happens on the solidification state, it will not be changed and will keep the result, then called resolved (finalized). If the change has occurred, you add a callback function to Promise object will immediately get this result. This event (Event) is completely different, the characteristics of the event is, if you missed it, go listen, is not the result.

More details: https://www.liaoxuefeng.com/wiki/1022910821149312/1023024413276544

The relationship between the MVC, MVP and MVVM

Overview

MVC, MVP and MVVM is an architectural pattern, Application Architecture In order to address the complexity of GUI applications management problems that arise.

MVC pattern Summary

1. That is Model, View, Controller Model i.e., the view controller.

View: It is provided to the user interface, of a shell;
Model: program data and information is to be operated;
Controller: receiving an instruction transmitted over View layer, select Model layer data corresponding to operate accordingly.

2. For a similar example of a reality, MVC mode of operation as a shop, View layer is equivalent to this shop's storefront, Model layer corresponds to this store warehouse, Controller layer corresponds to the implementation of this department shops.

3.MVC There are two modes, regardless of which mode of communications are unidirectional MVC, can also be seen from FIG, View layer will take the data from the Model layer, and the MVC Model View layer or layers present coupling.

MVP mode Summary

1.MVP from MVC evolved, namely Model, View, Presenter; View and Model in MVC with M and V, MVP just in MVC Controller into a Presenter;

2. On the face by the introduction of MVC, we can see that, in the View layer and the MVC Model layer is coupled to exist, but in fact we do not advocate View layer and the Model layer has a direct interaction; MVP is such a thought reflect, interact with the Model View layer only through the Presenter;

3.MVP MVC and there is a difference, it is two-way communication, as shown, there are two directions: V-> P-> M, M-> P-> V

MVVM pattern Summary

1.MVVM is evolved from the MVP, and MVP the MVVM pattern substantially the same, except the MVP of the VM becomes P, i.e. the ViewModel,

The data may be implemented 2.MVVM way binding, i.e., the data change data View layer also changes the ViewModel, whereas the ViewModel data changes, then the data layer also changes View

3. In this front-end frame illustrated MVVM VUE, of course, there are many well-known frameworks using a MVVM pattern; MVVM advantage is data-driven, variable data, the page is changed, so that we can use a simple code to achieve more complex logical operation; therefore more suitable for complex logic MVVM frame front end projects, such as the number of management systems.

1) Preparation view layer

<P> Hello, {{name}}! </ P> --View unidirectional binding layer --VUE

<Input v-model = "name"> --View bidirectional binding layer --VUE

2) Preparation data layer

data: {
            name: ''               --Model层
        }

至于VM层，VUE框架已封装好，预知详情可阅读廖雪峰的博客；

4）得益于MVVM框架，我们此时想改变视图层的<p>标签和<input>标签中的name属性的值，只需要通过如下方式即可，这样页面中就会显示“Jack”的名字，如果不是MVVM框架，我们则需要通过document.getElementById('name').innerHTML = 'jack'，这种操作dom节点的方式来改变页面的值。

this.name = 'jack'

Common interview questions summary