Polymorphism in JavaScript(javascript中的多态)

本是古典何须时尚 2022-09-11 03:21 48阅读 0赞

## Introduction ##

**Polymorphism** in Object-Oriented Programming is the ability to create a variable, a function, or an object that has more than one form.

## Background ##

The primary usage of **Polymorphism** in Object-Oriented Programming is the ability of objects belonging to different types to respond to methods, fields, or property calls of the same name, each one according to an appropriate type-specific behaviour.

The programmer does not have to know the exact type of the object in advance, and so the exact behaviour is determined at run-time. This is what we call late binding or dynamic binding (this make **Polymorphism** a very cool feature). Requirements are such that, there must be properties with the same name and the same parameter sets in all the superclasses, subclasses and interfaces.

## Using the code ##

As far as **JavaScript** is concerned, we really don’t have interfaces as in other programming languages but we do have superclasses and subclasses. Going back to my article on [**JavaScript** Inheritance][JavaScript_Inheritance], we have created classes that inherit from others.

Let’s reuse [the same example][JavaScript_Inheritance], this time we will create a class Person then another class called Manager that inherits from Person. Both classes will include a method called `wake_up()`. We will then create objects of both types and put them in an array.

When we loop through that array, the system will call the function `wake_up()` on each of the objects and the implementation will be determined dynamically.

Let’s define our class Person.

![minus.gif][]  Collapse  |  [Copy Code][]

Person = function (id, name, age) {
                this.id = id;
                this.name = name;
                this.age = age;
               // alert('A new person has been accepted');
            }
            /* definition of our Person class */
            Person.prototype = {
                /** wake person up */
                wake_up: function () {
                    alert('A person is awake');
                },
                /** retrieve person's age */
                get_age: function () {
                    return this.age;
                }
            }

Now let us create an Inheritance class so that other classes can inherit from our class person. For more details and demo on inheritance, refer to [my article][JavaScript_Inheritance] on [**JavaScript** Inheritance][JavaScript_Inheritance] by clicking [here][JavaScript_Inheritance].

![minus.gif][]  Collapse  |  [Copy Code][]

Inheritance_Manager = {};  
               
    Inheritance_Manager.extend = function (subClass, baseClass) { 
                    function inheritance() { }
                    inheritance.prototype = baseClass.prototype;
                    subClass.prototype = new inheritance();
                    subClass.prototype.constructor = subClass;
                    subClass.baseConstructor = baseClass;
                    subClass.superClass = baseClass.prototype; }

Ok we are then going to define our class Manager as follows:

![minus.gif][]  Collapse  |  [Copy Code][]

Manager = function (id, name, age, salary) {
              Manager.baseConstructor.call(this, id, name, age);
              this.salary = salary;
              // alert('A manager has been registered.'); 
    }

Our class Manager will inherit from Person as follows:

![minus.gif][]  Collapse  |  [Copy Code][]

Inheritance_Manager.extend(Manager, Person);

Let’s add more functionality and overwrite our `wake_up()` function

![minus.gif][]  Collapse  |  [Copy Code][]

Manager.prototype = {
        wake_up: function () {
            alert('I am in control with Polymorphism');
        }
     }

Now we create an array and store in objects of type Person and Manager.

![minus.gif][]  Collapse  |  [Copy Code][]

var arrPeople = new Array();
    arrPeople[0] = new Person(1, 'Joe Tester', 26);
    arrPeople[1] = new Manager(1, 'Joe Tester', 26, '20.000');

See how the function `wake_up()` behaves based on the different objects we have. This is what we call**Polymorphism**. **Polymorphism** makes things so simple when you have many objects that present the same interface but different implementations.

![minus.gif][]  Collapse  |  [Copy Code][]

for (var i in arrPeople) {
       arrPeople[i].wake_up();
       alert(arrPeople[i].get_age());
    }

Many people don’t believe that **JavaScript** is fully-fledged Object Oriented Programming Language but I think**JavaScript** just does things its own way which is different from other languages. As we can see in the case of**Polymorphism** here, there is no difference with other programming languages. So it is fully polymorphic.

Here is the complete code:

![minus.gif][]  Collapse  |  [Copy Code][]

/** This is our Person class */
                Person = function (id, name, age) {
                    this.id = id;
                    this.name = name;
                    this.age = age;
                   // alert('A new person has been accepted');
                }
                /* definition of our Person class */
                Person.prototype = {
                    /** wake person up */
                    wake_up: function () {
                        alert('A person is awake');
                    },
                    /** retrieve person's age */
                    get_age: function () {
                        return this.age;
                    }
                }    
    
                Inheritance_Manager = {};   
    
                Inheritance_Manager.extend = function (subClass, baseClass) { 
                    function inheritance() { }
                    inheritance.prototype = baseClass.prototype;
                    subClass.prototype = new inheritance();
                    subClass.prototype.constructor = subClass;
                    subClass.baseConstructor = baseClass;
                    subClass.superClass = baseClass.prototype;
                }    
    
                Manager = function (id, name, age, salary) {
                    Manager.baseConstructor.call(this, id, name, age);
                    this.salary = salary;
                   // alert('A manager has been registered.');
                }    
    
                Inheritance_Manager.extend(Manager, Person);    
    
                Manager.prototype = {
                    wake_up: function () {
                        alert('I am in control');
                    }
                }    
    
                var arrPeople = new Array(); 
                arrPeople[0] = new Person(1, 'Joe Tester', 26);
                arrPeople[1] = new Manager(1, 'Joe Tester', 26, '20.000');    
    
                for (var i in arrPeople) {
                    arrPeople[i].wake_up();
                    alert(arrPeople[i].get_age());
                }

## License ##

This article, along with any associated source code and files, is licensed under [The Code Project Open License (CPOL)][The Code Project Open License _CPOL]

转贴：[http://www.codeproject.com/Articles/315169/Polymorphism-in-JavaScript][http_www.codeproject.com_Articles_315169_Polymorphism-in-JavaScript]

注：

运行代码的时候报错，应该是把上面的一段代码：

Manager.prototype = {
                    wake_up: function () {
                        alert('I am in control');
                    }
                }

改成：

Manager.prototype.wake_up = function(){
        alert('I am in control');
    };

[JavaScript_Inheritance]: http://www.cyberminds.co.uk/blog/articles/how-to-implement-javascript-inheritance.aspx
[minus.gif]: /images/20220828/edce73c9635645459ffe7186a5ab7a92.png
[Copy Code]: http://www.codeproject.com/Articles/315169/Polymorphism-in-JavaScript#
[The Code Project Open License _CPOL]: http://www.codeproject.com/info/cpol10.aspx
[http_www.codeproject.com_Articles_315169_Polymorphism-in-JavaScript]: http://www.codeproject.com/Articles/315169/Polymorphism-in-JavaScript

发表评论取消回复

表情：

评论列表（有 0 条评论，48人围观）

还没有评论，来说两句吧...

相关阅读

相关多态(polymorphism) 与对象的转型

一、多态多态指的是同一个方法调用，由于对象不同可能会有不同的行为。多态的要点： 1. 多态是方法的多态，不是属性的多态(多态与属性无关)。 ...

阳光穿透心脏的1/2处/ 2024年04月18日 21:14/ 0 赞/ 89 阅读

相关 Java--多态(polymorphic),上下转型，多态好处弊端

多态(polymorphic)：事物存在的多种形态多态前提 (1)要有继承关系 (2)要有方法重写 (3)要有父类引用指向子类对象多态好处 (1)提

素颜马尾好姑娘i/ 2023年10月17日 10:48/ 0 赞/ 165 阅读

相关 Polymorphism in JavaScript(javascript中的多态)

Introduction Polymorphism in Object-Oriented Programming is the ability to create a v

本是古典何须时尚/ 2022年09月11日 03:21/ 0 赞/ 49 阅读

相关 OOP 三大特征之多态（Polymorphism）

OOP三大特性最重要的：多态。很多程序员虽然在用支持OOP的语言，但却从未用过多态。只使用封装、继承的编程方式，称为基于对象（Object Based）编程

落日映苍穹つ/ 2022年08月28日 09:48/ 0 赞/ 208 阅读

相关 java多态polymorphic多态的理解四之多态的优点

java多态的优点之一就是提高了代码的扩展性（由多态保证）用代码举个例子 class Demon_Animal{ public static void

浅浅的花香味﹌/ 2022年06月16日 01:22/ 0 赞/ 291 阅读

相关 java多态polymorphic多态的理解二

java多态中的成员访问特点之成员变量，成员方法 class Demo_polymorphic{ public static void main(Str

拼搏现实的明天。/ 2022年06月16日 01:21/ 0 赞/ 401 阅读

相关 java多态polymorphic多态的理解一

温故而知新 polymorphic 多种形态的意思 A :多态概述事物存在多种形态（比如有一只狗在吃馍馍，你可以说狗在吃馍也

ゝ一世哀愁。/ 2022年06月16日 01:20/ 0 赞/ 306 阅读

相关 Java之多态（Polymorphism）与虚方法（Virtual Method）

多态（Polymorphism）多态是同一个行为具有多个不同表现形式或形态的能力。多态就是同一个接口，使用不同的实例而执行不同操作。

逃离我推掉我的手/ 2022年05月21日 11:39/ 0 赞/ 115 阅读

相关 Python面向对象编程（Object Oriented Programming，OOP）之多态（Polymorphism）

多态（Polymorphism）同一操作作用于不同对象，可以有不同的解释，有不同的执行结果，这就是多态，简单来说就是：父类的引用指向子类对象。 Pyhon不支持Jav

柔情只为你懂/ 2022年05月17日 23:48/ 0 赞/ 200 阅读

相关 Think in Java——多态

多态调用 1. 将一个方法调用和一个方法主体关联起来被称作绑定。绑定分为前期绑定与后期绑定，多态方法的具体调用依靠前期绑定是不行的，编译器不知道对象的具体类型无

我不是女神ヾ/ 2022年03月22日 03:15/ 0 赞/ 267 阅读