前端也要知道设计模式5大原则

1. S - 单一职责原则
2. O - 开放封闭原则
3. l - 里氏替换原则
4. I - 接口独立原则
5. D - 依赖倒置原则

S - 单一职责原则
  一个程序只做好一件事.
  如果功能过于复杂就拆分开，每个部分保持独立。

O - 开放封闭原则   对扩展开放，对修改封闭
  增加需求是，扩展新代码，而非修改已经有代码
  这是软件设计的终极目标

l - 里氏替换原则
  子类能覆盖父类
  父类能出现的地方子类就能出现
  js中使用较少（弱类型 & 继承使用比较少）

I - 接口独立原则
  保持接口的单一独立，避免出现“胖接口”
  js没有接口,基本没用
  类似单一职责原则，这里更关注接口

D - 依赖倒置原则   面向接口编程，依赖于抽象而不依赖具体
  使用方只关注接口而不关注具体类的实现
  js没有接口,基本没用

用Promise来说明SO

• 单一职责原则：每个then中的逻辑只做好一件事
• 开放封闭原则：如果有新的需求，扩展then
• 对扩展开放，对修改封闭

function loadImg(src) {
    var promise = new Promise((reslove,reject)=>{
        var img  = document.createElement('img');
        img.onload = function() {
            reslove(img);
        }
        img.onerror = function() {
            reject('图片加载失败');
        }
        img.src = src;
    })
    return promise
}
var src = 'http://www.9488.com/img/logo.png';
var result = loadImg(src)

result.then(function(img){
    console.log('img.width',img.width)    
}).then(function() {
    console.log('img.height'.img.height)
}).catch(function(err) {
    console.log(err)
})
复制代码

转载于:https://juejin.im/post/5b6466f96fb9a04fd343b57d