在面向对象的Javascript编程中,希望代码优雅有高效是非常重要的。javascript中不存在类的概念,只有对象。要想把Javascript代码写的像java 或者C++一样优雅,就得考虑如何去实现,同时也要考虑性能和高效。定义javascript对象的方式有很多,继承的方式也很多。通过不断地实践,推荐如下的方法:
1.Javascript对象的定义采用混合方式【构造函数 +原型方式(prototype)】
(1)通过构造函数方式定义对象的所有非函数属性
(2)用原型方式定义对象的函数属性
采用这种方式,所有的属性都是单一对象私有的,而方法则是所有对象公有的,对象之间的属性不相互干扰,各个对象间共享同一个方法。
//使用原型+构造函数方式来定义对象 //构造函数定义对象的非函数属性 function Person() { this.username = new Array(); this.password = "123"; } //通过原型方式定义对象的函数 Person.prototype.getInfo = function() { alert(this.username+","+this.password); }; var p = new Person(); var p2 = new Person(); p.username.push("zhangsan"); p2.username.push("lisi"); p.getInfo(); p2.getInfo();
在现实的开发过程中,我们可能希望开发的各个类(实质是对象)能像java程序中放到一个包中统一管理,统一使用,而各个对象相互独立,同时避免对象重名等等因素,我们需要给每个类有个作用域,此时我们采用将对象放到自定匿名函数的方式来解决,这一点和jQuery开发插件的有点类似。代码如下:
/** * @author jasson * @include common.js */ //对象存在就等于对象,对象不存在就创建{} var JassonChart = JassonChart || {}; (function(){ //构造函数定义对象的非函数属性 function Person() { this.username = new Array(); this.password = "123"; } //通过原型方式定义对象的函数 Person.prototype.getInfo = function() { alert(this.username+","+this.password); }; //将该类放到JassonChart中,类似java中的包,或者C++中的 JassonChart.Person= Person; }()); //调用该类库中的Person类 var p = new JassonChart.Person();
这样我们可以定义多个类,每个类都采用如上的方式实现,这样各个类相互都有作用域,非常规范。对于我们要用到的一些工具类,我们可以采用简单的对象进行定义,代码如下
/** * @author jasson */ var JassonChart = JassonChart || {}; JassonChart .util = { constants : { WIDTH : 'width', HEIGHT : 'height', SVG : 'SVG', CANVAS : 'CANVAS', G : 'G', //svg element STRING : 'string' }, distance : function(a, b) { var dx = a.x - b.x; var dy = a.y - b.y; return Math.sqrt(dx * dx + dy * dy); } };
2.Javascript对象的继承采用如下几种方式
2.1 Javascript对象的继承采用混合方式【构造函数 +原型方式(prototype)】
在JavaScript中最好的方式就是用混合方式实现对象间的继承。和定义对象一样,我们可以将属性和方法用不同的方式定义,用call或apply方式定义继承对象的属性,利用原型链的方式实现方法的继承。如下代码所示:
//使用混合的方式实现对象的继承 function Parent(hello) { this.hello = hello;//定义父类的属性 } Parent.prototype.sayHello = function()//定义父类的方法 { alert(this.hello); } function Child(hello,world) { Parent.call(this,hello);//继承父类的属性 //or Parent.apply(this,arguments);//继承父类的属性 this.world = world; } Child.prototype = new Parent();//继承父类的方法 Child.prototype.sayWorld = function() { alert(this.world); } var child = new Child("hello","world"); child.sayHello(); child.sayWorld();
2.2 深度拷贝方法
所谓"深拷贝",就是能够实现真正意义上的数组和对象的拷贝。它的实现并不难,只要递归调用"浅拷贝"就行了。
function deepCopy(p, c) { var c = c || {}; for (var i in p) { if (typeof p[i] === 'object') { c[i] = (p[i].constructor === Array) ? [] : {}; deepCopy(p[i], c[i]); } else { c[i] = p[i]; } } return c; }
使用的时候这样写:
var Doctor = deepCopy(Chinese);
现在,给父对象加一个属性,值为数组。然后,在子对象上修改这个属性:
Chinese.birthPlaces = ['北京','上海','香港'];
Doctor.birthPlaces.push('厦门');
这时,父对象就不会受到影响了。
alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门
alert(Chinese.birthPlaces); //北京, 上海, 香港
目前,jQuery库使用的就是这种继承方法。
相关推荐
本文实例讲述了JavaScript面向对象程序设计中对象的定义和继承。分享给大家供大家参考,具体如下: 在面向对象的Javascript编程中,希望代码优雅有高效是非常重要的。javascript中不存在类的概念,只有对象。要想把...
上几节讲了 JavaScript 面向对象之命名空间 、 javascript 面向对象的JavaScript类 、 JavaScript 面向对象的之私有成员和公开成员 与 Javascript 面向对象之重载,大家可以先看上面的再继续往下看。在JavaScript...
javascript 面向对象编程的若干问题,包括this指针,如何定义对象,如何继承等
本人一行注释一行代码翻译了该大师的艺术作品--目的说明它是在第1,2阶段文档演示的JavaScript面向对象的书写方式的进一步改进,它是现代JavaScript面向对象编程方式(使用基本类来编码)的过渡代码--没有它就没有当今...
我们还知道,面向对象编程有三个重要的概念 - 封装、继承和多态。 但是在JavaScript的世界中,所有的这一切特性似乎都不存在。 因为JavaScript本身不是面向对象的语言,而是基于对象的语言。
本文实例讲述了javascript面向对象三大特征之继承。分享给大家供大家参考,具体如下: 继承 在JavaScript中的继承的实质就是子代可以拥有父代公开的一些属性和方法,在js编程时,我们一般将相同的属性放到父类中,...
笔者历经多年javascript的开发,痛彻体会javascript面向对象编程的不便性,精心制作了一个类的定义与继承功能的js,实现了在javascript中对类的定义、继承、封装机制,主要功能特征包括: 一、 统一了类定义的语法...
JsObject.extend = function(subClass, superClass){ //先判断子类subClass是否已经定义,如果未定义,则重新定义类。 if(typeof subClass == “undefined”)subClass = function(){}; //如果父类superClass是类,...
前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/
前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/
Javascript已经可以模拟出面向对象的封装和继承特性,但是不幸的是Javascript对多态特性的支持非常弱!其它面向对象语言的多态一般都由方法重载和虚方法来实现多态,Javascript也通过这两种途径来实现! 重载:由于...
一、引言 在C#和Java语言中,面向对象是以类的方式实现的,特别是继承这个特性,类的方式继承表现出了强大的功能,而且也易于学习。JavaScript不是纯的面向对象的语言,而是基于对象的语言,对象的继承是以原型函数...
JsObject.extend = function(subClass, superClass){ //先判断子类subClass是否已经定义,如果未定义,则重新定义类。 if(typeof subClass == “undefined”)subClass = function(){}; //如果父类superClass是类,...
面向对象:对象作为程序的基本单元,程序分解为数据和相关操作 二、类、对象 类:对具有相同特性和特征事物的抽象描述 对象:某种类型对应的具体事物 三、面向对象的三大特性 封装:隐藏实现细节,实现代码模块化 继承...
javascript 的面向对象... 1 面向对象的特性 类,成员变量,成员函数,类变量,类方法,继承,多态 1) 类 类的定义:function Circle(r) { this.r = r; } 类的实例化: c = Circle(3); 2)成员变量 成员
第7章 掌握继承和组合 102 7.1 重用对象 102 7.2 继承 103 7.2.1 一般化和特殊化 105 7.2.2 设计决策 105 7.3 组合 107 7.4 为什么封装在OO中如此重要 109 7.4.1 继承如何削弱封装 109 7.4.2 多态的一个详细...
主要介绍了JavaScript继承定义与用法,结合实例形式分析了JavaScript面向对象程序设计中基类的定义、原型继承以及调用父类构造函数等相关操作技巧,需要的朋友可以参考下
定义继承并付诸实践 面向对象编程 面向对象编程 (OOP) 不是一种语言或工具。 OOP 是一种编程风格——我们称之为编程范式。 面向对象编程的四大Struts是: 封装 抽象 遗产 多态性 封装 封装是我们用来尝试使复杂系统...
确实那代码看得让人有些云里雾里,不知身在哪山,轻易不敢动代码,于是就自己动手鼓捣起我曾又爱又恨的javascript来,自己写一个简单的js实现namespace,继承,重载等面向对象的特性.欢迎拍砖灌水 .定义namespace ...