javascript

位置:IT落伍者 >> javascript >> 浏览文章

Javascript面向对象编程


发布日期:2024年01月03日
 
Javascript面向对象编程

Javascript是一门很灵活的语言允许我们模拟面向对象编程中的很多机机制在JS中充分使用面向对象设计思想可以极大限度的提升代码重用降低模块间的偶合更好的逻辑分层与并行开发下面分几个步骤简单谈下我的理解

数据类型与包装类

包装类 …… 类型名 …… 常见值 …… 分类

Number …… number …… …… 基本数据类型

Boolean …… Boolean …… truefalse …… 基本数据类型

String …… string …… “hello world!” …… 基本数据类型

Object …… object …… {}[] …… 复合数据类型

Function …… function …… function(){} …… 特殊类型

无 …… undefined …… undefined未定义 …… 小数据类型

无 …… null …… null …… 小数据类型

内置类型与本文关系不大不列出

引用类型与值类型

引用类型object function

值类型numberbooleanstringnullundefined

new function(构造器)与prototype(原型)

关于prototype的设计模式就不多说了网上很多介绍以一个例子介绍一下js中使用new构造对象的过程

function classname(){thisid=;} var v=new classname();

当使用function构造对象时进行以下流程

查找classname的prototype并进行浅拷贝

绑定this指针到拷贝来的对象

将thisconstructor属性设置为classname

[注其实classnameprototypeconstructor的值也被设置为classname第六部分会说明]

执行用户{}中的代码

返回this指针赋予左值v

实现面向对象的三个基本特征

封装

封装这个大家都明白在js中重点在于访问权限在其他原生支持面向对象语言中一般支持publicprotectedprivate三个关键字来控制访问权限但在js中我们只能依靠复杂的作用域关系来控制

function classname(a){

var uid=a; //uin为模拟private作用域为{}外部无法使用

thisgetuid=function(){return a;} //为uid提供一个外部只读接口 objgetuid();

thissetuid=function(val){a=val} //为uid提供一个外部可写接口objsetuid();

thisid=uid; //id为模拟public objid 使用

}

classnameprototypefunc=function(){}; //模拟public方法 objfunc()调用

classnamestafunc=function(){}; //模拟静态方法 classnamestafunc()调用

var obj=new classname();

[!]非常需要注意的就是因为function是引用类型 classnameprototypefunc是所有对象共享的一个function对象(每个对象仅存着引用)因此对象规模不大而使用thisgetuid和thissetuid为定义一个function因此每个对象实例都会存一份如果放肆使用这种方法会造成对象规模庞大影响性能个人认为模拟private变量的意义不大

[!]如果有需求真的需要大量使用thisxxx=function(){}这种情况在function(){}中的this指针与最外的this指针是不同的最好在类定义的首行加上var _this=this;这样在thisxxx=function(){}中也可以方便使用绑定的指针

继承

继承的实现主要有种方法第一种是使用javascript本身的原型模型通过给prototype赋值并改变其constructor属性来实现继承第二种方法是不使用prototype手动实现将父对象的所有属性方法深拷贝到子对象比如A需要继承B第一种写法可以Aprototype=new B();Aprototypeconstructor=A; 第二种写法可以写一个递归或者使用jquery中的方法extend另外如果要实现多继承的话prototype就真的好麻烦了(需要依次多个类还要建空对象来接)第二种方法就比较简单依次拷贝即可一般这种继承为了找父类方便可以在对象中加个属性引用父类

多态

函数重载就不说了都会检查参数即可很灵活隐藏属性就是直接赋值undefined需要注意的是如果是打算继承B类的prototype一定要建一个空对象来接否则的话你给类写方法的话相当于直接修改了prototype就算不写方法你最后修改constructor时也会造成继承链错乱接个空对象很容易

function temp(){};

tempprototype=B;

var obj=new temp();

这样再让需要继承Bprototype的类继承obj即可即便修改prototype也不会影响到B而且也不像继承new B()那样浪费很多空间

深拷贝与浅拷贝

这个和其他语言中没什么区别浅拷贝就是直接拷贝遇到引用类型或类类型不再深入深拷贝则是根据类型判断进行递归拷贝

prototypeconstructor

这个值主要是用于维护继承的原型链一篇文章已经写的非常详细请参考

JS的面向对象开发

由于我不是前台开发人员见过项目有限仅谈自己的经验

我开发过的B/S常用两种架构一种是以CGI为主由后台语言去生成HTMLJS仅仅做一些用户交互ajax通信等另外一种是使用MVC后台语言仅仅生成JSONView层完全由JS组件在客户端实现后者一般大量使用面向对象的思想进行编程将组件封装成类将JSON传入构造函数再由控制器或布局组件Add进来由于组件可以重用在开发后台管理系统JS游戏上效率还是很可观的               

上一篇:浅析Js(Jquery)中,字符串与JSON格式互相转换的示例

下一篇:jquery实现判断输入文字个数的代码