如何用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 相关文章推荐
sina的lightbox效果。
Jan 09 Javascript
jquery dialog open后,服务器端控件失效的快速解决方法
Dec 19 Javascript
JS表的模拟方法
Feb 05 Javascript
Bootstrap每天必学之前端开发框架
Nov 19 Javascript
深入理解jQuery之事件移除
Jun 02 Javascript
javascript运算符语法全面概述
Jul 14 Javascript
js中利用cookie实现记住密码功能
Aug 20 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
May 10 Javascript
Angularjs 实现动态添加控件功能
May 25 Javascript
详解javascript中的babel到底是什么
Jun 21 Javascript
了解javascript中let和var及const关键字的区别
May 24 Javascript
angular共享依赖的解决方案分享
Oct 15 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
首页四格,首页五格For6.0(GBK)(UTF-8)[12种组合][9-18][版主安装测试通过]
2007/09/24 PHP
PHP自动选择 连接本地还是远程数据库
2010/12/02 PHP
PHP 魔术变量和魔术函数详解
2015/02/25 PHP
PHP实现简易blog的制作
2016/10/24 PHP
PDO的安全处理与事物处理方法
2016/10/31 PHP
php使用 readfile() 函数设置文件大小大小的方法
2017/08/11 PHP
php处理抢购类功能的高并发请求
2018/02/08 PHP
PHP调用微博接口实现微博登录的方法示例
2018/09/22 PHP
js通过googleAIP翻译PHP系统的语言配置的实现代码
2011/10/17 Javascript
js/jquery去掉空格,回车,换行示例代码
2013/11/05 Javascript
jQuery中[attribute]选择器用法实例
2014/12/31 Javascript
详解AngularJS过滤器的使用
2016/03/11 Javascript
jQuery 中的 DOM 操作
2016/04/26 Javascript
解析JavaScript面向对象概念中的Object类型与作用域
2016/05/10 Javascript
图文详解JavaScript的原型对象及原型链
2016/08/02 Javascript
JavaScript制作弹出层效果
2016/12/02 Javascript
基于jQuery实现图片推拉门动画效果的两种方法
2017/08/26 jQuery
简单了解Vue computed属性及watch区别
2020/07/10 Javascript
[02:15]你好,这就是DOTA!
2015/08/05 DOTA
[39:11]DOTA2上海特级锦标赛C组资格赛#2 LGD VS Newbee第二局
2016/02/28 DOTA
[02:37]TI8勇士令状不朽珍藏II视频展示
2018/06/23 DOTA
Python实现HTTP协议下的文件下载方法总结
2016/04/20 Python
python实现excel读写数据
2021/03/02 Python
python读取文本中数据并转化为DataFrame的实例
2018/04/10 Python
使用python读取.text文件特定行的数据方法
2019/01/28 Python
python爬虫 爬取超清壁纸代码实例
2019/08/16 Python
django框架中间件原理与用法详解
2019/12/10 Python
详解python tkinter包获取本地绝对路径(以获取图片并展示)
2020/09/04 Python
女子锻炼服装和瑜伽服装:Splits59
2019/03/04 全球购物
销售业务员岗位职责
2014/01/29 职场文书
《满井游记》教学反思
2014/02/26 职场文书
演讲主持词
2014/03/18 职场文书
英文辞职信范文
2015/05/13 职场文书
改进工作作风心得体会
2016/01/23 职场文书
《钢铁是怎样炼成的》高中读后感
2019/08/07 职场文书
2022新作动画《福星小子》释出宣传影片 加入内田真礼&宫野真守配音演出
2022/04/08 日漫