# 灵活的 JavaScript

# 面向对象编程

# 函数

function checkName() {
  // 验证姓名
}
function checkAge() {
  // 验证年龄
}
function checkEmail() {
  // 验证邮箱
}
1
2
3
4
5
6
7
8
9

# 使用对象收编变量

var CheckObject = {
  checkName: function () {},
  checkAge: function () {},
  checkEmail: function () {}
}
1
2
3
4
5

# 对象的另一种方式

TIP

对于方法一使用 new 关键子创建的对象不能使用这些静态方法

// 对象方法一
var CheckObject = function () {}
CheckObject.checkName = function () {}
CheckObject.checkAge = function () {}
CheckObject.checkEmail = function () {}

// 对象方法二
var CheckObject = function () {
  return {
    checkName: function () {},
    checkAge: function () {},
    checkEmail: function () {}
  }
}

// 使用类返回一个对像
var CheckObject = function () {
  this.checkName = function () {}
  this.checkAge = function () {}
  this.checkEmail = function () {}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

# 定义一个检测类

// 定义一个构造函数
var CheckObject = function () {}
CheckObject.prototype = {
  checkAge: function () {
    return this
  },
  checkName: function () {
    return this
  },
  checkEmail: function () {
    return this
  }
}

var check = new CheckObject()
// 链式调用
check.checkAge().checkEmail().checkName()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# 通过函数的祖先添加方法

// 使用函数祖先创建方法
// 方法一: 给对象(函数)添加静态方法的方式
Function.prototype.addMethod = function (name, fn) {
  this[name] = fn
  return this
}
var method = function () {}
// 注意:此处添加的是函数的静态方法,无法使用new关键字复制添加的函数
method
  .addMethod('checkName', function () {
    console.log('验证姓名')
    return this
  })
  .addMethod('checkAge', function () {
    console.log('验证年龄')
    return this
  })
method.checkName().checkAge()
console.log(method) // [Function: method] { checkName: [Function], checkAge: [Function] }

// 方法二:给函数(构造函数)添加原型的方式
Function.prototype.addMethod = function (name, fn) {
  this.prototype[name] = fn
  return this
}
var Methods = function () {}
Methods.addMethod('checkName', function () {
  console.log('验证姓名')
  return this
}).addMethod('checkAge', function () {
  console.log('验证年龄')
  return this
})

var check = new Methods()
console.log(check, 'check') // Methods {} check
console.log(check.__proto__, 'check.__proto__') // Methods { checkName: [Function], checkAge: [Function] } check.__proto__
check.checkName().checkAge()
// 验证姓名
// 验证年龄
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

# 测试使用 badge

TIP

对于使用 new 关键子创建的对象不能使用这些静态方法

WARNING

对于使用 new 关键子创建的对象不能使用这些静态方法

WARNING

对于使用 new 关键子创建的对象不能使用这些静态方法

DETAILS

对于使用 new 关键子创建的对象不能使用这些静态方法

上次更新: 3 years ago