1. Fuction and Object prototype chain

Juejin. Cn/post / 684490…

  • Prototype; Function. Prototype; Function and Object and other constructors;

Const adder = new Function("a", "b", "return a + b"); // Const adder = new Function("a", "b", "return a + b"); // Call function adder(2, 6);Copy the code

The Function constructor creates all functions in JS.

2. What happens when the new keyword is instantiated?

3, JS hand tear new:

  • 1. Create an empty object
  • 2. This points to the new object and executes the constructor code
  • 3. Set the prototype chain so that the new object’s __proto__ points to the constructor’s Prototype object
  • 4. Check: If the type of the object passed is an object, return the new object; Otherwise, return directly
/** * 1; /** * 1; /** * 1; /** * 1; /** * 1; /** * 1; /** * 2; Function myNew(){debugger var obj = new Object(); var Constructor = [].shift.call(arguments) var result = Constructor.apply(obj,arguments) obj._proto_ = Constructor.prototype; return typeof result === 'object' ? result:obj } function F(){ console.log('F----') } let f = myNew(F) console.log(f)Copy the code

Implicit stereotype attribute _proto_

Function A() {} a.prototype.n = 1 var b = new A(); A.prototype = { n: 2, m: 3 } var c = new A(); console.log(b.n, b.m, c.n, c.m)Copy the code

Constructor () 4

let f = new Funtion('x', 'return x')
Copy the code
class _Function {
  constructor (param, expression) {
    this.param = param
    this.expression = expression
  }
}

let _f = new _Function('x', 'return x')

console.log(_Function.prototype) // _Function {}
console.log(_Function.prototype.prototype) // undefined
console.log(_Function.prototype.__proto__) // {}

console.log(Function.prototype) // [Function]
console.log(Function.prototype.prototype) // undefined
console.log(Function.prototype.__proto__) // {}
Copy the code

4.1. Constructor writing

A common programming convention follows: in a sense, to define a constructor is to define a class, and the first letter of the class is capitalized. function People(name, age) { this.name = name; this.age = age; }; People.prototype.showName = function () { console.log(this.name); }; Var p1 = new People(' WQH ', 18); p1.showName(); var p2 = new People('w', 19); var p3 = new People('q', 20); console.log(p1, p2, p3);Copy the code

  • Different instances of new refer to the same stereotype.
  • The constructor on the prototype refers to the same constructor, People.
  • The prototype People constructor writes methods that are ‘inherited’ by the instance object.
  • Only properties written on the Prototype are ‘inherited’ (common); elsewhere they are private

4.2. Prototype has been rewritten

function People(name, age) { this.name = name; this.age = age; }; People.prototype = { showName: function () { console.log(this.name); Var p1 = new People(' WQH ', 18); p1.showName(); var p2 = new People('w', 19); var p3 = new People('q', 20); console.log(p1, p2, p3);Copy the code

  • When Prototype is redefined as an object, the newly defined prototype object does not contain the constructor attribute, and therefore instances of the class do not contain the constructor attribute.
function People(name, age) { this.name = name; this.age = age; }; People.prototype.showName = function () { console.log(this.name); }; Var p1 = new People(' WQH ', 18); // p1.prototype.say = function () { // console.log(this); / /}; // undefined p1.say = function () { debugger console.log(this); // undefined };Copy the code

Prototype rewritten solution

function People(name, age) { this.name = name; this.age = age; }; People.prototype = { constructor: People, showName: function () { console.log(this.name); Var p1 = new People(' WQH ', 18); p1.showName(); var p2 = new People('w', 19); var p3 = new People('q', 20); console.log(p1, p2, p3); ! [](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/56d0841f13b44ff1b8fb5af660176fa6~tplv-k3u1fbpfcp-watermark.image)Copy the code

  • Explicitly add a constructor to the stereotype

5, class

5.1 the class writing

class People { constructor (name, age) { this.name = name; this.age = age; } showName () { console.log(this.name); }}; Var p1 = new People(' WQH ', 18); p1.showName(); var p2 = new People('w', 19); var p3 = new People('q', 20); console.log(p1, p2, p3);Copy the code

class People { constructor() { // ... } showName() { // ... Prototype = {constructor() {constructor() {};Copy the code

I’m a prototype

  • Each Function has a prototype property. Normally, fn. Prototype is an object, except function.prototype

7. Implicit prototype chain _proto_

var F = function(){}

Object.prototype.a =function(){}
Function.prototype.b =function(){}

var f = new F()
Copy the code

Function constructors vs Function declarations vs Function expressions

  • Function constructor
var multiply = new Function('x', 'y', 'return x * y');
Copy the code
  • Function declaration
function multiply(x, y) { return x * y; } // No semicolonsCopy the code
  • Functional expression
var multiply = function(x, y) {
   return x * y;
 };
Copy the code

9. Function properties and methods

  • Because functions are special objects in javascript, they can also have properties and methods.

9.1. The length attribute

  • The length attribute of a function is read-only and represents the number of arguments to the function.

9.2. The prototype properties

  • Each function contains a Prototype property, which is a reference to an object called a prototype object.
  • Each function contains a different prototype object.
  • When a function is used as a constructor, the newly created object inherits properties from the prototype object.

9.3. Call () and apply () methods

9.4. The bind () method

9.4. The toString () method

  • The toString() method returns a string that is dependent on the syntax of the function declaration statement. Most (but not all) implementations of the toString() method return the full source code for the function.