Resolve 11 issues that are difficult to understand in Javascript

  • 2020-03-30 00:47:07
  • OfStack

1. Original and reference values

The original value is stored in the stack, and the reference value is stored in the heap.


function Person(id,name,age){
 this.id = id;
 this.name = name;
 this.age = age;
}
var num = 10;
var bol = true;
var str = "abc";
var obj = new Object();
var arr = ['a','b','c'];
var person = new Person(100," A fool's motto ",25);

2. Undefined and null

Undefined: variable undefined; Is an exclusive value of type Undefined;

Null: references not assigned; Is the exclusive value of a Null type.

Typeof (undefined) = = undefined;
Typeof (null) = = object;
Undefined = = null;
Undefined! = = null;
Null instanceof Object == false;
Undefined instanceof Object == false;

Although there are Undefined and Null types, the following example shows that these two types are not visible, which means that we can only use their values:

Alert (undefined instanceof undefined);
Alert (null instanceof null);

3. The pseudo array

Features:
1) has a length attribute;

2) access data in index order like an array;

3) do not have the unique methods of manipulating data such as push, pop, slice...

Arrays can be converted to real arrays by array.prototype.slice:

Var faceArray = {0: 'a', 1: 'b', length: 2}// standard pseudo-array;

Var realArray = Array. Prototype. Slice. Call (fakeArray);

Pseudo array in js: the arguments, the node.childnodes, document. The getElementsByTagName ()...

Problem in IE: node.childnodes in IE cannot be transformed with slice.

Pseudo-arrays in Jquery: Jquery itself is a pseudo-array:

Alert ($(' class1 ') length); Alert ($(' class1 '). [0]. TagName);

Literals for simple types

Var a = 1; B = true, c = "CCC ";

Literals look like they have a type

Alert (typeof a); / / number
Alert (typeof b); / / a Boolean
Alert (typeof c); / / the string

But it can't be measured by instanceof

/ / false alert (a instanceof Number)
/ / false alert (a instanceof Object)
/ / alert (b instanceof Boolean) false
/ / false alert (b instanceof Object)
/ / false alert (c instanceof String)
/ / false alert (c instanceof Object)

5. The prototype property of the function and the internal prototype property of the object instance

Each function(constructor) has a prototype property, and each instance of the object has an invisible prototype property (mozilla has made it public, which can be obtained with the prototype property of the constructor), which points to the prototype property of the constructor. On the top of the Object is the Object, so all the prototype chain will point to the Object. The prototype. When access to the Object instance properties/methods, from the Object instance itself began to search, if can't search, search upwards along the prototype chain, until the Object. The prototype. The prototype = = null.

6. A little secret of the constructor


var s = new function(){return "sss"};
alert(s);//[object Object]
s = new function(){return new String("sss")};
alert(s);//sss

Explanation of this code:

As long as the constructor after the new expression returns a reference object (array, object, function, etc.), it overrides the anonymous object created by new, and returns the anonymous object created by new if the constructor returns a primitive type (undefined if there is no return).


7. Object creation process


function Person(name){
        this.name = name;    
}
Person.prototype = {
        getName: function(){return this.name}    
};
var p = new Person('zhangsan');

Decryption of p creation process:

The & # 9702; Create a build-in object obj and initialize it;

The & # 9702; Point the inside of p [[Prototype]] to person.prototype;

The & # 9702; With p as this, the inner [[Call]] method of Person is called with the arguments argument, which executes the body of the Person function and returns the return value, or undefined, if no return.

The & # 9702; If the previous step returned an Object type, this value is returned to p, otherwise obj is returned.

8. Own and inherited properties of the object


function Person(name){
        this.name = name;    
}
Person.prototype = {
        type: 'human',
        getName: function(){return this.name}    
};
var p = new Person('zhangsan');
alert(p.hasOwnProperty('type'));//false
p.type = 'ren';
alert(p.hasOwnProperty('type'));//true

The result is clear: the property of an object cannot modify the property of the same name in its prototype, but creates and assigns a property of the same name itself.

9. Function object creation process

Create a build-in object fn;

Set the inner [[Prototype]] of fn to function.prototype;

Sets the internal [[Call]] property, which is an internally implemented method that handles the logic of the function Call. (simply understood as referring to the body of the function);

Set fn. Length to funArgs. Length. If the function has no arguments, set fn. Length to 0.

Constructor of a prototype points to fn itself.

Returns the fn.

10. Instanceof principle

To see if a is an instance of B is to see if B's prototype(the constructor's prototype property) points to an object that is not on a's prototype chain.

11. Guess about Function and Object

Alert (Function instanceof Function); / / true
Alert (Function instanceof Object); / / true   
Alert (Object instanceof Function); / / true
Alert (Object instanceof Object); / / true

Thought for a long time, did not think through...


Related articles: