如何用JavaScript定义一个类

 更新时间:2014年09月12日 10:46:42   投稿:hebedich  
其实Javascript中没有类这个定义,但是有类这个概念。很多人都写过这样的代码,就是一个关键字 function,然后定义一个方法名,方法名后紧跟一对括号。如果你在项目中写过这样的代码,那么祝贺你,你可以不费任何吹毛之力,就能一口气读完这篇文章了。

我原来的写法都是这样:

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变量声明的知识点

    一个JavaScript变量声明的知识点

    JavaScript变量声明很简单,但是这里也有要学习的知识点,对于JavaScript基础学习很重要。
    2013-10-10
  • 浅析JavaScript异步代码优化

    浅析JavaScript异步代码优化

    这篇文章主要介绍了JavaScript异步代码优化,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-03-03
  • JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)

    JavaScript lastIndexOf方法入门实例(计算指定字符在字符串中最后一次出现的位置)

    这篇文章主要介绍了JavaScript字符串对象的lastIndexOf方法入门实例,lastIndexOf方法用于计算指定字符在字符串中最后一次出现的位置,需要的朋友可以参考下
    2014-10-10
  • 深入理解JavaScript系列(45):代码复用模式(避免篇)详解

    深入理解JavaScript系列(45):代码复用模式(避免篇)详解

    这篇文章主要介绍了深入理解JavaScript系列(45):代码复用模式(避免篇)详解,本文讲解了默认模式、借用构造函数、借用构造函数并设置原型、共享原型、临时构造函数、klass等内容,需要的朋友可以参考下
    2015-03-03
  • JS数组(Array)处理函数整理

    JS数组(Array)处理函数整理

    这篇文章主要整理了一下JS数组(Array)处理函数,常用的都汇总了一下,推荐给大家。
    2014-12-12
  • javascript事件绑定学习要点

    javascript事件绑定学习要点

    这篇文章主要介绍了javascript事件绑定学习要点,主要包含下面四个方面1.传统事件绑定的问题,2.W3C事件处理函数,3.IE事件处理函数,4.事件对象的其他补充,有需要的小伙伴可以参考下
    2016-03-03
  • Javascript基础教程之变量

    Javascript基础教程之变量

    大家都知道javascript是可以隐式声名变量的。但要注意,隐式声名变量总是被创建为全局变量。看以下代码,情愿javascript语言强制声明变量。建议大家一定要var声明变量。
    2015-01-01
  • EsLint入门学习教程

    EsLint入门学习教程

    ESLint是一个代码规范和错误检查工具,下面这篇文章主要介绍了EsLint的相关资料,需要的朋友可以参考学习,下面来一起看看吧。
    2017-02-02
  • javascript编程起步(第二课)

    javascript编程起步(第二课)

    javascript编程起步(第二课)...
    2007-02-02
  • JS脚本defer的作用示例介绍

    JS脚本defer的作用示例介绍

    defer作用是文档加载完毕了再执行脚本,这样回避免找不到对象的问题,下面有个不错的示例,感兴趣的朋友可以参考下
    2014-01-01

最新评论