Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to implement inheritance by Javascript

2025-01-16 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "how to achieve inheritance in Javascript". The editor shows you the operation process through an actual case. The operation method is simple, fast and practical. I hope this article "how to achieve inheritance in Javascript" can help you solve the problem.

1. Constructor model

[url=] file:///C:/Users/i037145/AppData/Local/Temp/msohtmlclip1/01/clip_image001.gif[/url]

Function Person (name,age,job) {

This.name = name

This.age = age

This.job = job

This.sayName = function () {

Alert (this.name)

}

}

Varperson1 = new Person ("Nicholas", 29, "Software Engineer")

Varperson2 = new Person ("Greg", 27, "Doctor")

Person1.sayName (); / / "Nicholas"

Person2.sayName (); / / "Greg"

Alert (person1.constructor = = Person); / / true

Alert (person2.constructor = = Person); / / true

Alert (person1 instanceof Object); / / true

Alert (person1 instanceof Person); / / true

Alert (person2 instanceof Object); / / true

Alert (person2 instanceof Person); / / true

[url=] file:///C:/Users/i037145/AppData/Local/Temp/msohtmlclip1/01/clip_image001.gif[/url]

Question:

Each method is recreated on each instance. In the previous example, both person1 and person2 have a method called sayName (), but those two methods are not instances of the same Function.

Alert (person1.sayName = = person2.sayName); / / false

However, it is really not necessary to create two Function instances that accomplish the same task; and with this objects in place, there is no need to bind a function to a specific object before executing the code. Therefore, you can solve this problem by moving the function definition outside the constructor:

[url=] file:///C:/Users/i037145/AppData/Local/Temp/msohtmlclip1/01/clip_image001.gif[/url]

Function Person (name,age,job) {

This.name = name

This.age = age

This.job = job

This.sayName = sayName

}

FunctionsayName () {

Alert (this.name)

}

Varperson1 = new Person ("Nicholas", 29, "Software Engineer")

Varperson2 = new Person ("Greg", 27, "Doctor")

Alert (person1.sayName = = person2.sayName); / / true

[url=] file:///C:/Users/i037145/AppData/Local/Temp/msohtmlclip1/01/clip_image001.gif[/url]

Problem: functions defined in the global scope can actually only be called by an object, which makes the global scope a bit unworthy of its name. What is even more unacceptable is that if an object needs to define a lot of methods, then it has to define a lot of global functions, so our custom reference type has no encapsulation at all.

2. Prototype model

3. Combine constructor pattern and prototype pattern

4. Prototype chain

5. Combination inheritance

6. Prototype inheritance

7. Parasitic inheritance

8. Parasitic combinatorial inheritance

9. Copy combinatorial inheritance

This is the end of the introduction on "how to achieve inheritance in Javascript". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report