Knowledge learning of JavaScript objects, packaging classes, prototypes, prototype chains and call/apply (3)

Object

The prerequisite for learning packaging classes must be based on understanding the object and its use. Simply put, an object contains properties and methods. It is similar to a function, but an instance of it is created through the new method. The object can be defined as empty. After creating his instance, the properties and methods of the instance object are created by the method called.

function Person() {
    
     }

var person = new Person();
person.name = "xxx";
person.work = function () {
    
    
	console.log("i am working!");
}

Usually we use the this keyword to refer to the internal properties and methods of the object, and use the new keyword to call the constructor:

  • 1. Will implicitly create this{} empty object in the context of the execution of the constructor
  • 2. Then define the properties and methods of the original object in this this object, and assign the actual parameters
  • 3. Finally, implicitly return this this object.
    If the object is written to return a constant, it will not be executed when new, but will continue to implicitly return this {}.
    When accessing properties or methods that do not exist in the object, no error will be reported, but undefined will be displayed. In
    our daily program creation, we usually create an object directly in the way of **object name={}**, it will implicitly help We complete related operations to make the code more concise.

Packaging

The well-known number and string are all basic types and do not have the function of an object, but we do some object operations on it, but the result is not what we imagined.

var a = 10;
a.abc = "hello!";
console.log(a.abc)

Since a is a basic type, but we use a.abc to add attributes to it, we know that the system did not report an error, but when we console this attribute, it will display undefined. What is going on.
In fact, it also performed a few steps:

  • 1. At the time of a.abc, the system found that it was not an object and could not do this, so it would automatically convert a into a digital object (packaging class) for us.
  • 2 Then define the abc attribute for this a object, and automatically destroy this object after the definition is completed.
  • 3. When we call a.abc again, he discovers that a is not an object, so implicitly converts a, and then looks for the abc attribute inside him, and finally finds that this new object does not have this attribute, so it will Return undefined.

We tried using a similar string to define variables, and the result will be the same, but why can we use **string.length()** to get the length of the string, because this is the original definition of the object string. This attribute, so after the implicit conversion, we can get the result we want.

Knowledge supplement

String.charCodeAt(x)
This is another method in the object string, which can return the unicode code number of the specified character in the string. Using this method, we can determine the number of bytes occupied by the string. When the return value is less than 255 Take one place, and vice versa.

prototype

After all objects are instantiated, they have a common parent, which is included in the function object, and the prototype is also an object. When the function object is defined, it is implicitly included, that is, prototype{}, We can define some methods and properties in it, then the instantiated object will automatically inherit these and be shared.

Student.prototype.name = "xxx";
function Student() {
    
    }
var student = new Student();

After this definition, we check student.name, it will return "xxx", but if we want to change the properties in the prototype, we must never student.name = "yyy", in this case, the name attribute will be redefined inside the original object , Instead of modifying the properties in the prototype, when the object and prototype properties have the same name, select the nearest principle to call the corresponding value.

constructor

This is a primitive property in the prototype object, which exists when the prototype is established, indicating the construction method of the current object, and it can also be changed manually.

__ proto __

This property is also included in the prototype object, which is equivalent to super in java, ensuring that the child object and ancestor can be connected through __proto__ as the connection axis, until the top Object.prototype, you can manually modify the prototype of a parent , But they will still connect to the top in the end. It is the top-level prototype of most objects , and the emphasis here is on most, not all . There are also method overrides in js. toString() is a method from Object.prototype, but it has been overridden in many objects.

Object.create (prototype)

This method is a small part that exists outside the vast majority.

obj = {
    
    name="xxxx"}
var obj1 = Object.create(obj)

This can also play the role of creating an object, but you will not find the __proto__ object in it, because it has been assigned a unique prototype when it is created. The parameters must be filled in, otherwise a syntax error will be reported.
When we want the B constructor to get the prototype of the A constructor, we often set the intermediate variable temp so that its prototype points to the prototype of A, and then points the prototype of B to temp, which not only guarantees the inheritance requirements, but also guarantees Therefore, when B modifies the prototype attribute, it will not affect the prototype of A.

function Person() {
    
    
	name:"xxx";
}
var A={
    
    }
A.prototype = Person;
function extend(target,origin){
    
    
	var F = {
    
    }
	F.prototype = A.prototype;
	target.prototype = F;
}
extend(B,A);
var a = new A();
var b = new B();

call/apply

The function of call is to change the direction of this and use other constructors to complete the realization of its own constructor.

function Person(name,age) {
    
    
	this.name = name;
	this.age = age;
}
function Studetn(name.age.socer) {
    
    
	Person.call(this,name,age);
	this.socer = socer;
}
var stu = new Student("xxx",18,99);

The role of Person.call() is equal to Person. Both are to call this function. The only difference is that the first parameter of .call must specify which object this is modified to. The second parameter is the real parameter. The above code just shows his most common practice, using some of the existing objects with the same attributes to create its own attributes, reducing the redundancy of the code, and making the code more concise and concise. The usage of
apply is exactly the same as that of call , except that the actual parameter passed in must be an array, such asPerson.call(this,[name,age]);

Guess you like

Origin blog.csdn.net/baldicoot_/article/details/106215797