了解前端的设计模式

92 阅读1分钟

设计模式

jquery工厂模式

(function(){

  function JQuery(dom, context) {

    return new JQuery.fn.init(dom, context);

  }

  // 中间转换

  JQuery.fn = JQuery.prototype = {

    constructorJQuery,

    hide(params) => {

      console.log(params+'@@@'+'hide')

    }

  }

  function init(dom, context) {}

  JQuery.fn.init = init;

  init.prototype = JQuery.fn//或者是init.prototype = JQuery.prototype


  if(typeof window !== "undefined") {

    window.$ = window.JQuery = JQuery;

  }

})();

如果直接返回juqery的实例会怎么样能,让我们来见证奇迹吧

// error:  Maximum call stack size exceeded 栈溢出 new的执行原来会把函数执行
(function(){

  function JQuery(dom, context) {

    return new JQuery();

  }

  JQuery.prototype = {

    constructorJQuery,

    hide(params) => {

      console.log(params+'@@@'+'hide')

    }

  } 
  
  if(typeof window !== "undefined") {  window.$ = window.JQuery = JQuery;  }

})();