设计模式(0) 面向对象&设计原则

什么是面向对象

把客观的对象抽象成属性数据和对数据的相关的操作(也就是方法),把内部的细节和不想关的信息隐藏起来,把同一个类型的客观对象的属性数据和操作绑定在一起,封装成类,并且允许分成不同层次进行抽象,通过继承实现属性和操作的共享。

  • 面向对象的分析 OOA
  • 面向对象的设计 OOD
  • 面向对象的编程 OOP

继承

/**
 * 类 对象(实例)
 * 父类 Animal 是公共的
 */
class Animal {
  constructor(name) {
    this.name = name
  }

  eat() {
    console.log(`${this.name} eat`)
  }
}

let animal = new Animal('动物')

animal.eat()

/**
 * 继承
 * 子类继承父类
 * 继承可以把公共方法抽离出来,减少冗余
 */
class Cat extends Animal {
  constructor(myName, age) {
    super(myName)
    this.age = age
  }

  speak() {
    console.log(`${this.name}: 喵喵~~`)
  }
}

let cat = new Cat('小花猫', 2)

cat.eat()
cat.speak()

封装

把数据封装起来,减少耦合,不该外部访问的不要让外部访问,利于数据的接口权限管理 ES6 目前不支持,一般认为_开头的都会私有的,不要使用,后面讲的会使用 ts

class person {
  public name // 公共的,类或者类外都可以访问,比如:你的名字谁都可以知道
  protected age // 受保护的自己和自己的子类可以访问,比如:女性的年龄
  private monney // 只有自己可以知道哦,私房钱

  constructor(name, age, monney) {
    this.name = name
    this.age = age
    this.monney = monney
  }

  getName() {
    console.log(this.name)
  }

  getAge() {
    console.log(this.age)
  }

  getMonney() {
    console.log(this.monney) // [ts] 属性 monney 为私有属性,只能在类 Person 中访问
  }
}

let person = new person('jack', 20, '10000')

多态

同一个接口可以不同实现,保持子类的开发性和灵活性,面向接口编程

class Animal {
  public name
  protected age
  private weight

  constructor(name, age, weight) {
    this.name = name
    this.age = age
    this.weight = weight
  }
}

class Person extends Animal {
  private monney

  constructor(name, age, weight, monney) {
    super(name, age, weight)
    this.monney = monney
  }

  speak() {
    console.log('hi hi')
  }
}

class Dog extends Animal {
  private monney

  constructor(name, age, weight) {
    super(name, age, weight)
  }

  speak() {
    console.log('汪汪~~')
  }
}

let p = new Person('jack', 10, 10, 10)
p.speak()

let d = new Dog('rose', 10, 10)
d.speak()

设计原则

单一职责原则

  • 一个程序只做好一件事
  • 如果功能特别复杂就拆分

开放封闭原则

  • 对扩展开放,对修改关闭
  • 增加需求时,扩展新代码,而非修改已有代码
  • 这是软件设计的终极目标
function parseJSON() {
  return response.json()
}

function checkStatus(response) {
  if (response.status >= 200 && response.status < 300) {
    return response
  }

  const error = new Error(response.statusText)
  error.response = response
  throw error
}

export default function requset(url, options) {
  return fetch(url, options)
    .then(checkStatus)
    .then(parseJSON)
    .then(data => data)
    .catch(err => ({ err }))
}

其他原则

  • 里氏替换原则
  • 接口隔离原则
  • 依赖倒置原则

你可能感兴趣的:(设计模式(0) 面向对象&设计原则)