首页 > web前端 > 前端问答 > javascript中有没有多态

javascript中有没有多态

WBOY
发布: 2022-07-01 16:06:27
原创
1933 人浏览过

JavaScript中有多态;多态表示的是同一操作作用于不同的对象上面可以产生不同的解释和不同的执行结果,JavaScript中的多态体现在子类中可直接实现同名函数即可覆盖父类函数,JavaScript中的父类函数都可以直接覆盖。

javascript中有没有多态

本教程操作环境:windows10系统、javascript1.8.5版、Dell G3电脑。

javascript中有多态

含义

同一操作作用于不同的对象上面,可以产生不同的解释和不同的执行结果

比方说,我养了一只猫和一只狗,我对它们发出同一个指令 “叫一下”,猫会喵喵喵,而狗会汪汪汪,所以让它们叫一下就是同一操作,而叫声不同则是不同的执行结果。

用伪代码来实现就是这样的:

function getVoice(animals) {
    if(animals instanceof Cat){
        console.log('喵~');
        
    }
    if(animals instanceof Dog){
        console.log('汪~');
    }
}
class Cat {}
class Dog {}
getVoice(new Cat()); // '喵~'
getVoice(new Dog()); // '汪~'
登录后复制

那么如果我们想增加一个动物呢?再多加一个判断?那么之后我每次都想要加一个动物的叫声就都要修改一次 getVoice?是不是有点繁琐呢?

所以我们要想想如何解决这个问题~

对象的多态性

其实多态最根本的作用就是通过把过程化的条件语句转化为对象的多态性,从而消除这些条件分支语句。

通俗一点来讲,就是把 “做什么” 和 “谁去做以及怎么去做” 分离开,抽象概括就是把 “不变的事物” 和 “可能改变的事物” 分离开。

最开始我们举的例子中就可以拆分理解成这样:

不变的事物是:动物发出叫声 可能改变的事物是:什么动物发出什么样的叫声

那我们就可以把 “动物发出叫声” 这个动作分布到各个类上(封装到各个类上),然后在发出叫声的 getVoice 函数中调用"叫"这个动作就可以了。

上面这个例子就可以修改成这样啦~

function getVoice (animals) {
    if (animals.sound instanceof Function) {
        // 判断是否有animal.sound且该属性为函数
        animals.sound();
    }
}
class Cat {
    sound () {
        console.log('喵~');
    }
}
class Dog {
    sound () {
        console.log('汪~');
    }
}
getVoice(new Cat()); // '喵~'
getVoice(new Dog()); // '汪~'
登录后复制

多态的实际应用

多态在设计模式中应用得比较广泛,比如 组合模式 / 策略模式等等。~~

虽然我们在平时的开发中不太用的到,但是一旦我们涉及到一些设计模式的话,多态还是很有用的

JS的封装与多态

除了继承,封装与多态也是面向对象思想的组成部分。JS的封装、多态也是通过属性的灵活应用“模拟”实现的。

通过在类中设置公共属性,并在子类中实现,就可以模拟封装。

而多态的体现,则更为简单,在子类中直接实现同名函数即可覆盖(override)父类函数。JS中没有类似C#中的virtualde 关键字,所有父类函数都可以直接覆盖。

示例:

function calc(value1,value2){
this.data1=value1;
this.data2=value2; 
this.GetResult;
this.toString=function(){
if(this.GetResult)
return this.GetResult()+"";
return "0";
}
}
 
function sumCalc(value1,value2){
calc.call(this,value1,value2)
this.GetResult=function(){ 
return this.data1+this.data2;
}
}
function productCalc(value1,value2){
calc.call(this,value1,value2)
this.GetResult=function(){ 
return this.data1*this.data2;
}
}
var s=new sumCalc(2,3);
alert(s.toString());  //弹框5
var p=new productCalc(2,3);
alert(p.toString());  //弹框6
登录后复制

如上,sumCalc类与productCalc类都继承并实现了calc类,并实现了“抽象函数”GetResult()。这就是JS封装的实现方式。

另外,JS中的所有类都继承于Object,而Object有自己的toString()函数。所以,上面calc类的toString()函数实际上覆盖了原有的函数----多态的体现。

【相关推荐:javascript视频教程web前端

以上是javascript中有没有多态的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板