1, prototype
There is no concept of a class in JavaScript, but it is true that JavaScript can implement overloads, polymorphism, and inheritance. These implementations actually can be interpreted using the reference and variable scopes in JavaScript combined with prototype.
2, a simple example
Copy Code code as follows:
var Blog = function (name, URL) {
THIS.name = name;
This.url = URL;
};
Blog.prototype.jumpurl = ';
Blog.prototype.jump = function () {
window.location = This.jumpurl;
};
/*
* Equal to
Blog.prototype = {
Jumpurl: ',
Jump:function () {
window.location = This.jumpurl;
}
};
*/
var Rainman = new Blog (' jb51 ', ' http://www.jb51.net ');
var test = new Blog (' Server ', ' http://s.jb51.net ');
This is a very simple example, but it can well explain some of the things inside prototype, first look at the following graph of memory allocation:
you can see the following in the image above:
Prototype is just a property of a function, the type of which is an object.
Memory allocation Status:
The function blog has a prototype attribute, while the prototype attribute has a variable and a function;
Test and Rainman Two variables have name and URL two variables respectively;
Test and Rainman Two variables have a jumpurl variable and a jump function, but there is no memory allocated, they are references to Blog.protype
3, expand 1:
Copy Code code as follows:
Website.prototype = Blog.prototype
var Blog = function (name, URL) {
THIS.name = name;
This.url = Blogurl;
};
Blog.prototype.jumpurl = ';
Blog.prototype.jump = function () {
window.location = This.jumpurl;
};
var Rainman = new Blog (' jb51 ', ' http://www.jb51.net ');
var test = new Blog (' Server ', ' http://s.jb51.net ');
var Website = function () {};
Website.prototype = Blog.prototype;
var mysite = new Website ();
You can see the following in the image above:
"Website.prototype = Blog.prototype;" : website's prototype does not allocate memory, just refers to the blog's prototype attribute.
MySite's two properties also do not allocate memory, and only refer to Blog.prototype.jumpurl and Blog.prototype.jump respectively.
4, expand 2:
Copy Code code as follows:
Website.prototype = new Blog ()
var Blog = function () {};
Blog.prototype.jumpurl = ';
Blog.prototype.jump = function () {
window.location = This.jumpurl;
};
var Website = function () {};
Website.prototype = new Blog ();
var mysite = new Website ();
you can see the following in the image above:
Website prototype attribute, just an example of a blog (with Rainman=new blog (); Therefore, the prototype attribute of website has the Jumpurl variable and the Jump method.
MySite is an instance of website, whose jumpurl and jump methods are inherited from website prototype, and Web.prototype inherits from Blog.prototype (here is not so much an inheritance as a reference)
In the process of running the whole program, only one jumpurl variable and one jump method are allocated in memory.
5, new operator
The new operator in JavaScript.
The new operator in JavaScript is the creation of an object. How to use:
New constructor[(arguments)]
Where constructor is a required option. The constructor of the object. If the constructor has no arguments, you can omit the parentheses.
Arguments is optional. Any arguments passed to the new object constructor.
Description of new operator in JavaScript
The new operator performs the following tasks:
Creates an object that has no members.
Call the constructor for that object, passing a pointer to the newly created object as the this pointer.
The constructor then initializes the object based on the arguments passed to it.
Example
These are examples of usages of a valid new operator.
My_object = new Object;
My_array = new Array ();
My_date = new Date ("5 1996");
6. Other
In most JavaScript versions, the JS engine gives each function an empty prototype object, the prototype attribute.