设计原则(SOLID)单一职责模式李式替换原则开放封闭原则接口隔离原则依赖倒置原则设计模式工厂模式将new操作单独封装遇到new时，就要考虑是否该使用工厂模式了示例你去购买汉堡，直接点餐、取餐，不会自己亲手做商店要“封装”做汉堡的工作，做好直接给买者UML类图：代码示例：class Product { constructor(name) { this.name = name; } init() { console.log(‘init’) } fn1() { console.log(‘fn1’) } fn2() { console.log(‘fn2’) }}class Creator { create(name) { return new Product(name) }}let create = new Creator();let p = create.create(‘p’)p.init()p.fn1()p.fn2()应用场景1、jQuery:$(‘div’)和new $(‘div’)有何区别？第一：书写麻烦，jQuery的链式操作将成为噩梦第二：一旦jQuery名字变化，将是灾难性的//仿jQuery代码class jQuery { constructor(selector) { let slice = Array.prototype.slice; let dom = slice.call(document.querySelectorAll(selector)) let len = dom ? dom.length : 0 for (let i = 0; i < len; i++) { this[i] = dom[i] } this.length = len this.selector = selector || ’’ } append() { console.log(‘append’); } addClass() { console.log(‘addClass’) }}window.$ = function(selector) { return new jQuery(selector);}var $p = $(‘p’)console.log($p)console.log($p.addClass)2、React.crateElement:var profile = <div> <img src=“avater.png” className=“profile”/> <h3>{[user.firstName,user.lastName].join(’’)}</h3> </div>;编译完之后：var profile = React.createElement(“div”,null, React.createElement(“img”,{src:“avater.png”,className:“profile”}), React.createElement(“h3”,null,[user.firstName,user.lastName].join(" “)));//源码实现class vnode(tag, attrs, children) { //…省略内部代码…}React.createElement = function(tag,attrs,children){ return new vnode(tag,attrs,children)}3、Vue的异步组件:Vue.component(‘async-example’, funciton(resolve, reject) { setTimeout(function() => { resolve({ template: ‘<div>I am async!</div>’ }) }, 1000);})设计原则验证：构造函数和创建者分离符合开放封闭原则单例模式系统中被唯一使用一个类中只有一个实例 实例：登录框、购物车代码演示java版的单例模式演示public class SingleObject{ //注意：私有化构造函数，外部不能new，只能内部new！！！！ private SingleObject(){} //唯一被new出来的对象 private SingleObject getInstance(){ if(instance == null){ //只new一次 instance = new SingleObject(); } return instance; } //对象方法 public void login(username,password){ System.out.println(“login…”) } } public class SingletonPatternDemo{ public static void main(String[] args){ //不合法的构造函数 //编译时报错：构造函数 SingleObject()是不可见的！！！ //SingleObject object = new SingleObject(); //获取唯一可用的对象 SingleObject object = SingleObject.getInstance(); } }Javascript版的单例模式演示class SingleObject { login() { console.log(’login…’) }}//静态方法SingleObject.getInstance = (function() { let instance return function() { if (!instance) { instance = new SingleObject(); } return instance; }})()var login = SingleObject.getInstance().login();javascript的单例模式缺点：如果强制new也不会报错:var loginnew = new SingleObject();loginnew.login()测试：//注意这里只能用静态函数getInstance，不能new SingleObject()!!!let obj1 = SingleObject.getInstance()obj1.login()let obj2 = SingleObject.getInstance()obj2.login()console.log(obj1 === obj2); //两者必须完全相同适配器模式装饰器模式代理模式外观模式观察者模式迭代器模式状态模式未完待续，每日更新