Javascript prototype implementation

Source: Internet
Author: User

Javascript prototype implementation

Author: Jeff Yan, blueswing. Liu)


Mode:

Prototype (original or prototype) Definition:Specify the type of the object to be created by providing a prototype object, and then use the prototype object method to create more objects of the same type. The original model mode belongs to the object creation mode. Javascript implementation:In Java, objects are inherited from Java. lang. object, while Java. lang. the object provides the clone method. If the interface cloneable is implemented, clone is supported. Otherwise, an exception is thrown. At this point, JavaScript is very similar. All objects are inherited from objects. However, objects do not support the clone method, but we can implement the clone method through expanddo for JavaScript, in this way, the clone method is implemented for all subsequent object creation. Because JavaScript itself does not provide the clone method, and the object is assigned a value such as var a = new object (); var B = A, such code A and B point to the same object, to create an object, you must use NewTherefore, in the clone implementation process, I defined a constructor clonemodel internally and specified its parent object as the object to be cloned. ThisKeyword: we create an object based on the defined constructor clonemodel. Because there is no code in the constructor, the newly created object actually says that all implementations are in the parent object, that is, the object to be cloned. So far, we have created an object to be copied, but all the values point to the parent object. In the object-oriented method of JavaScript, we have discussed that if the value of the parent object is not overwritten, it directly points to the parent object, prototype pattern requires that the internal value of the cloned object should not be relevant. As long as the value is assigned once, the value of objclone will be in its own memory space, rather than pointing to the parent object. Based on this consideration, the objclone [v] = objclone [v]; statement is to copy the value of the parent object to its memory by overwriting. (The Memory mentioned here should be logical) Implementation of deep ReplicationAfter completing the above work, we only implement the shortest copy, and the object still points to the reference of the object, in this case, you can call the clone method pointing to the object to obtain the attribute object of the cloned object (because you do not know how to say it ). Objclone [v] = objclone [v]. Clone (); this code completes this function.

Clone method implementation
//////////////////////////////////////// /// // Add the clone method for the object, because the top-level object of all objects is object //, all user-defined objects implement the clone method ///////////////// //////////////////////////////////////// //// // object.Prototype. Clone =Function(){FunctionClonemodel () {} clonemodel.Prototype=This;VaRObjclone =NewClonemodel ();VaRStrmsg = "";For(VInObjclone ){Switch(TypeofObjclone [v]) {Case"Function": // if it is a method, clone is not required.Break;Case"Object ": //////////////////////////////////////// /// // if it is an object, clone is used to obtain it again. The purpose of this operation is to perform in-depth clone // because Javascript is an object-based language, otherwise, the internal object is directed to the original reference //////////////////////////////// /// // objclone [v] = objclone [v]. clone ();Break;Default: //////////////////////////////////////// //// // All of the other data types will be re-created assign a value // The purpose of this operation is to ensure that the value is stored in the memory in the space of the new object // instead of pointing to a refrence of the parent object ///////// //////////////////////////////////////// /// // objclone [v] = objclone [v];}ReturnObjclone ;}

Definition of object classes

function BookInfo(vCaption){ this.Caption=vCaption;  var curPage=0; this.setPage=function(vData){  curPage=vData; } this.getPage=function(){  return curPage; } }

Test code

/// // Test bookinfo's clone method ////////////////////////////////////FunctionTest (){VaRObjtest =NewBookinfo ("javascript prototype pattern"); objtest. set page (1000); objtest. author = "ruhong. liu "; // object expanddo showobject (objtest," original object "); // clone object from objtestVaRObjcloned = objtest. clone (); showobject (objcloned, "cloned object"); // if you changed the objtest's caption // you can find objcloned's caption has be changed objtest. caption = "changed base object"; // show message showobject (objtest, "original object after caption modification"); showobject (objcloned, "clone object after caption modification "); /* // ---------- this code does not work ---------------------- // now you can change objcloned's caption objcloned. caption = "Hello, Jeff. yan "; // show message showobject (objtest," original object after clone object caption modification "); showobject (objcloned," clone object caption modified ");*/}FunctionShowobject (O, vcaption ){VaRStrmsg = vcaption + "\ n"; strmsg + = "currentpage:" + O. getpage () + "\ n"; strmsg + = "caption:" + O. caption + "\ n"; strmsg + = "expanddo property Author:" + O. author; alert (strmsg );}

Conclusion: According to my current understanding and testing, I think the prototype keyword is not implemented in the prototype mode, which can be verified through parent object.

Author's blog:Http://blog.csdn.net/liuruhong/Related Articles

War and Peace-overall browser Development
Welcome to the RIA era beyond the heyday of browser Development
What is the end of browser in the Longhorn age? -- About aveon and XAML
Will C ++/CLI impact C?
Join hands in the competition-write to Java 1.5 and. NET 2.0

Comment on this article
Windseeds)
In addition, we recommend that you do not write the variable as VAR curpage,

Some problems may occur. I cannot remember the specific problems I encountered before in development.

It is a standard practice to distinguish private and public by underline. The object of JS itself is like this.

For example, object. That is to say

Private variable: This. _ curpage = 0;

Public variable: This. curpange = 0;

Windseeds)
This article is hard to write, but it is actually not that complicated. Prototype is actually an object chain.
Liuruhong(2004-01-01)
I remember that I was not interested in this aspect when I met Jeff, but later I found that the design pattern skills could still be used in the Web library, although I do not agree that there are too many complicated client scripts. However, the complexity is relative. If it is in your application development, I do not recommend that Programmers spend too much effort on web scripts, however, if you want to write some common library files for other developers, I think the design skills are more important than its functional implementation skills. You should also be able to see a lot of web scripts. If some functions cannot be reused or scalable, it seems more appropriate to provide some scripts for teaching purposes. On the other hand, the learning of design pattern is an important foundation for component developers, whether it is ActiveX development in Windows or library in open source form, for Web UI library developers, there seems to be no essential difference
Leeeel(2003-12-29)
Be sure to raise js to this realm, which is really high!

The problem is that the JavaScript code on the client is too long, and the download data and memory usage are too large.

Can JS be simply used in development?
Kingdomzhf(2003-12-27)
Objects are further copied until they are of the function and primitive types (not objects)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.