如何用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 相关文章推荐
jQuery实现带滚动线条导航效果的方法
Jan 30 Javascript
javascript包装对象实例分析
Mar 27 Javascript
javascript删除数组重复元素的方法汇总
Jun 24 Javascript
深入探究使JavaScript动画流畅的一些方法
Jun 30 Javascript
requireJS使用指南
Apr 27 Javascript
Bootstrap基本组件学习笔记之缩略图(13)
Dec 08 Javascript
vue中如何引入jQuery和Bootstrap
Apr 10 jQuery
JS身份证信息验证正则表达式
Jun 12 Javascript
详解js实时获取并显示当前时间的方法
May 10 Javascript
axios实现简单文件上传功能
Sep 25 Javascript
JS Ajax请求会话过期处理问题解决方法分析
Nov 16 Javascript
ES11屡试不爽的新特性,你用上了几个
Oct 21 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中fwrite与file_put_contents性能测试代码
2013/08/02 PHP
Yii实现多按钮保存与提交的方法
2014/12/03 PHP
Smarty foreach控制循环次数的一些方法
2015/07/01 PHP
PHP去除字符串最后一个字符的三种方法实例
2017/03/01 PHP
PHP实现十进制、二进制、八进制和十六进制转换相关函数用法分析
2017/04/25 PHP
使用php自动备份数据库表的实现方法
2017/07/28 PHP
PHP完全二叉树定义与实现方法示例
2017/10/09 PHP
PHP-FPM和Nginx的通信机制详解
2019/02/01 PHP
jquery 获取表单元素里面的值示例代码
2013/07/28 Javascript
关于vue.js v-bind 的一些理解和思考
2017/06/06 Javascript
浅谈箭头函数写法在ReactJs中的使用
2017/08/22 Javascript
js 将canvas生成图片保存,或直接保存一张图片的实现方法
2018/01/02 Javascript
react项目实践之webpack-dev-serve
2018/09/14 Javascript
layui实现多图片上传并限制上传的图片数量
2019/09/26 Javascript
python3图片转换二进制存入mysql
2013/12/06 Python
Python xlrd读取excel日期类型的2种方法
2015/04/28 Python
python生成圆形图片的方法
2020/03/25 Python
python爬虫基本知识
2018/03/05 Python
pandas创建新Dataframe并添加多行的实例
2018/04/08 Python
python实现寻找最长回文子序列的方法
2018/06/02 Python
Win10下python 2.7.13 安装配置方法图文教程
2018/09/18 Python
详解小白之KMP算法及python实现
2019/04/04 Python
Python中Numpy mat的使用详解
2019/05/24 Python
获取Pytorch中间某一层权重或者特征的例子
2019/08/17 Python
python修改FTP服务器上的文件名
2019/09/11 Python
Python中使用gflags实例及原理解析
2019/12/13 Python
详解pycharm2020.1.1专业版安装指南(推荐)
2020/08/07 Python
CSS3 animation实现逐帧动画效果
2016/06/02 HTML / CSS
syb养殖创业计划书
2014/01/09 职场文书
大学自我评价
2014/02/12 职场文书
物业公司的岗位任命书
2014/06/06 职场文书
2014年数学教师工作总结
2014/12/03 职场文书
教师师德表现自我评价
2015/03/05 职场文书
2016年学校党支部公开承诺书
2016/03/25 职场文书
诗词赏析-(浣溪沙)
2019/08/13 职场文书
win10拖拽文件时崩溃怎么解决?win10文件不能拖拽问题解决方法
2022/08/14 数码科技