js---26组合模式

简介:
复制代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
        <script type=text/javascript charset=utf-8 src=../commons/CommonUtil.js ></script>
        <script>
            
            // 组合模式 
            /*
             * 场景模拟:
             *  -> 公司 
             *            -> 财务部门
             *                        -> 张一
             *                        -> 张二
             *                        -> 张三
             *            -> 销售部门
             *                        -> 张四
             *                        -> 张五
             *                        -> 张六
             *    
             *        实际的任务具体是落实到人上去实施的 也就是说只有人才具有具体的方法实现
             *            
             */            
             
             
             var Org = function(name){
                  this.name = name ; 
                 this.depts = [] ;
             };
             Org.prototype = {
                 constructor:Org , 
                addDepts:function(child){//形参不写数据类型
                    this.depts.push(child);//this一般指的是Org对象
                    return this ;
                } , 
                getDepts:function(){
                    return this.depts;
                }
             };
             
             
             var Dept = function(name){
                  this.name = name ; 
                 this.persons = [] ;
             };
             Dept.prototype = {
                 constructor:Dept , 
                addPersons: function(child){
                    this.persons.push(child);
                    return this ;
                } , 
                getPersons:function(){
                    return this.persons;
                }
             };
             
             var Person = function(name){
                  this.name = name ; 
             };
             Person.prototype = {
                 constructor : Person ,
                hardworking : function(){
                    document.write(this.name + '...努力工作!');
                } ,
                sleeping : function(){
                    document.write(this.name + '...努力睡觉!');
                }
             };
             
             
             var p1 = new Person('张1');
             var p2 = new Person('张2');
             var p3 = new Person('张3');
             var p4 = new Person('张4');
             var p5 = new Person('张5');
             var p6 = new Person('张6');
             
             var dept1 = new Dept('开发部门');
             dept1.addPersons(p1).addPersons(p2).addPersons(p3);
             var dept2 = new Dept('销售部门');
             dept2.addPersons(p4).addPersons(p5).addPersons(p6);
             
             var org = new Org('bjsxt');
             org.addDepts(dept1).addDepts(dept2);
             
             // 需求: 具体的让一个人(张3)去努力工作
             //org.getDepts()
             org.hardworking('开发部门');
             for(var i = 0 ,depts = org.getDepts(); i<depts.length;i++ ){//for循环中也不写数据类型
                    for(var j = 0 ,persons = depts[i].getPersons(); j < persons.length ; j++){
                        if(persons[j].name === '张6'){
                            persons[j].hardworking();
                        }
                    }
             }
            
            
            
            
            
        </script>
    </head>
    <body>
    </body>
</html>
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/6883763.html,如需转载请自行联系原作者

相关文章
|
10月前
|
设计模式 JavaScript 前端开发
|
设计模式 JavaScript 前端开发
你不知道的javascript设计模式(十) ---- 组合模式
你不知道的javascript设计模式(十) ---- 组合模式
51 0
|
设计模式 JavaScript 前端开发
「设计模式 JavaScript 描述」组合模式
「设计模式 JavaScript 描述」组合模式
「设计模式 JavaScript 描述」组合模式
|
设计模式 JavaScript 前端开发
JavaScript设计模式-组合模式(16)
JavaScript设计模式-组合模式(16)
|
4天前
|
存储 JavaScript 前端开发
从零开始学习Vue.js
Vue.js 是一种流行的前端框架,它使用简单,灵活且易于上手。如果你是一个前端开发者,并想要学习 Vue.js,本文将为您提供一个从零开始的指南。我们将探讨 Vue.js 的基础知识和常用功能,以及如何构建一个简单的 Vue.js 应用程序。
|
5天前
|
缓存 JavaScript 前端开发
JavaScript:get和post的区别,2024年最新3-6岁儿童学习与发展指南心得体会
JavaScript:get和post的区别,2024年最新3-6岁儿童学习与发展指南心得体会
|
6天前
|
设计模式 存储 前端开发
JS的几种设计模式,Web前端基础三剑客学习知识分享,前端零基础开发
JS的几种设计模式,Web前端基础三剑客学习知识分享,前端零基础开发
|
8天前
|
XML Web App开发 前端开发
字节FE:JavaScript学习路线图
字节FE:JavaScript学习路线图
35 0