This is the 22nd day of my participation in the August More Text Challenge.

Chapter 4 constructors and prototype objects

The constructor

Constructors are briefly introduced here

  • The only way to create an object is through the new + constructor

  • Constructors must begin with a capital letter

  • When you create an object using the new+ constructor, you can omit the parentheses if you do not need to pass in arguments

  • You can use the instanceof operator to determine whether an object is an instanceof a type

  • When the new + constructor creates an object, the object’s constructor property points to that constructor. (Since the constructor attribute can be overridden, it is recommended to use Instanceof to check the object type)

  • This, the newly created object, is returned by default. You can also show that if you call a return, if reutrn returns an object, you return that value, and if reutrn returns a primitive type, you continue to return the newly created object.

  • When you do not use new, this in the constructor refers to the global object, which in strict mode raises an error.

    function Person(name) { this.name = name this.sayName = function(){ console.log(this.name) } } var person1 = new Person(‘a’) var person1 = new Person(‘b’) console.log(person1.name) console.log(person2.name) person1.sayName() person2.sayName()

    console.log(person1 instanceof Person) // true console.log(person1.constructor === Person) // true

Summary: The new + constructor creates objects that have the same properties and methods using this in the constructor. The problem is that methods declared like this are not shared, but each object has its own method, consuming more space. Intuitively, it’s much better to use the same method for all objects. Prototype objects in JavaScript, that’s how they play.

A prototype object

Creates the concrete execution of the object

  1. A brand new object is created.
  2. This object will be executed[[Prototype]]Link.
  3. The generated new object is bound to the function callthis.
  4. throughnewEach object created will eventually be[[Prototype]]Link to this functionprototypeOn the object.
  5. If the function does not return an object typeObject(including,Functoin.Array.Date.RegExg.Error), thennewThe function call in the expression automatically returns the new object.

[[Prototype]] attribute

  • An object instance traces its Prototype object through an internal attribute [[Prototype]]

  • When new creates an object, it assigns the object’s [[Prototype]] internal properties to the constructor’s Prototype object, such as Person.prototype

  • GetPrototypeOf (Object) gets the [[Prototype]] internal properties of the Object instance

  • The use of the Object. The prototype. IsPrototypeOf (Object) to determine whether the Object prototype Object instance

  • [[Prototype]] : [Prototype] : [Prototype] : [Prototype] : [Prototype] : [Prototype] : [Prototype] : [Prototype] : [Prototype] : [Prototype

    function Foo() {} function Bar() {} function Baz() {}

    Bar.prototype = Object.create(Foo.prototype); Baz.prototype = Object.create(Bar.prototype);

    var baz = new Baz();

    console.log(Baz.prototype.isPrototypeOf(baz)); // true console.log(Bar.prototype.isPrototypeOf(baz)); // true console.log(Foo.prototype.isPrototypeOf(baz)); // true console.log(Object.prototype.isPrototypeOf(baz)); // true

Object instance prototype object difference

Use and change prototype objects in constructors

How to use prototype objects and change the impact of prototype objects on subsequent object operations

function Person(name){
    this.name = name
}
Person.prototype = {
    constructor: Person,
    sayName:function(){
        console.log(this.name)
    }
    toString:function(){
        return "[Person "+this.name+"]"
    }
}

var person1 = new Person("Nicholas")
var person2 = new Person("Greg")

console.log("sayHi" in person1)
console.log("sayHi" in person2)

Person.prototype.sayHi = function(){
    console.log("Hi")
}
person1.sayHi()
person2.sayHi()
Copy the code

A prototype object for a built-in object

The prototype of the built-in object can also be modified and its own methods added

Array.prototype.sum = function(){
    return this.reduce(function(previous,current){
        return previous + current
    })
}
var numbers = [1,2,3,4,5]
var result = numbers.sum()
console.log(result)
Copy the code

Summary:

Boring. Read this article with great enthusiasm, but many of the concepts he talks about seem like basic operations. Because it’s so basic, you don’t see much, you know, light. The only puzzle is the concept of object instance, constructor and object prototype, which is only introduced in this book without corresponding mind map, which makes people feel a lot of confusion. I want to summarize by myself, but I feel that the time has not come, so I can only wait for the next opportunity with regret.