如何用JavaScript定义一个类


Posted in Javascript onSeptember 12, 2014

我原来的写法都是这样:

function Dog(){
  this.name = 'hachi';
}

Dog.prototype = {
  makeNoise:function(){
    alert('wangwangwang');
  }
};

后来又看到另外一种复杂一点而且看起来好像没有必要的写法:

function Dog(){
  var privateVariable = 'secret';

  var fn = function(){
    //...
  }

  fn.prototype = {
    makeNoise:function(){
      alert('wangwangwang');
    }
  }

  return fn;
}

这里的Dog函数其实是一个 制造类 的函数,它返回了真正的Dog类。
感觉这样做的好处是更好的实现了封装。
例如这里的privateVariable就是一个私有变量:

var d = new Dog;
d.privateVariable //undefined

另外如果在第一个例子的最后加上一句:

Dog.prototype = {
  //e...WTF??
}

这样Dog就不是Dog了~

后来的理解:
上面这样新建类的方法直接重写了prototype对象。这样prototype原本内置的属性就没有了(arguments, call, apply等)。
下面这种新建类的方法好像更好一些:

var Dog = function(name){
  this.name = name;
  var privateVariable = 'you cannot see me.';
  this.getPrivate = function(){return privateVariable;};
}
Javascript 相关文章推荐
JSON扫盲帖 JSON.as类教程
Feb 16 Javascript
制作高质量的JQuery Plugin 插件的方法
Apr 20 Javascript
在JavaScript中处理字符串之fontcolor()方法的使用
Jun 08 Javascript
创建一个类Person的简单实例
May 17 Javascript
Javascript实现汉字和拼音互转的终极方案
Oct 19 Javascript
关于javascript事件响应的基础语法总结(必看篇)
Dec 26 Javascript
[js高手之路]单例模式实现模态框的示例
Sep 01 Javascript
React教程之Props验证的具体用法(Props Validation)
Sep 04 Javascript
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
JS+HTML5实现获取手机验证码倒计时按钮
Aug 08 Javascript
react quill中图片上传由默认转成base64改成上传到服务器的方法
Oct 30 Javascript
javascript实现时间日期的格式化的方法汇总
Aug 06 Javascript
jquery实现类似淘宝星星评分功能实例
Sep 12 #Javascript
jquery根据锚点offset值实现动画切换
Sep 11 #Javascript
无限树Jquery插件zTree的常用功能特性总结
Sep 11 #Javascript
js通过location.search来获取页面传来的参数
Sep 11 #Javascript
Javascript中设置默认参数值示例
Sep 11 #Javascript
采用自执行的匿名函数解决for循环使用闭包的问题
Sep 11 #Javascript
Extjs grid panel自带滚动条失效的解决方法
Sep 11 #Javascript
You might like
PHP substr 截取字符串出现乱码问题解决方法[utf8与gb2312]
2011/12/16 PHP
php中计算未知长度的字符串哪个字符出现的次数最多的代码
2012/08/14 PHP
ThinkPHP CURD方法之data方法详解
2014/06/18 PHP
PHP 读取和编写 XML
2014/11/19 PHP
php删除指定目录的方法
2015/04/03 PHP
PHP中__autoload和Smarty冲突的简单解决方法
2016/04/08 PHP
微博@符号的用户名提示效果。(想@到谁?)
2010/11/05 Javascript
JQuery中getJSON的使用方法
2010/12/13 Javascript
JQuery拖拽元素改变大小尺寸实现代码
2012/12/10 Javascript
JS中for循序中延迟加载动态效果的具体实现
2013/08/18 Javascript
jQuery检测某个元素是否存在代码分享
2015/07/09 Javascript
JavaScript入门系列之知识点总结
2016/03/24 Javascript
微信小程序 常用工具类详解及实例
2017/02/15 Javascript
javascript获取图片的top N主色值方法详解
2018/01/26 Javascript
详解Vue基于 Nuxt.js 实现服务端渲染(SSR)
2018/04/05 Javascript
在小程序中使用canvas的方法示例
2018/09/17 Javascript
socket io与vue-cli的结合使用的示例代码
2018/11/01 Javascript
vue基础之data存储数据及v-for循环用法示例
2019/03/08 Javascript
你可能不知道的CORS跨域资源共享
2019/03/13 Javascript
原生JS使用Canvas实现拖拽式绘图功能
2019/06/05 Javascript
[40:19]完美世界DOTA2联赛PWL S3 Rebirth vs CPG 第二场 12.18
2020/12/19 DOTA
在RedHat系Linux上部署Python的Celery框架的教程
2015/04/07 Python
Python爬虫抓取手机APP的传输数据
2016/01/22 Python
Python的string模块中的Template类字符串模板用法
2016/06/27 Python
Python入门之三角函数全解【收藏】
2017/11/08 Python
Python中函数的返回值示例浅析
2019/08/28 Python
使用python脚本自动创建pip.ini配置文件代码实例
2019/09/20 Python
Python操作Elasticsearch处理timeout超时
2020/07/17 Python
美国精品家居用品网站:US-Mattress
2016/08/24 全球购物
DHC美国官网:日本通信销售第一的化妆品品牌
2017/11/12 全球购物
亚洲在线旅行门户网站:Expedia.com.hk(智游网)
2020/04/14 全球购物
事业单位个人应聘自荐信
2013/09/21 职场文书
小学元宵节活动总结
2015/02/06 职场文书
应届毕业生求职信范文
2015/03/19 职场文书
给领导敬酒词
2015/08/12 职场文书
Pandas实现批量拆分与合并Excel的示例代码
2022/05/30 Python