Java Program Ape's JavaScript Learning notes (5--prototype and object built-in methods)

plan to complete this note in the following order, for example:

2. Java Program Ape's JavaScript Learning notes (concept)
4. Java Program Ape's JavaScript Learning notes (2--property copy and inheritance)
6. Java Program Ape's JavaScript Learning Note (3--this/call/apply)
8. Java Program Ape's JavaScript Learning Note (4--this/closure/getter/setter)
10. Java Program Ape's JavaScript Learning Note (5--prototype)
12. Java Program Ape's JavaScript Learning Note (6--Object-oriented simulation)
14. Java Program Ape's JavaScript Learning notes (7--jquery basic mechanism)
16. Java Program Ape's JavaScript learning Note (8--jquery selector)
18. Java Program Ape's JavaScript Learning Note (9--jquery tool method)
20. Java Program Ape's JavaScript Learning notes (10--jquery-at "class" level)
22. Java Program Ape's JavaScript Learning notes (11--jquery-at "object" level)
24. Java Program Ape's JavaScript Learning note (12--jquery-extension selector)
26. Java Program Ape's JavaScript Learning Note (13--jquery UI)
28. Java Program Ape's JavaScript Learning notes (14--extended jquery UI)

This is the 5th note, a chat about the properties and methods of prototype, built-in object objects, and object objects.

Author Blog: Http://blog.csdn.net/stationxp

Author Micro-Blog: http://weibo.com/liuhailong2008

Reprint please obtain the author permission

1, prototypein the previous article, we learned how to implement the access permission to control object properties, and implemented the encapsulation of object properties.

In the 1th chapter, we extend the function prototype by extending the entire object created by the function. Inheritance is also implemented using the prototype property.

In combination with the previous studies, let's look at how to implement a similar function like the following Java code.

public class Uiobject{private String _author = ' Liuhailong ';p rivate string _utype  = ' UiObject ';p rivate string _uname< c2/>= ' UiObject ';p ublic UiObject (String name) {this._uname = name;} public void Setuname (name) {this._uname = name;} public string Getauthor () {return this._author;} public string Getutype () {return this._utype;} public string Getuname () {return this._uname;} }

Try writing code such as the following:

function UiObject (uname) {    var _uname = uname | | ' Rootuiobject ';}  Uiobject.prototype = {      _utype: "UiObject",      _author: ' Liuhailong ',        get Utype () {return this._utype;},    Get author () {return this._author;},        get Uname () {return this._uname;},    set uname (uname) {this._uname = uname;},        render:function () {          console.log (' render me! ');      }  }  var uiroot = new UiObject (); uiroot.uname = ' new name '; uiroot.utype = ' new type '; Uiroot.author = ' new Autho '; Console.log (UI Root.uname); Output:new Nameconsole.log (Uiroot.utype); Output:UiObjectconsole.log (Uiroot.author);//Output:liuhailong

Prototype and closures are used in the code to achieve results in terms of output.

This code will serve as a template for my future implementation class, and as I accumulate, I will try to update the template to find best practices for defining classes in JavaScript.

The importance of prototype provides strong support for basic type definitions for a class object (Function) in JavaScript.

And through the prototype for function functions and its convenient and easy to expand function, it is a powerful.

2. Built-in object objects

Look at the following code:

function UiObject () {}var UI = new UiObject (); Console.log (ui.tostring ());   Output: [object Object]var o = {};console.log (o.tostring ()); Output: [Object Object]

Two "empty" objects are defined, and the ToString method is called to return the value, should not return undefined?

Believe the Java program the ape smiled and guessed what had happened.

Through Firefox debugging observation, two empty objects are really "empty". What's going on?

Assuming that only the property is owned, and that two objects are indeed "empty", their prototype should be assigned by default.

Remember the 4 attributes of the property we talked about last? One of the features is whether it can be traversed. For example, the prototype attribute is not traversed.

Instead of using IE debugging, you see that the prototype property of two objects (gray, should be due to non-traversal) and the default prototype internal structure.

For example, as seen in the.

Observing the types of each object, it can be found that the prototype type of the prototype of the UiObject, UI is object, and the type of O itself and prototype is object.

Object has revealed the true face of the Buddha, expanding to see its internal properties (fake) and methods.

3. Properties and methods of object

The types you can see are function, some can be overridden by assignments, and some cannot.

Did not see the last mentioned Object.defineproperty, also did not see Object.create (), may be the browser to ECMAScript 5 support for different reasons, it may be that the debugger for some reason is not listed.

You can ask the mother to understand the properties and methods of object, it should be noted that the above list is not a complete set.

Java Program Ape's JavaScript Learning notes (5--prototype and object built-in methods)