js面向对象编程
来源:互联网 发布:英国硕士绩点算法 编辑:程序博客网 时间:2024/06/05 09:27
最近很在意自己的代码问题,想要进一步优化自己的代码,为了更符合编程思维,我觉得面向对象写法是很好的方式,这里不会涉及JS的原型链的问题,因为我个人还未去深入了解。这里只讲一讲OO。
目前我写的风格,以及看到的很多代码,都是以JSON对象来处理的。例如
window.ks={name:'JOY',getname:function(){return this.name;},setname:function(name){ this.name=name;}}console.log(ks.getname());//输出JOYks.setname('xxx');console.log(ks.getname());//输出xxx
上面的写法一般就是全局的对象,单实例,如果我们希望能够处理多个实例(对象)呢?JSON是否也能处理,我们写以下代码来看看:
//是否可以通过声明不同的变量来区分对象?答案很明显是不可以的,因为这种写法只是引用var a=ks;var b=ks;a.setname('xx');b.setname('xy');console.log(a.getname());console.log(b.getname());//number,string类型都是基本类型,而基本类型存放在栈区,访问时按值访问,赋值是按照普通方式赋值;//对象和数组是通过引用来赋值的,所以改变a的同时b也会跟着改变,他们都指向ks对象,当然ks对象的值改变,a,b也会改变,那么这种情况我们就无法同时处理两个以上的实例,比如,如果我的页面中有两个轮播插件,如果我要同时控制这两个插件,就不能用JSON这种形式来写,而要用new的形式来处理,一般现在看到的JQ插件之类的很多都是以这种形式写的,所以一般插件只能针对一个对象或元素使用
而且有一点要注意的是想JSON对象这种形式存在,我们必须一开始就加载这个数据,如果是OO的写法,我们在需要的时候才去new一个实例。这样能够节约资源
下面是我在论坛中帮别人改的例子,他想知道怎样才是“封装“,而在此引入了面向对象这个概念来说,他的源代码是这样的:
function packageFun() { var length = 0; change = setInterval(function () { length++; if (length == $("#FirstPage li").length) { length = 0; } show(length); }, 5000); function show(length) { $("#FirstPage li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏 $("#FirstPage li").eq(length).fadeIn(1000); //将这张图片出现 }; } packageFun();
改完后:
function packageFun() { var li_length = $("#FirstPage li").length;//作为该类的私有变量,如果放在setinterval中,每次都要去查找,就没必要了 var cur_length = 0; this.change = setInterval(function() {//凡是带有this的成员方法或属性都是可以在外部调用的,而var声明的则为私有变量 cur_length++; if(cur_length == li_length) { cur_length = 0; } show(cur_length); }, 1000); var show = function(length) { $("#FirstPage li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏 $("#FirstPage li").eq(length).fadeIn(1000); //将这张图片出现 } } var T = new packageFun(); console.log(T.change); //这里输出setinterval的ID
上面改写的代码只是为了让他体会一下大致的写法,这样写并不灵活,复用性也不高,所以我给他的建议是这样的:
上面的写法还不是特别符合实际的情况,有种为了面向对象而面向对象的感觉,但起码看上去是这么一回事,要想写好封装,实际上你应该根据实际的需求来封装,比如你想做的是图片轮播,你应该要确定你这个图片轮播的对象应该具备哪些属性和方法,正如你用change来记录ID一样,你肯定希望能主动停止执行函数,那么你大致可以在里面写几个方法或属性:属性:返回当前对象的setInterval的ID方法:1 设置setInterval的循环执行的时间 2 结束轮播 3 开始轮播所以我上面的写法你可以再进一步修改
阅读全文
0 0
- js 面向对象编程
- js 面向对象编程
- js 面向对象编程
- JS面向对象编程
- js面向对象编程
- Js面向对象编程
- JS面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- js面向对象编程
- JS面向对象编程
- js面向对象编程
- 删除web项目中的自动产生的一些文件的测试
- cuda 数组元素个数大于线程数目
- Python爬虫-正则表达式
- Fresco 加载网络图片被裁剪
- #46. 【清华集训2014】玄学
- js面向对象编程
- electron 构建桌面应用
- Toolbar相关知识点记录
- 调整数组顺序使奇数位于偶数前面
- C语言复习 第一波 进制转换代码
- 如何准备BAT技术面试答案(上)——Java研发方向
- Lottie
- 更换主题
- Java数据库操作(多语句提交)