directory

  1. Babel principle
  2. Prototype chain judgment

The Babel principle

Babel is a JavaScript compiler. It compiles the latest version of javascript into a currently executable version. In short, Babel allows us to freely use the new es6 and even ES7 syntax in our current projects.

The three main processing steps of Babel are: parse, transform and generate.

  • Parsing parses code into abstract syntax trees (AST). Each JS engine (such as V8 in Chrome) has its own AST parser, and Babel is implemented through Babylon. In the parsing process, there are two stages: lexical analysis and syntax analysis. The lexical analysis stage transforms strings of code into a stream of tokens. Tokens are like nodes in the AST. The parsing phase converts a token flow into the AST form and converts the information in the token into the AST representation structure.
  • At this stage, Babel receives the AST and performs depth-first traversal with babel-traverse, adding, updating, and removing nodes. This is where the Babel plug-in comes in.
  • Generating transforms the transformed AST into JS code via babel-Generator by going depth-first through the AST and building a string that represents the transformed code.

For more information, see the Babel principle

Second, prototype chain judgment

Object.prototype.__proto__; //null
Function.prototype.__proto__; //Object.prototype
Object.__proto__; //Function.prototype
Object instanceof Function; //true
Function instanceof Object; //true
Function.prototype === Function.__proto__; //true
Copy the code
"a".__proto__.__proto__.__proto__===null//true

'a'.__proto__ === String.prototype //true

new Number(1).__proto__.__proto__.__proto__===null //true

Copy the code

// Something about the prototype done in new

newObj.__proto__=constructor.prototype;
Copy the code

__proto__ always points to prototype

__proto__ under prototype always points to Prototype. In addition to null

  • __proto__ and Prototype are both objects. \

  • Only functions have Prototype. Functions also have two __proto__. One on the function itself and one on its prototype object.

  • Only objects have __proto__. Think back to obj in the implementation of new.proto=courstranctor.prototype.

  • __proto__ always points to prototype

  • __proto__ under prototype always points to prototype. In addition to null * *

  • **JS everything is an object, the object will have a __proto__ attribute. 支那

  • Only functions have Prototype. (1), “ab”,[],{} and other instances are without prototype. Because they are data objects (instance objects), not functions.

  • Functions also have __proto__, and two of them

  • For more information about the prototype chain, see juejin.cn/post/684490…

Third, instanceof

Checks whether an object A is an instance of another object B

function instans_of(obj,func){
	var obj = obj.__proto__;// Take the implicit prototype of the object obj
	var func = func.prototype;// Take the display prototype of the constructor
    while(true) {if(obj===null) {return false};
        if(obj===func){return true};// return true if obj is strictly func
       obj=obj.__proto__;//}}Copy the code

Four,

five

reference

  • For more information about the prototype chain, see juejin.cn/post/684490…

conclusion

  • Babel receives the AST and performs depth-first traversal with babel-traverse
  • The difficulty of prototype chain lies in the prototype of Function.
// The prototype of the constructor
Function.__proto__ === Function.prototype; // true
Function.prototype.__proto__ === Object.prototype // true
Object.__proto__ ===Function.prototype // true
Number.__proto__ ===Function.prototype
Copy the code

1) Regular prototype chain

2) Constructor special prototype case