设计模式知识连载(14)---工厂方法模式:

来源:互联网 发布:java开源的cms 编辑:程序博客网 时间:2024/06/06 02:42
<body><h3>设计模式知识连载(14)---工厂方法模式:</h3><p>    工厂方法模式:创建多类(不同种类的)对象</p><div id = 'container' ></div><script type="text/javascript">    /**    *   案例,方式一:常规写法    */    // // 创建Java学科类    // var Java = function (content) {    //  // 将内容保存在content里面以备日后使用    //  this.content = content ;    //  // 创建对象时,通过闭包,直接执行,将内容按需求的样式插入到页面内    //  (function(content){    //      var _div = document.createElement('div') ;    //      _div.innerHTML = content ;    //      _div.style.color = 'green' ;    //      document.getElementById('container').appendChild(_div) ;    //  })(content) ;    // } ;    // // 创建PHP学科类    // var Php = function(content) {    //  this.content = content ;    //  (function(content) {    //      var _div = document.createElement('div') ;    //      _div.innerHTML = content ;    //      _div.style.color = 'yellow' ;    //      _div.style.background = 'red' ;    //      document.getElementById('container').appendChild(_div) ;    //  })(content) ;    // } ;    // // 创建JavaScript学科类    // var JavaScript = function(content) {    //  this.content = content ;    //  var _div = document.createElement('div');    //  _div.innerHTML = content ;    //  _div.style.color = 'blue' ;    //  document.getElementById('container').appendChild(_div) ;    // }    // var java = new Java('这是Java的广告') ;    // var php = new Php('这是Php的广告') ;    // var javascript = new JavaScript('这是javascript的广告') ;    /**    *   案例,方式二:简单工厂模式    */    // // 创建Java学科类    // var Java = function (content) {    //  // 将内容保存在content里面以备日后使用    //  this.content = content ;    //  // 创建对象时,通过闭包,直接执行,将内容按需求的样式插入到页面内    //  (function(content){    //      var _div = document.createElement('div') ;    //      _div.innerHTML = content ;    //      _div.style.color = 'green' ;    //      document.getElementById('container').appendChild(_div) ;    //  })(content) ;    // } ;    // // 创建PHP学科类    // var Php = function(content) {    //  this.content = content ;    //  (function() {    //      var _div = document.createElement('div') ;    //      _div.innerHTML = content ;    //      _div.style.color = 'yellow' ;    //      _div.style.background = 'red' ;    //      document.getElementById('container').appendChild(_div) ;    //  })(content) ;    // } ;    // // 创建JavaScript学科类    // var JavaScript = function(content) {    //  this.content = content ;    //  (function() {    //      var _div = document.createElement('div');    //      _div.innerHTML = content ;    //      _div.style.color = 'blue' ;    //      document.getElementById('container').appendChild(_div) ;    //  })(content) ;    // } ;    // function JobFactory(type ,content) {    //  switch (type) {    //      case 'java' :     //          return new Java(content) ;    //      case 'php' :    //          return new Php(content) ;    //      case 'javascript' :    //          return new JavaScript(content) ;        //  } ;    // } ;    // JobFactory('java', '这是Java的广告') ;    // JobFactory('php', '这是Php的广告') ;    // JobFactory('javascript', '这是JavaScript的广告') ;    /**    *   案例,方式三:安全的工厂方法    */    var Factory = function(type, content) {        // 安全模式类         if(this instanceof Factory ){            var s = new this[type](content) ;            return s ;        }else{            return new Factory(type, content) ;        } ;    } ;    Factory.prototype = {        Java : function(content) {            this.content = content ;            (function() {                var _div = document.createElement('div') ;                _div.innerHTML = content ;                _div.style.color = 'green' ;                document.getElementById('container').appendChild(_div) ;            })(content) ;        },        Php : function(content) {            this.content = content ;            (function() {                var _div = document.createElement('div') ;                _div.innerHTML = content ;                _div.style.color = 'yellow' ;                _div.style.background = 'red' ;                document.getElementById('container').appendChild(_div) ;            })(content) ;        },        JavaScript : function(content) {            this.content = content ;            (function() {                var _div = document.createElement('div') ;                _div.innerHTML = content ;                _div.style.color = 'blue' ;                document.getElementById('container').appendChild(_div) ;            })(content) ;        },        UI : function(content) {            this.content = content ;            (function() {                var _div = document.createElement('div') ;                _div.innerHTML = content ;                _div.style.border = '1px solid red' ;                document.getElementById('container').appendChild(_div) ;            })(content) ;        }    } ;    var data = [        {type : 'Java', content : '这是Java的广告'},        {type : 'Php', content : '这是Php的广告'},        {type : 'JavaScript', content : '这是JavaScript的广告'},        {type : 'UI', content : '这是UI的广告'},    ] ;    for(var i = 0; i < data.length; i++) {        console.log(data[i].type+'---'+data[i].content) ;        Factory(data[i].type, data[i].content) ;    }    /**    *   安全模式类小Demo    */     // 正常情况    var Demo = function() {} ;    Demo.prototype = {        show : function() {            console.log('成功获取') ;        }    } ;    var demo1 = new Demo() ;    var demo2 = Demo() ;    demo1.show() ;  // 成功获取    // demo2.show() ;   // Uncaught TypeError: Cannot read property 'show' of undefined    // 使用安全模式类    var DemoSafety = function() {        if(!(this instanceof(DemoSafety))) {            return new DemoSafety() ;        }       } ;    DemoSafety.prototype = {        show : function() {            console.log('获取成功~~~') ;        }    } ;    var demosafety1 = new DemoSafety() ;    var demosafety2 = DemoSafety() ;    demosafety1.show() ;    //  获取成功~~~    demosafety2.show() ;    //  获取成功~~~</script></body>
原创粉丝点击