多态的简单解释是，调用相同的接口传入相同原创内容，盗版必究。转载请注明出处：www.tangshuang.net的参数，由于被调用的设备不同产生了不同的【本文受版权保护】【版权所有】唐霜 www.tangshuang.net副作用/效果。例如同样是console.【本文首发于唐霜的博客】【版权所有，侵权必究】error，在chrome浏览器里面和在【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。nodejs的command inlin未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。e interface里面，效果就不同。【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。基于这一特性，我们可以对接口进行抽象，简【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net单的例子如下：

interface Person {
  sing(song: object): string;
}

function sing(person: Person, song: object): string {
  return person.sing(song)
}

上面的代码里面，我们创建了一个sing函未经授权，禁止复制转载。【版权所有，侵权必究】数，它接收person这个对象，并调用它本文版权归作者所有，未经授权不得转载。【本文受版权保护】的sing方法。由于类型的约束，接收的p本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.neterson一定会有sing方法。但是，这【本文受版权保护】【版权所有，侵权必究】个person.sing这个方法会做什么转载请注明出处：www.tangshuang.net【本文受版权保护】事呢？对于sing这个函数它并不知道，它【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】只是调用了person的sing方法而已著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】。所以，我们基于多态实现person。

class Person1 implement Person {
  sing(song: object) {
    const { lyric } = song
    console.log(lyric) // 打印到屏幕上
    return lyric
  }
}

class Person2 implement Person {
  sing(song: object) {
    const { lyric } = song
    Audio.paly(lyric) // 播放声音
    return lyric
  }
}

两个类实现了相同的Person接口，但是【原创内容，转载请注明出处】原创内容，盗版必究。在实现的时候，又使用了不同的副作用，这就未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】是多态。

那么，多态有什么用呢？对前端有什么影响呢原创内容，盗版必究。【本文首发于唐霜的博客】？

第一点，是代码写法上的变化。原创内容，盗版必究。

以前我们喜欢extends来得到一个具体未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。的类，比如 class Person 有【版权所有】唐霜 www.tangshuang.net【作者：唐霜】一个 sing 方法，我们通过 exte原创内容，盗版必究。转载请注明出处：www.tangshuang.netnds 来覆盖这个方法。这也就意味着，你转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net的代码里面，一定会引入原来的 Perso【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。n，并且原来的 Person 里面的 s本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】ing 方法一定会在最终打包的代码里面，【本文受版权保护】本文作者：唐霜，转载请注明出处。虽然它永远都用不到。而新的写法是在调用函【本文受版权保护】著作权归作者所有，禁止商业用途转载。数的时候，把类的实例传入进去，这把引入模本文版权归作者所有，未经授权不得转载。【转载请注明来源】块的工作交给函数外部去做，这就让到处这个【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】函数的模块的代码瞬间减少了。

第二点，是架构设计上的变化。【版权所有】唐霜 www.tangshuang.net

以前我在架设react项目时，会以Vie本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。w作为入口，应用的一切都是先有View，【本文受版权保护】【作者：唐霜】在View中去引入需要用到的Model等【本文首发于唐霜的博客】【版权所有，侵权必究】其他模块，这也就意味着，应用以View为本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。顶层入口，所有的代码层层引入，绑定在了一【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。起。现在，我们利用多态，换一个角度。我们本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.net让开发者自己写入口，这个入口我们称为Co【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。ntroller，我们提供的框架不是让V【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。iew去使用Model，而是反过来，让C【本文受版权保护】【未经授权禁止转载】ontroller去使用View，让Mo著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.netdel去使用View。这个场景下面，Vi【版权所有，侵权必究】【作者：唐霜】ew必须按照接口约束提供接口给Model原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.net使用，这个时候，我们写Model就可以反【作者：唐霜】【关注微信公众号：wwwtangshuangnet】过来考虑控制View（这里的Model是本文版权归作者所有，未经授权不得转载。【转载请注明来源】指ViewModel）。这种转变非常神奇【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】，从框架层面，它颠覆了传统前端的开发方式本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。。