背景:一个验证表单功能的任务,仅需要验证用户名、邮箱、密码等。

一,初始化函数

  1. function checkName() {
  2. // 验证姓名
  3. }
  4. function checkEmail() {
  5. // 验证邮箱
  6. }
  7. function checkPassword() {
  8. // 验证密码
  9. }
  • 问题点:创建了很多全局变量,且是很常用的全局变量

函数的另一种形式:

  1. var checkName = function() {
  2. // 验证姓名
  3. }
  4. var checkEmail = function() {
  5. // 验证邮箱
  6. }
  7. var checkPassword = function() {
  8. // 验证密码
  9. }

相当于提前声明了三个全局变量,如果别人也定义了同样的方法就会覆盖掉原有的功能了。
假如定义了很多方法,这种相互覆盖的问题很不容易察觉。

二,用对象收编变量

1. 创建一个检测对象,把我们的方法放在里面
  1. var CheckObject = {
  2. checkName: function() {},
  3. checkEmail: function() {},
  4. checkPassword: function() {}
  5. }

使用也很简单,比如检测姓名 CheckObject.checkName()

2. 对象的另一种形式

在 JavaScript 中函数也是对象,所以你可以这么做:

  1. var CheckObject = function() {};
  2. CheckObject.checkName = function() {};
  3. CheckObject.checkEmail = function() {};
  4. CheckObject.checkPassword = function() {};

三,一个检测类

  1. var CheckObject = function() {};
  2. CheckObject.prototype = {
  3. checkName: function() {
  4. // 验证姓名
  5. },
  6. checkEmail: function() {
  7. // 验证邮箱
  8. },
  9. checkPassword: function() {
  10. // 验证密码
  11. }
  12. }

这样创建对象实例的时候,创建出来的对象所拥有的方法就都是一个了,因为它们都要依赖 prototype 原型依次寻找,而找到的方法都是同一个,它们都绑定在 CheckObject 对象类的原型上。
使用如下:

  1. var a = new CheckObject();
  2. a.checkName();
  3. a.checkEmail();
  4. a.checkPassword();

调用了三个方法,但是对象 a 书写了 3 遍。这是可以避免的,那就要在你声明的每一个方法末尾处讲当前对象返回。
在 JavaScript 中 this 指向的就是当前对象,所以你可以将它返回。

  1. var CheckObject = function() {};
  2. CheckObject.prototype = {
  3. checkName: function() {
  4. // 验证姓名
  5. return this;
  6. },
  7. checkEmail: function() {
  8. // 验证邮箱
  9. return this;
  10. },
  11. checkPassword: function() {
  12. // 验证密码
  13. return this;
  14. }
  15. }

我们就可以这样使用它:

  1. var a = new CheckObject();
  2. a.checkName().checkEmail().checkPassword();