JavaScript 设计模式 读书笔记（一）

第一篇 面向对象编程

柯里化

柯里化即函数的链式使用,关键在于return this

Function.prototype.addMethod = function (name, fn) {
  this[name] = fn
  return this
}
var methods = function () {}
methods
  .addMethod("checkID", function () {
    console.log(1)
    return this
  })
  .addMethod("checkName", function () {
    console.log(2)
    return this
  })
methods.checkID().checkName() // 1  2

非闭包封装对象

// 非闭包实现一个类
var Book = function (id, name, price) {
  // 私有属性
  var name = 1
  var price = 0

  // 私有方法
  function checkId() {
    console.log(this.id)
  }
  // 对象公有属性
  this.id = id
  // 对象公有方法
  this.copy = function () {}

  // 特权方法 (通过this创建的方法，并且可以访问私有属性，私有方法的方法称为特权方法)
  this.getNum = function () {
    return name
  }
  this.setNum = function (_name) {
    name = _name
  }
  this.setPrice = function (_price) {
    price = _price
  }

  // 构造器
  this.setNum(name)
  this.setPrice(price)
}
// 类静态方法(对象不能访问)
Book.isClass = true
Book.resetTime = function () {
  console.log("new Time")
}
Book.prototype = {
  // 公有属性
  isPrototype: true,
  // 公有方法
  display: function () {},
}

// new 创建对象的实质就是对新对象this不断赋值，并将prototype指向类的prototype，
// 因此通过类外通过点语法定义属性和方法是不会添加的新建的对象上去的
/* 测试
var book = new Book(1, "JS设计模式", 303)
console.log(book.name) // undefined
console.log(book.id) // 1
console.log(book.isPrototype) //true
console.log(book.isClass) // undefined
console.log(Book.isClass) //true
  对象不能访问类静态属性，只能通过类来访问，类似c++的static关键字
 */

闭包封装对象

// 通过闭包来封装
var Book = (function () {
  // 静态私有变量
  var bookNum = 0
  // 静态私有方法
  function checkBook(name) {}
  // 创建类
  function _book(newId, newName, newPrice) {
    // 私有变量
    var name, price
    // 私有方法
    function checkId(id) {}
    // 特权方法
    this.getName = function () {}
    this.setName = function () {}
    this.setPrice = function () {}

    // 公有属性
    this.id = newId
    // 公有方法
    this.copy = function () {}

    // 构造器
    this.setName(newName)
    this.setPrice(newPrice)
  }
  // 创建原型对象
  _book.prototype = {
    // 静态公有属性
    isPrototype: true,
    // 静态公有方法
    checkPrototype: function () {},
  }
  // 返回类
  return _book
})()
// 通过可以直接return {}一个对象来实现，但是这样的结果是原型对象需要在类外部声明
/*  测试
var book = new Book(1, "JS", 303)
console.log(book.name) //undefined
console.log(book.id) // 1
console.log(book.isPrototype) // true
console.log(book.bookNum) // undefined
console.log(Book.bookNum) // undefined
通过闭包实现，静态私有变量将不能通过类名访问，由于处于闭包作用域 */

安全创建对象

// 创建对象的非安全模式，忘记写new关键字，导致变量泄露到全局作用域
var Book = function (title, time, type) {
  this.title = title
  this.time = time
  this.type = type
}
var book = Book("js", "2020", "book")
console.log(book) //undefined
console.log(globalThis.title) //js
console.log(global.time) // 2020
console.log(global.type) // book

// 创建对象的安全模式
var Book = function (title, time, type) {
  if (this instanceof Book) {
    this.title = title
    this.time = time
    this.type = type
  } else {
    return new Book(title, time, type)
  }
}
var book = Book("js", "2020", "book")
console.log(book) // Book对象
console.log(book.title) // js
console.log(book.time) // 2020
console.log(book.type) // book