Some comprehensive understanding of Js OOP programming to create objects

  • 2021-07-06 09:46:24
  • OfStack

Object-oriented is a method of understanding and abstracting the real world, and it is the product of the development of computer programming technology to a certain stage.

Meaning of object

Objects can be cars, people, animals, words, forms or anything that exists.

Objects are:

Attributes----Some specific properties of an object.
Method----What objects can do.
Events-----can respond to what happens to an object.

We can understand object-oriented by creating an object of one person

Person:

Two hands, two feet, one head, and you can run.

Hands, feet and head are human attributes, and running is human method.

First, let's create an object in the simplest way


var person = {
      head: "one",
      hand: "two",
      foot: "two",
      run : function(){
        console.log("running");
      }
    }

This method is not practical at all, because it creates a single object that has nothing to do with any common data structures.

Then, we create an object as a constructor


var Person = function(){// Attention , Capital initials 
      this.head = "one",
      this.hand = "two",
      this.foot = "two",
      this.run = function(){
        alert("running");
      }
    }
    var Joan = new Person();
    document.write(Joan.run())// "running"

This is the object created with the constructor, and then we add one more line of code to see


var Niki = new Person();
    alert(Joan==Niki) //false;

Yes, two different object instances are now created.

Each function in JavaScript has an prototype property. If a function is used as a constructor, this property is automatically prototyped through an new call


console.log(Joan)

You can see that there is a __proto__: Person, where __proto__ is the prototype chain of Joan, which points to the prototype of Person.

JS has a built-in property called __proto__ that points to the prototype prototype of the function object that created it when it creates an object (whether it is a normal object or a function object).

Some understanding of prototype chain is written in JavaScript Advanced Programming 1 in great detail. If you are interested, you can go and have a look. There are also pdf documents on the Internet. However, it is suggested to buy a book and support the original version.

Any changes to the stereotype property prototype can then be applied to every instance object constructed with new Person (), whether it was created before or after the change. Add a new function for Person. prototype as follows:


var Person = function(){// Attention , Capital initials 
      this.head = "one",
      this.hand = "two",
      this.foot = "two"
    }
    Person.prototype.run = function(){
      alert("running");
    }
    var Joan = new Person();
    Joan.run()// "running"
    alert(Joan.__proto__===Person.prototype)//'true'

As you can see, creating methods in the prototype is callable, and the prototype chain of Joan points to the prototype of Person.

Look again:


var Niki = new Person();//"runing"
     Person.prototype.run = function(){
       alert("running running")
     }
     Joan.run()//"running running"
     Niki.run()//"running running"

See, by modifying the prototype method of Person, all the methods in the object instances created by new Person () have been modified because all the instances share the same prototype method run. This is one application of prototype.

This is a little understanding about creating objects.

It's been written for a long time. I don't know if there are any mistakes. If there are any mistakes, you are welcome to give your advice.

I'll write about object-oriented inheritance next time.


Related articles: