建站极客
网络编程 JavaScript 正文
JavaScript面向对象之体会[总结]
所属分类:
网络编程 / JavaScript
阅读数:
1492
收藏 0
赞 0
分享
谈JavaScript的面向对象设计有点牵强,毕竟JavaScript语言本身没有高级语言严谨。看这篇文章之前,希望大家了解c++、java、c#等高级语言,有面向对象编程的基础知识。 1.类的定义: function ClassName(){ } 大家可以发现类的定义形式是和函数是一样的。 其实函数和类只有在使用的时候才能分辨出来,比如我们在一个页面中分别使用他们: <script language="javascript"> function A(){ alert('hello'); } //A作为函数来使用 A(); //A作为类来使用,从类A派生出一个obj对象 var obj=new A(); </script> 2.类的成员: function ClassName(){ //定义公有变量 this.property1=0; //定义公有方法 this.method1=function(){ //判断this.a是否赋值 if(this.a != undefined) alert(this.a); } //另外一种方法的定义形式 this.method3=funcA; //定义私有成员 var pram1=1; var method2=function(){ alert(''); } } //funcA是方法method3的处理函数 function funcA(){ alert(''); } 上面的代码慢慢来给大家解释: 有this开头的都是类的成员,而且都是公有(public)的。 比如:property1是类的属性、method1是类的方法; 类的成员不需要使用var来定义,没有使用this前缀的都是私有变量。 比如:pram1是私有变量,method2是私有方法; 类的属性可以不在类中定义,不要初始化的属性可以不定义,在其他地方仍可以调用; 比如:在method1里面要输出a属性,在整个类里面就没有定义a属性,我们在创建对象的时候可以给它赋值。 var obj=new ClassName() obj.a="hello javascript"; obj.method1(); 类的方法可以通过this.method=function(){}来定义,比如method1方法; 也可以通过this.method=funcName来定义,将方法指定让某个函数来处理,比如method3; 3.类的继承: function classA(){ this.property1='hello'; this.method1=function (){ alert(this.property1); } } function classB(){ } //继承classA classB.prototype=new classA(); //给classB添加PI属性 classB.prototype.PI=3.1415926; //给classB添加showPI方法 classB.prototype.showPI=function(){ alert(this.PI); } 通过使用prototype对象,将类classA的实例赋值给prototype对象,从而classB继承了classA的所有成员; 比如:classB.prototype=new classA(); 同时也可以通过prototype在类外给类从新添加成员(这个是别的高级语言所没有的功能); 比如:classB.prototype.PI和classB.prototype.showPI 4.类方法的重载: 类方法的重载在类的构造函数中使用的比较多,比如:类中有两个同名的方法而不同参数或不同参数类型。JavaScript从形式上来说不支持类方法重载,我们可以通过它的arguments属性来完成对类方法的重载: function classA(){ //获取参数个数 //注意this.arguments.length是错误的 var num=classA.arguments.length; this.method1=function(){ if(num==0){ alert(0); } if(num==1){ alert(1); } } } 类或函数名的arguments属性返回一个数组包含所有参数; 比如:classA.arguments.length可以获取参数的个数,classA.arguments[0]获取第一个参数的值 根据需要,通过获取参数个数或参数值,从而同一个函数或类具有了不同的功能,比如: var obj= new classA(); obj.method1();//输出了0 var obj1= new classA(5); obj1.method1();//输出了1 5.对象的定义: //对象是类的实例,定义一个类,作为一个对象的模板 function A(){ this.a=1; this.b=2; this.add=function(){ return this.a+this.b; } } //定义一个对象 var obj=new A(); //赋值类属性 obj.a=5; obj.b=6; //调用类方法 var sum=obj.add(); 另外一种定义方法: var obj={ a:1, b:2, add:function(){ return this.a + this.b; } } 这种方法定义的对象,把其类的结构也一起定义了,适合只使用一次的类 定义属性和方法的时候不需要使用this关键字,":"后直接赋值即可 但是方法中使用属性,需要使用this关键字 本文只是本人个人的经验和理解,估计我写的和一些书上有些不一样,相信看了之后一定能很快理解。此文章只起到抛砖引玉之作用,具体的项目需求还要具体对待。涉及所有例子均亲自调试无误,如有错误请指正。
纯javascript判断查询日期是否为有效日期 很多网站都涉及到输入日期选项,如果客户日期输入错误,可能导入查询不到甚至查询到错误的信息,为了更好的满足用户需求,需要对日期进行校验,下面给大家介绍使用纯javascript如何判断查询日期是否为有效日期,需要的朋友可以参考下
评论 0
收藏 0
赞 0
分享
jquery实现的蓝色二级导航条效果代码 这篇文章主要介绍了jquery实现的蓝色二级导航条效果代码,涉及jquery鼠标事件及页面样式的动态切换效果实现技巧,非常简单实用,需要的朋友可以参考下
评论 0
收藏 0
赞 0
分享
ajax如何实现页面局部跳转与结果返回 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新,本篇文章给大家介绍ajax如何实现页面局部跳转与结果返
评论 0
收藏 0
赞 0
分享
js实现的黑背景灰色二级导航菜单效果代码 这篇文章主要介绍了js实现的黑背景灰色二级导航菜单效果代码,涉及javascript操作页面元素动态切换的实现技巧,非常具有实用价值,需要的朋友可以参考下
评论 0
收藏 0
赞 0
分享
javascript中SetInterval与setTimeout的定时器用法 Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等,本文文章通过代码示例给大家介绍javascript中SetInterval与setT
评论 0
收藏 0
赞 0
分享
jQuery实现的背景动态变化导航菜单效果 这篇文章主要介绍了jQuery实现的背景动态变化导航菜单效果,涉及jquery页面元素背景动态变换的实现技巧,非常具有实用价值,需要的朋友可以参考下
评论 0
收藏 0
赞 0
分享
查看更多