js 中面向对象的多态

什么是多态:

  实际上是不同对象作用与同一操作产生不同的效果。多态的思想实际上是把“想做什么”和“谁去做“分开,多态的好处是什么呢?为什么要多态?我们来看看

Martin Fowler 在《重构:改善既有代码的设计》里写到:

  多态的最根本好处在于,你不必再向对象询问“你是什么类型”而后根据得到的答 案调用对象的某个行为——你只管调用该行为就是了,其他的一切多态机制都会为你安 排妥当。 换句话说,多态最根本的作用就是通过把过程化的条件分支语句转化为对象的多态性,从而 消除这些条件分支语句 。、

假设我们要编写一个地图应用,现在有两家可选的地图 API 提供商供我们接入自己的应用。 就像我们介入一个地图APi的调用

var googleMap = {    show: function () {        console.log(‘开始渲染谷歌地图‘);    }};

var renderMap = function () {    googleMap.show();

};renderMap(); // 输出:开始渲染谷歌地图 由于某些原因,我们要换一下其他的API接口,为了让 renderMap 函数保持一定的弹性, 我们用一些条件分支来让 renderMap 函数同时支持两种地图的接口:
var googleMap = {    show: function () {        console.log(‘开始渲染谷歌地图‘);    }};var bdMap = {    show: function () {        console.log(‘开始渲染百度地图‘);    }};var renderMap = function (type) {    if (type === ‘google‘) {        googleMap.show();    } else if (type === ‘bd‘) {        dbMap.show();    }};renderMap(‘google‘); // 输出:开始渲染谷歌地图 renderMap( ‘baidu‘ ); // 输出:开始渲染百度地图

可以看到,虽然 renderMap 函数目前保持了一定的弹性,但这种弹性是很脆弱的,一旦需要 替换成其他的地图接口,那无疑必须得改动 renderMap 函数,继续往里面堆砌条件分支语句。  我们还是先把程序中相同的部分抽象出来,那就是显示某个地图:

var renderMap = function( map ){    if ( map.show instanceof Function ){        map.show(); }};renderMap( googleMap ); // 输出:开始渲染谷歌地图 renderMap( bdMap ); // 输出:开始渲染百度地图

现在来找找这段代码中的多态性。当我们向两种地图对象分别发出“展示地 图”的消息时,会分别调用它们的 show 方法,就会产生各自不同的执行结果。对象的多态性提示我们,“做什么”和“怎么去做”是可以分开的,即使以后增加了其他地图,renderMap 函数仍 然不需要做任何改变,如下所示:

var sosoMap = {    show: function(){        console.log( ‘开始渲染搜搜地图‘ );    }renderMap( sosoMap ); // 输出:开始渲染搜搜地图
 
时间: 2024-10-12 02:27:38

js 中面向对象的多态的相关文章

js中面向对象(创建对象的几种方式)

1.面向对象编程(OOP)的特点: 抽象:抓住核心问题 封装:只能通过对象来访问方法 继承:从已有的对象下继承出新的对象 多态:多对象的不同形态 注:本文引用于 http://www.cnblogs.com/yuxingyoucan/p/5797142.html 一.创建对象的几种方式 javascript 创建对象简单的来说,无非就是使用内置对象或各种自定义对象,当然还可以使用JSON,但写法有很多,也能混合使用. 1.工厂方式创建对象:面向对象中的封装函数(内置对象) function cr

js中面向对象编程

一.理解对象: 第一种:基于Object对象 var person = new Object(); person.name = 'My Name'; person.age = 18; person.getName = function(){ return this.name; } 第二种:对象字面量方式(比较清楚的查找对象包含的属性及方法) var person = { name : 'My name', age : 18, getName : function(){ return this.n

JS 中面向对象的5种写法和拓展JS对象的写法

面向对象的JAVA  最开始当然是对象的定义了 收集了以下的五种写法 //第1种写法 function Circle(r) { this.r = r; } Circle.PI = 3.14159; Circle.prototype.area = function() { return Circle.PI * this.r * this.r; } var c = new Circle(1.0); alert(c.area()); //第2种写法 var Circle = function() {

JS中面向对象的,对象理解、构造函数、原型、原型链

6.1 理解对象 6.1.1 对象属性类型 ECMS属性有两种类型:数据属性和访问器属性 1 数据属性 [[configurable]] 表示能否通过Delete 删除属性从而从新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性.对象上定义的属性默认值为true [[enumerable]] 表示能否通过for-in循环返回属性.直接在对象上定义的属性,它们的这个特性默认值为true [[writable]] 表示能否修改属性值.像前面例子中那样直接在对象上定义的属性,它们默认值为t

js中面向对象

继承方式: 1.拷贝继承:通用型  有new无new都可以用 2.类式继承:new构造函数 3.原型继承:无new的对象 属性继承:调用父类的构造函数call 方法继承:用for in的形式 拷贝继承(jq也用拷贝继承) var a = { name: '小米' }; //拷贝继承 function extend(obj1, obj2) { for (var attr in obj2) { obj1[attr] = obj2[attr]; } } //原型继承 var b=cloneObj(a)

js中面向对象的写法

function Circle(r){ this.r = r; }//构造(实例对象的)函数[思路二:这是一个类] Circle.PI = 3.14159; //属性 Circle.prototype.area = function (){ //方法 return Circle.PI*this.r*this.r; } var c = new Circle(5.0);//对象实例化+传参 [思路二:这是类的实例化] alert( c.area() ); //return (3.14159*5*5)

《JS中的面向对象技术》

内容要点: 1.什么是对象:JS权威指南学习总结-第六章 ,(有句话:一切都是对象) 2.什么面向对象 使用对象时,只关注对象提供的功能,不关注其内部细节,比如jQuery.面向对象是一种通用思想,并非只有编程中使用,任何事情都可以用. 3.JS中面向对象三大特征: 封装.继承.多态 4.JS自定义对象(三大对象两大属性): 4.1创建对象方式:方法1:对象初始化的方法,就是通过对象直接量创建的对象.方法2:通过关键字new和构造函数的方法创建对象 4.2对象属性定义:私有属性.对象属性.类属性

轻松理解JS中的面向对象,顺便搞懂prototype和__proto__的原理介绍

这篇文章主要讲一下JS中面向对象以及 __proto__,ptototype和construcator,这几个概念都是相关的,所以一起讲了. 在讲这个之前我们先来说说类,了解面向对象的朋友应该都知道,如果我要定义一个通用的类型我可以使用类(class).比如在java中我们可以这样定义一个类: public class Puppy{ int puppyAge; public Puppy(age){ puppyAge = age; } public void say() { System.out.

JS中如何实现属性和方法的继承

JS中面向对象的实现: function Person(name,color){ this.name = name; this.color = color; } Person.prototype.showName = function(){ alert(this.name); } Person.prototype.showColor = function(){ alert(this.color); } function Worker(name,color,job,age){ Person.app