objects, functions, and inheritance in JavaScript

1, the object in JavaScript. JavaScript can be said to be an object-based programming language, why it is object-based rather than object-oriented, because JavaScript itself only implements encapsulation, and does not implement inheritance and polymorphism. Since he is based on the object, then we say the object in JS.

1. Objects in JavaScript

JavaScript can be said to be an object-based programming language, why it is object-based rather than object-oriented, because JavaScript itself only implements encapsulation, and does not implement inheritance and polymorphism. Since he is based on the object, then we say the object in JS. Some people say that all of JS are objects, this sentence is not entirely correct. The right side is that he emphasized the importance of the object in JS, the object is ubiquitous in JS, including the function that can construct the object itself is also an object. On the other hand, JS also has some simple data types, including numbers, strings and booleans, null values, and undefined values, which are not objects. So why are these types of values not objects, after all they have methods. So let's see, there are two definitions for the definition of objects in JavaScript.

(1) The object in JavaScript is a mutable set of keying (keyed collections) (this definition comes from chapter III of the sophisticated book)

(2) Objects in JavaScript are unordered (unordered) collection of properties that can contain simple data types, objects, functions, and functions that are stored in an object property are also called methods of this object. (from the ECMA-262 4.3.3) (Note: The attributes described here are those that can be created and accessed in a JS script (which we call the dominant attribute), excluding the internal attributes that the system automatically assigns to the object.

So why is that simple data type not an object, mainly because the methods in the values of these data types are immutable, and the attributes of an object should be able to be changed.

2. The prototype chain in the object [[Proto]]

When each object in JavaScript is created, the system automatically assigns it a prototype attribute [[Proto]], which is used to connect to his prototype object. In JavaScript, an object's inheritance is implemented through [[Proto]] in each object. However, the [[Proto]] property of an object cannot be accessed and modified in JavaScript, as an intrinsic attribute, and is automatically set by the system while the object is created.

When a property of an object is accessed, if the property does not exist in this object, look for the properties of the archetypal object that his [[Proto]] refers to, and return if found, otherwise continue to search along the [[Proto]] chain until the [[Proto]] connection is null.

3, the function is also the object

The function in JavaScript itself is an object (so we often call it a function object), and it can be said that he is the most important object in JS. It is called the most important object, on the one hand he can play the same role as a function in other languages, can be invoked, can be passed in parameters, on the other hand, he is also used as an object's constructor (constructor), can be combined with the new operator to create the object.

Since a function is an object, it necessarily contains all the properties that the object has, including the prototype chain [[Proto]] attribute that the object was created with.

Let's look at what distinguishes a function object from a normal object. As we said earlier, objects are unordered sets of attributes, so what is the difference between the properties of a function and the properties of a normal object? As described in section 13.2 of ECMA-262, when a function object is created, the system defaults to creating two properties [[Call]] and [[constructor]], when the function object is called as a normal function (for example, MyFunc ()), "()" The operator indicates that the [[]] property of the function object is executed, and when he is invoked as a constructor (for example, New Myconst ()), his [[constructor]] property is executed, [[[Cosntructor]] The implementation process we will introduce in the next section. In addition, when a function is created, the system creates a display property prototype for it by default and assigns it a value of

This.prototype = {Constructor:this}

The specific content can take part in the fifth chapter of the seasoned book. This function object's prototype property is also for JS to implement the function as a constructor for inheritance is prepared, but this attribute can be accessed and modified in the JS script. The point to be emphasized here is that you have to distinguish between the [[Proto]] property in the object and the prototype attribute in the function object, I just started to learn because there is no good distinction between these two things, walked a lot of detours.

4, the creation of objects

There are two ways to create objects in JS, one by literal means, such as

var person = {

"First_Name": ' Liang ',

' last_name ': ' Yang '

}

Another method is to create a

var i = new person (' Liang ', ' Yang ');

In fact, the first way to create the process is equivalent to calling the object constructor to implement, as follows.

var person = new Object ();

Person.first_name = ' Liang ';

Person.last_name = ' Yang '

So we can combine the creation of all the objects in JS to use the constructor to implement, below me to detail the constructor to create the object of the process:

The first step is to create an empty object (with no attributes) and point [[Proto]] of this object to the prototype Property object of this constructor function

The second step is to pass this empty object as this pointer to the constructor function and execute the

The third step, if the function above returns an object, returns the object, otherwise the object created in the first step is returned

The fourth step is to use the function as a class

As we can see from the above steps, the prototype of a function object generally points to a normal object, not a function object, which is also accessible in objects created by this function constructor. So we can design our code so that a function can represent a class, and this constructor function generates an object that is an instance object of this class, then the property and method that should be in the instance object should be placed in the prototype of the constructor function. The static method of this class can be placed directly into the function as the object's property, the last function is the constructor we call in the object-oriented language, where we distinguish between the word "constructor" and "constructor function," which refers to the constructor of a class in a normal object-oriented language. A constructor function refers to a function in JavaScript that is used as a constructor.

In the 3rd verse we said that each function's prototype object always contains a constructor attribute, which is connected to our function itself. Plus, the [[Proto]] property of each object generated by this function is a prototype object to the constructor function, so the [[Proto]] chain, each object generated by the constructor function, has a constructor property that points to the constructor function that generated it. So we can use this property to determine which constructor function This object is generated from.

5, function Inheritance (class inheritance)

Having said so much, it's time for us to talk about inheritance in JavaScript, so let's consider what we're going to do to implement the class inheritance, assuming we're going to inherit from superclass to subclasses subclass

In order to enable access to properties in superclass-generated objects by subclass-generated objects, you can make Subclass.prototype an object that is generated by a superclass constructor.

Subclass.prototye = new superclass ();

But the problem is, according to the new superclass () we said in the 4th section, not only does it copy all the methods in Superclass.prototype, but it also runs the superclass () function, which acts as a constructor in the class. We know that the constructor of the parent class should be invoked in the constructor of the subclass to implement initialization. For this we can create a constructor that is empty, but the prototype is consistent with the superclass prototype, and the Subclass.prototype points to the object generated by the function.

var F = function () {};

F.prototype = Superclass.prototype;

Subclass.protptype = new F ();

This allows us to do the work of property duplication without invoking the constructor. But there is also the problem, which is that we have modified the subclass prototype attribute, so we delete the constructor attribute, so that we don't know what constructor function he is generating. We can give him another assignment.

SubClass.prototype.constructor = subclass;

This will solve the problem of duplicating attributes. But the new problem comes up, and in subclass we don't know what constructor function his parent class is, so we can't call the constructor of the parent class in the constructor, so we can add a property to subclass to indicate that his parent class

Subclass.superclass = Superclass.prototype;

So I can use SubClass.superClass.constructor to access the constructor of the parent class in the constructor of a subclass. Finally, we write the above ideas as a function

Mypro.extend = function (Subclass,superclass) {

var F = function () {};

F.prototype = Superclass.prototype;

Subclass.protptype = new F ();

SubClass.prototype.constructor = subclass;

Subclass.superclass = Superclass.prototype;

SuperClass.prototype.constructor = superclass;

}