The problem

Gets the placement of page elements

Coordinates are obtained by summing offsets

// get the x coordinate of the elementfunction pageX(elem) {  
    returnelem.offsetParent? (elem.offsetLeft+pageX(elem.offsetParent)):elem.offsetLeft; }Copy the code

2. Get the left, top, bottom, and right positions directly with the latest function getBoundingClientRect ()

Function prototypes and prototype chains

function Person() {}let person = new Person
Copy the code

The instance Person Object obtains the instance prototype through __proto__ or null through object.getProtoTypeof (), forming a complete prototype chain

person.__proto__ = Person.protoType
Person.protoType.__proto__ = Object.protoType
Object.protoType.__proto__ = null
Copy the code

The function gets the prototype from Prototype. The prototype gets the constructor from Contructor

Person.protoType.contructor = Person
Copy the code

Using the prototype method to mount functions does not increase the load of the instance. There is no corresponding function on the generated instance. It is only associated with the prototype when it is used, and corresponding function storage space is opened for each instance.

The relationship of closures to the execution context

function bar() {
    var a = 10
    function foo() {
        console.log(a)
    }
    return foo
}
bar()()
Copy the code

Perform context operations:

Global context pushdown

stack= [globalContext]

The bar pressure stack

stack = [ globalContext, barContext ]

The bar back stack

stack= [ globlcontext ]

Foo pressure stack

stack = [

globalContext,

foo

]

Foo unstacks and prints a

stack= [ globalContext ]

If global context stack=[], no further action is required

During execution, although the variable A in bar is held by Foo and thus destroyed until Foo is unstacked, the bar context does not live longer and is unstacked directly after execution

Continuous assignment problem

var a = {n: 1}; var b = a; a.x = a = {n: 2}; A.x // what is the value of a.x? B.x // what is the value of B.xCopy the code

A.x = undefined, b.x = {n:2}

First of all:

var a, b
a = b = {n:1}
a // {n:1}
b // {n:1}
Copy the code

Prove that the chaining operation is performed from right to left

Cause: A copy is opened to perform the assignment operation while performing the concatenation operation

//a.x=a={n:2} X a = {n:1}. X a = {n:2}. X a = {n:1}. X a = {n:2}. So a in a.x address still is {n: 1} object, is not affected, can be seen as {n: 1}. X = {2} n: / / 2} {n: b / / {n: 1, x: {n: 2}}, b still point to {n: 1}Copy the code

The garbage collection

Browsers no longer use reference counting to determine whether objects should be recycled, avoiding memory leaks caused by circular references. Use the method of mark clearing to judge, scan objects periodically from the root, those unreachable objects are marked as no longer in use, clear.

Determine this from the ES5 specification

In the specification there is a type Reference that only exists in the specification, an abstract type that only exists in the specification and does not exist in the actual JS. Reference consists of three parts:

-base value

-reference name

-strict reference

Base value refers to the object or environmentRecord of the attribute. The value can be undefined, object, Boolean, string, number, environmentRecord, and reference name refers to the attribute name.

Var fooReference = {base: EnvironmentRecord, name:'foo',
    strict: false
};
var bar = {
    fn: funtion() {
        returnVar BarReference = {base: bar, propertyName: {base: bar, propertyName:'fn',
    strict: false
};
Copy the code

There are two methods to obtain the composition of reference in the specification, GetBase and IsPropertyReference. GetBase can obtain the base value content. IsPropertyReference can be used to determine whether the base value in the reference is an object. GetValue is a function that retrieves the actual content of the reference type. The return value is a concrete value, not a reference type

Var fooReference = {base: EnvironmentRecord, name:'foo',
    strict: false
};
GetValue(fooReference) // 1
Copy the code

Specifying this through the specification goes through these steps:

1. Calculate the result of MemberExpression to ref, the representation of MemberExpression

-PrimaryExpression // Original expression

-FunctionExpression // FunctionExpression

-MemberExpression[Expression] // Attribute access

– MemberExpression. IdentifierName / / property access point of grammar

-new MemberExpression Arguments // Object creation expression

It can also simply be the part to the left of (), such as foo in foo() or foo.bar in foo.bar()

2. Check whether ref is a Reference type

3.1 If IsPropertyReference(ref) is true, then the value of this is GetBase(ref), which is the base value of ref

3.2 If base Value is an environment Record, then this value is ImplicitTHisvalue(ref),ImpliciThisValue is undefined

3.3 If it is not Reference, the value of this is undefined

Case Study:

var value = 1;

var foo = {
  value: 2,
  bar: function () {
    returnthis.value; }} // Example 1 console.log(foo.bar()); // Example 2 console.log((foo.bar)()); // Example 3 console.log((foo.bar = foo.bar)()); // Example 4 console.log((false|| foo.bar)()); // Example 5 console.log((foo.bar, foo.bar)());Copy the code

Example 1:

MemberExpression is foo.bar, the attribute access expression, the Reference of bar:

var Reference = {
  base: foo,
  name: 'bar',
  strict: false
};
Copy the code

IsPropertyReference(ref) is true and this is foo, so output 2

Example 2:

(foo.bar) the same as foo.bar

11.13.1 Simple Assignment (=): Let rval be GetValue(rref). The value returned by GetValue is not the Reference type. 2.3 If ref is not Reference, the value of this will be undefined. In non-strict mode, if this is undefined, its value will be implicitly converted to a global object. (false| | foo bar) (see example 4, logic and algorithm, to check the specification 11.11 Binary Logical Operators: calculation of the second step: 2. Let lval be GetValue (lref). This is undefined (foo.bar, foo.bar)() look at example 5, the comma operator, 2.Call GetValue(lref). Because GetValue is used, the return type is not Reference; this is undefinedCopy the code

Example:

Foo (), memberExpression is foo, reference is:

Var Reference = {baseValue: environmentRecord name: foo strict:false
}
Copy the code

According to 3.2, if environmentRecord is returned, use impliciThisValue to return undefined, not strictly window

CONST

Const guarantees not that the value of a variable cannot be changed, but that the memory address to which the variable refers cannot be changed.

For basic types, the value is stored in the address to which the variable points, so the variable content is the same as a constant and cannot be modified. But for an object, the variable holding address is just a pointer to the data. Const only ensures that the pointer is immutable