SOURCE

window.onload = function() {

  // 使用代理模式重构图片的懒加载
  // 真实对象
  let myImage = (function() {
    let imgNode = document.createElement('img'); // 创建图片节点
    document.body.appendChild(imgNode); // 把图片节点放到body
  
    return { // 返回一个对象  
      setSrc: function(src) {
        imgNode.src = src; // 把真实图片地址给到真实对象
      }
    }
  })() // 自执行函数
  
  // 代理对象 负责显示等待图片，接着拉取真实图片
  let ProxyImage = (function() {
    let img = new Image(); // 内存中的一个图片对象 代理 拉真实图片
    img.onload = function() { // 当真实图片加载完毕后触发
      setTimeout(() => {
        myImage.setSrc(this.src); // 用真实图片给到真实对象展示， this指向img
      }, 1000);
    }
    return { // 返回一个对象  
      setSrc: function(src) {
        myImage.setSrc('https://img0.baidu.com/it/u=551459933,3665289128&fm=26&fmt=auto'); // 先给真实对象变身前的图片展示
        img.src = src; // 真实图片
      }
    }
  })() 

  // 调用 直接给代理对象真实对象
  ProxyImage.setSrc('https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201507%2F27%2F20150727130241_YaEmh.jpeg&refer=http%3A%2F%2Fb-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1639276622&t=28504ee3f76602e1d91785bf6ff4cdc5');
}