JS also plays OO inheritance _ javascript skills

Source: Internet
Author: User
JS is also used to inherit from OO, so I still come here ^_^
Carefree ~~ Long time overdue ............ Paste a principle of Dongdong,

<Script language = "JavaScript"> <! -- Function Base (v_sBaseName) {this. baseName = v_sBaseName this. baseMethod = BaseMethod; function BaseMethod (v_sStr) {alert ("BaseName:" + this. baseName + "\ n" + "ExtendStr:" + v_sStr) ;}} function Son (v_sName) {this. name = v_sName this. baseName = this. name; this. method = Method; function Method (v_sStr) {alert ("Name:" + this. name + "\ n" + "ExtendStr:" + v_sStr) ;}} Son. prototype = new Base (); var O = new Son ("initialization string") O. method ("Method additional string"); O. baseMethod ("BaseMethod additional string"); // --> SCRIPT
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


(Stroll's heel)


Of course, you can also use the following methods without "plug-ins ...... But Script5.5 is required.
For example, the call method and the apply method ...... The following describes how to use the call method.
Apply is similar, but the parameters called later are arrays. For details, refer to MSScript5.6.

Bencalie, do you still know how to use call apply? This is a perfect answer, right?

<Script language = "JavaScript"> <! -- Function Base (v_sBaseName) {this. baseName = v_sBaseName this. baseMethod = BaseMethod; function BaseMethod (v_sStr) {alert ("BaseName:" + this. baseName + "\ n" + "ExtendStr:" + v_sStr) ;}} function Son (v_sName) {Base. call (this, v_sName) this. name = v_sName this. method = Method; function Method (v_sStr) {alert ("Name:" + this. name + "\ n" + "ExtendStr:" + v_sStr) ;}} var O = new Son ("initialization string") O. method ("Method additional string"); O. baseMethod ("BaseMethod additional string"); // --> SCRIPT
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


(Stroll's heel)


Observe the variable this. Prototype of the so-called "inherited object" (I did not pay attention to it at first, and thought it was a keyword ...... I am struggling to find information)

This. Prototype = new JSObject (); // note: this is not a lower-case prototype.
This. Prototype. Speak = function (s ){.......}
Return this. Prototype is actually a JSPObject object after constructing an object,
It is not a JSHuman object, so var o = new JSHuman ();
O this instance cannot access members of JSHuman.

// Original westfly // do not ask me what I use. You can call function JSObject () {this when you need it one day. _ Name = "JSObject"; this. set_Name = function (Value) {this. _ Name = Value;} this. get_Name = function () {return this. _ Name ;}} function JSHuman () // extends JSObject {this. prototype = new JSObject (); // note: this is not a lower-case prototype this. prototype. speak = function (s) {alert (s);} return this. prototype;} var o = new JSHuman (); o. set_Name ("westfly"); o. speak (o. get_Name ());
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


(Follow-up of bencalie)


Stroll: I have read your answer, and I am very sorry.

You have raised the question again, so this parameter Base. call (this, v_sName) is used as Base. apply (this): How can I transfer v_sName into Base. baseName, but I am not familiar with the use of apply.

Base. apply (this, [v_sName]) is used most successfully.

In this case, the call and apply operation numbers are different?
(Roman's heel)

<Script language = jscript> // original westfly // do not ask me what I use. When you need it one day, you can think of it as function JSObject () {this. _ Name = "JSObject"; this. set_Name = function (Value) {this. _ Name = Value;} this. get_Name = function () {return this. _ Name;} this. speak = function () {alert ("wangwang")} function JSHuman () // extends JSObject {this. prototype = new JSObject (); // note: this is not a lower-case prototype this. prototype. speak = function (s) {alert (s);} return this. prototype;} var o = new JSHuman (); o. set_Name ("westfly"); o. speak (o. get_Name (); script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


(Follow-up of bencalie)
After a while, is there a simple OOP re-indexing function?

<Script language = "JavaScript"> <! -- Function Base (v_sBaseName) {this. baseName = v_sBaseName this. baseMethod = BaseMethod; function BaseMethod (v_sStr) {alert ("BaseName:" + this. baseName + "\ n" + "ExtendStr:" + v_sStr) ;}} function Son (v_sName) {Base. call (this, v_sName) this. base = new Base (v_sName) // create a base object entity so that the function of the Base object can be used after deduplication this. name = v_sName this. method = Method; function Method (v_sStr) {alert ("Name:" + this. name + "\ n" + "ExtendStr:" + v_sStr);} this. baseMethod = BaseMethod; function BaseMethod (v_sStr) {alert ("Override BaseName:" + this. baseName + "\ n" + "Override ExtendStr:" + v_sStr) ;}} var O = new Son ("initialization string") O. method ("Method additional string"); O. baseMethod ("BaseMethod appended string after re-encoding"); O. base. baseMethod ("BaseMethod additional string"); // --> SCRIPT
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


(Stroll's heel)


To bencalie, yes, it is.

However, do not think that applying is troublesome. In fact, if the order of the construction parameters of the two objects is the same, you can do this.
Base. apply (this, arguments) is very convenient?

Attached: (it takes 30 seconds to paste it ~~)
However, if you add a new Base (), you cannot inherit the new Base () method. Actually, you can inherit the method. The call of O. BaseMethod () is exactly ^_^.
To: bencalie (Roman's heel)


The method of the base object is overwritten. Why does stroll say var o = new JSHuman (); o this instance cannot access members of JSHuman?
Please refer to the following generation:

Script/westfly original // do not ask me what I use. When you need it one day, you can think of it and function JSObject () {this. _ Name = "JSObject"; this. set_Name = function (Value) {this. _ Name = Value;} this. get_Name = function () {return this. _ Name ;}} function JSHuman () // extends JSObject {this. JSHumanName = "This is JSHumanName" // sets the SHumanName of JSHuman. prototype = new JSObject (); this. prototype. speak = function (s) {alert (s);} return this. prototype;} var o = new JSHuman (); o. set_Name ("westfly"); o. speak (o. get_Name (); o. speak (o. JSHumanName); // The caller of JSHuman SHumanName, but the script fails.
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


Stroll, the method is correct, but I added BaseMethod () in the Son's photo creation function ()

In fact, O. baseMethod () uses the BaseMethod () method that is not the Base object, but the BaseMethod () method of the Son object, so I use a Base example as a member base of Son.

Son example. base. BaseMethod ()

To reference the BaseMethod () method of the Base.


In addition, I like the following sentence: Base. apply (this, arguments)
Haha ...... Received ~~ (Stroll's heel)


Although JavaScript has no pointer ...... I don't know how to construct a "parent object" at the same time. If a "sub-object" has another function to pass an object parameter, can I call the corresponding methods using the methods shared by the parent and child nodes? I have not yet understood whether this in JS is equivalent to a virtual address pointer?
Therefore, the above questions can be solved after the method is replaced (although this confusion is a problem, it is logical :)

And ...... If the member has a function to construct the object, will it also construct the object like c ++ and then execute other functions? This may or it must be based on the top to bottom ~~~~ Language requirements? Never tried

Have you tried to inherit multiple parent objects? But it's not hard to think of this step ...... (Tree inheritance)

These are even questions ......
Related Article

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.