javascript 面向对象的JavaScript类


Posted in Javascript onMay 04, 2010

在上一节面 JavaScript 面向对象之命名空间 中说了怎么定义JavaScript命名空间,这一节来说下紧接着的一个概念——类。虽然JavaScript中没有class关键字,但作为开发人员我们一定要有这个思想。在C#中类可以分为实例类和静态类,JavaScript亦然。

一,定义实例类: 在上节中我定义了一个cnblogs.news的命名空间,现在就在此命名空间下定义一个名为Article类:

cnblogs.news.Article=function(){ 
var _this=this; 
this.title=null; 
this.content=null; 
this.show=function(){ 
document.write("<h1>"+_this.title+"</h1>"); 
document.write("<p>"+_this.content+"</p>"); 
} 
}

创建对象就和C#一样:
// 实例化一个对象 
var article =new cnblogs.news.Article(); 
// 给对象的属性赋值 
article.title="这是文章标题"; 
article.content="这是文章内容"; 
// 调用对象的方法 
article.show();

二,定义静态类:所谓静态类就是直接调用类的成员,换言之,类的成员是属于类的,不属于对象。同样以Article为例,代码如下:
cnblogs.news.Article={ 
title:"这是文章标题", 
content:"这是文章内容", 
show:function(){ 
document.write("<h1>"+cnblogs.news.Article.title+"</h1>"); 
document.write("<p>"+cnblogs.news.Article.content+"</p>"); 
} 
};

调用方式也和C#类似:
cnblogs.news.Article.show();
到这里或许你已经发现了,所谓JavaScript静态类其实就是一个json对象,恭喜,答对了! ^_^
三,如何选择:
那么何时选择实例类,何时选择静态类呢,就个人经验而言(说得不对敬请斧正刀正,怎么正都可以^_^),开发一些对dom的依赖比较弱,而要求复用型很强的程序,如工具类,插件类,结构,使用静态类;反之如果程序对dom依赖很强,经常有变量传来传去,或者对类的结构造成变化,这时选用实例类。个人比较推崇第一种方案,其代码风格较之第二种更像C#,我想写惯了C#的同学也会这样觉得的,^_^。
作者: 祥叔
Javascript 相关文章推荐
JavaScript CSS修改学习第五章 给“上传”添加样式
Feb 19 Javascript
三级下拉菜单的js实现代码
May 23 Javascript
JavaScript使用concat连接数组的方法
Apr 06 Javascript
介绍一个简单的JavaScript类框架
Jun 24 Javascript
javaScript中定义类或对象的五种方式总结
Dec 04 Javascript
JavaScript函数节流和函数防抖之间的区别
Feb 15 Javascript
微信小程序 出现错误:{&quot;baseresponse&quot;:{&quot;errcode&quot;:-80002,&quot;errmsg&quot;:&quot;&quot;}}解决办法
Feb 23 Javascript
详解vue-router 2.0 常用基础知识点之router.push()
May 10 Javascript
简易Vue评论框架的实现(父组件的实现)
Jan 08 Javascript
前端Vue项目详解--初始化及导航栏
Jun 24 Javascript
JS操作JSON常用方法(10w阅读)
Dec 06 Javascript
vue实现图片裁剪后上传
Dec 16 Vue.js
JavaScript 面向对象之命名空间
May 04 #Javascript
10个实用的脚本代码工具
May 04 #Javascript
利用location.hash实现跨域iframe自适应
May 04 #Javascript
Array.prototype 的泛型应用分析
Apr 30 #Javascript
jQuery 锚点跳转滚动条平滑滚动一句话代码
Apr 30 #Javascript
JavaScipt中的Math.ceil() 、Math.floor() 、Math.round() 三个函数的理解
Apr 29 #Javascript
匹配任意字符的正则表达式写法
Apr 29 #Javascript
You might like
php输出echo、print、print_r、printf、sprintf、var_dump的区别比较
2013/06/21 PHP
PHP中PDO连接数据库中各种DNS设置方法小结
2016/05/13 PHP
PHP QRCODE生成彩色二维码的方法
2016/05/19 PHP
Prototype使用指南之base.js
2007/01/10 Javascript
checkbox 多选框 联动实现代码
2008/10/22 Javascript
[原创]IE view-source 无法查看看源码 JavaScript看网页源码
2009/07/19 Javascript
Javascript 判断Flash是否加载完成的代码
2010/04/12 Javascript
一个html5播放视频的video控件只支持android的默认格式mp4和3gp
2014/05/08 Javascript
javascript实现在某个元素上阻止鼠标右键事件的方法和实例
2014/08/12 Javascript
JavaScript中通过提示框跳转页面的方法
2016/02/14 Javascript
JavaScript Date对象详解
2016/03/01 Javascript
解决微信浏览器Javascript无法使用window.location.reload()刷新页面
2016/06/21 Javascript
JavaScript SHA512加密算法详细代码
2016/10/06 Javascript
Vue AST源码解析第一篇
2017/07/19 Javascript
Easyui使用Dialog行内按钮布局的实例
2017/07/27 Javascript
Webpack的dll功能使用
2018/06/28 Javascript
如何使用less实现随机下雪动画详解
2019/01/02 Javascript
在 Vue 应用中使用 Netlify 表单功能的方法详解
2019/06/03 Javascript
详解基于 Node.js 的轻量级云函数功能实现
2019/07/08 Javascript
Electron 调用命令行(cmd)
2019/09/23 Javascript
vue实现弹幕功能
2019/10/25 Javascript
Python网络编程详解
2017/10/31 Python
python统计字母、空格、数字等字符个数的实例
2018/06/29 Python
Python中使用logging和traceback模块记录日志和跟踪异常
2019/04/09 Python
解决TensorFlow GPU版出现OOM错误的问题
2020/02/03 Python
Kears 使用:通过回调函数保存最佳准确率下的模型操作
2020/06/17 Python
详解python tcp编程
2020/08/24 Python
CSS3为背景图设置遮罩并解决遮罩样式继承问题
2020/06/22 HTML / CSS
唤醒头发毛囊的秘密武器:Grow Gorgeous
2016/08/28 全球购物
电影T恤、80年代T恤和80年代服装:TV Store Online
2020/01/05 全球购物
微电影大赛策划方案
2014/06/05 职场文书
励志演讲稿200字
2014/08/21 职场文书
市委常委班子党的群众路线教育实践活动整改措施
2014/10/02 职场文书
2015年基建工作总结范文
2015/05/23 职场文书
小学数学教师研修日志
2015/11/13 职场文书
2019旅游导游工作总结
2019/06/27 职场文书