JS object-oriented, prototype, call(), apply()_javascript skills

1. Cause
I used prototype.js that day, so I opened it and took a look. After reading a few lines, I was confused. The reason was that I was not very familiar with the object-oriented nature of js, so I googled it on Baidu, and finally I figured it out. Harvest, write this to commemorate it^_^.
prototype.js code snippet

Copy code The code is as follows:

var Class = {
create: function() {
return function() {
this.initialize.apply(this , arguments);
}
}
}
// Class usage The method is as follows
var A = Class.create();
A. prototype={
initialize:function(v){
this .value=v;
}
showValue: function(){
alert(this.value);
}
}
var a = new A('helloWord!');
a. showValue();//pop-up dialogue Box helloWord!

What is l initialize?
l What does the apply method do?
What about the arguments variable?
l Why is the initialize method executed after new A?
Find the answer:
2. Object-oriented Js
What is initialize?
It is just a variable, representing a method, used as a constructor of a class.
Its specific functions are supported by the object-oriented nature of js. So what does the object-oriented nature of js look like? What are the similarities and differences with java?
Look at the code:

Copy the code The code is as follows:

var ClassName = function(v ){
this.value=v;
this.getValue=function(){
return this.value;
}
this.setValue=function(v){
this .value=v;
}
}

So what is the difference between functions and classes in JS?
In fact, it is the same. ClassName is a function. When it appears after new, it is used as a constructor to construct the object.
Such as

Copy code The code is as follows:

var objectName1 = new ClassName(“a ”);//Get an object

where objectName1 is the object obtained after executing the ClassName constructor, and this in the ClassName function refers to the object constructed after new, so objectName1 will be One property and two methods. They can be called like this:

Copy code The code is as follows:

objectName1.setValue(' 'hello'');
alert(objectName1.getValue());//Dialog hello
alert(objectName1.value);//Dialog hello

Then

Copy code The code is as follows:

var objectName2 = ClassName("b");//Get a Object

What does objectName2 get? Obviously it is the return value of the method. Here ClassName is just used as an ordinary function (although the first letter is capitalized). But there is no return value in the previously written ClassName, so objectName2 will be undifinded. So who is "b" assigned to? An object is not generated here, but this method is simply executed, so this "b" is assigned to the object window that calls this method. The evidence is as follows:
var objectName2 = ClassName("b");//get An object
alert(window.value); //Dialog b
So all functions in JS are the same, but their uses may be different (used to construct objects or execute a process).
It’s time to return to the topic. What does initialize do?

Copy code The code is as follows:

var Class = {
create: function() {
return function() {
this.initialize.apply(this , arguments);
}
}
}
var A = Class.create();

This code constructs a function and copies it to A. This function is

Copy code The code is as follows:

function() {
this.initialize.apply(this , arguments);
}

And this latter method is used as a constructor. When using this constructor to construct an object, the initialize variable of the constructed object will execute the apply() method. The purpose of apply() will be discussed later, and we will continue to talk about initialize. In this way, initialize will be contacted when initializing the object (how to contact depends on apply).
Then

Copy the code The code is as follows:

A.prototype={
initialize:function(v){
this .value=v;
}
showValue:function(){
alert(this.value);
}
}
What does

mean?
Prototype means "prototype". A is a function(), then A. prototype is a variable in the function, which is actually an object. Whatever methods this object has, then the objects generated by the function will have those methods, so
var a = new A('helloWord!');
a. showValue();//Pop up the dialog box helloWord!
So object a will also have an initialize method. Not only that, every object constructed by A will have an initialize method. As mentioned before, the constructor will be called during construction, and initialize will be called in the constructor. Call the apply method, so initialize goes back to call the apply method when new A('helloWord!'). This is to call an initialization method.
3. call() and apply()
Let’s start to study apply(). I found some information on the Internet and combined it with my own research to understand call() and apply( ) function. The functions are basically the same. The function of function().call(object,{},{}...) or function().apply (object,[...]) is that the object object calls the funciton() here. The difference is The call parameters are passed to funciton starting from the second one, and can be listed in sequence separated by ",". Apply only has two parameters, the second one is an array, which stores all the parameters passed to the function.
this.initialize.apply(this , arguments); What does
mean?
The first this here refers to the object generated after calling the constructor with new, which is the previous a, so of course the second this should also refer to the same object. Then this sentence is that this (that is, a) calls the initialize method, and the parameter is the arguments object (array object of parameters), so when the constructor is executed, the object a will execute the initialize method to initialize, so that it is consistent with the word " initialize" means the right thing.
So how are the parameters for executing the initialize method passed in?
4. Arguments object
This code can explain everything:

Copy code The code is as follows:

function test(){
alert(typeof arguments);
for(var i=0; ialert( arguments[i]);
}
}
test("1","2","3");
test("a","b");

After execution, alert(typeof arguments); will display object, indicating that arguments are objects. Then 1, 2, and 3 will be played in sequence. Description arguments is the actual parameter group of the calling function.

Copy code The code is as follows:

var Class = {
create: function() {
return function() {
this.initialize.apply(this , arguments);
}
}
}

arguments is the structure returned by create The actual parameter group of the function, then when
var a = new A('helloWord!');
'helloWord!' is the actual parameter group (although there is only one string), which is passed to the method apply, and then Passed as a parameter to the initialization function initialize when calling initialize.