观察者模式-蒲公英云

观察者模式

js观察者模式

<!DOCTYPE>
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <meta content="text/html" charset="utf-8">
 </head>
    <style>
    div{
        margin:10px;
        width:500px;
        height:200px;
        border:1px solid red;
    }
    #ad{
        border: 1px solid blue;
    }
    </style>
 <script>
     window.onload = function(){
         var sel = document.getElementById('subject');
         sel.observers = {};
         var content = document.getElementById('content');
         var ad = document.getElementById('ad');
         var study = document.getElementById('study');
         //添加观察者
         sel.attach = function(key,obj){
             this.observers[key] = obj;
         }
         //删除观察者
         sel.detach = function(key){
             delete this.observers[key];
         }
         //通知观察者
         sel.onchange = sel.notice = function(){
             for(var key in this.observers){
                 this.observers[key].update(this);
             }
         }
         //观察者更新规则
         content.update = function(subject){
             if(subject.value == 'male')
                 this.style.background = 'blue';
             else if(subject.value == 'female')
                 this.style.background = 'pink';
         }
         ad.update = function(subject){
             if(subject.value == 'male')
                 this.innerHTML = '汽车';
             else if(subject.value == 'female')
                 this.innerHTML = '美容';
         }
         study.update = function(subject){
             if(subject.value == 'male')
                 this.innerHTML = '如何年薪百万，迎娶白富美';
             else if(subject.value == 'female')
                 this.innerHTML = '如何做美丽女强人';
         }
         //添加观察者
         sel.attach('content',content);
         sel.attach('ad',ad);
         sel.attach('study',study);
     }
 </script>
 <body>
  <h1>观察者模式切换</h1>
  <select name="" id="subject">
    <option value="male">男式风格</option>
    <option value="female">女士风格</option>
  </select>
  <div id="content">我是内容</div>
  <div id="ad">我是广告</div>
  <div id="study">学习</div>
 </body>
</html>

php观察者模式

<?php
//被观察对象类
class user implements SplSubject{
    public $lognum;
    public $hobby;
    public function __construct($hobby){
        $this->lognum = rand(1,10);
        $this->hobby = $hobby;
        $this->observers = new SplObjectStorage();      //spl标准库对象，存储观察者的存储对象
    }
    public function login(){
        $this->notify();
    }
    public function attach(SplObserver $observer){
        $this->observers->attach($observer);
    }
    public function detach(SplObserver $observer){
        $this->observers->detach($observer);
    }
    public function notify(){
        $this->observers->rewind();     //将指针指向对象头部
        while($this->observers->valid()){
            $observer = $this->observers->current();    //弹出一个观察者对象
            $observer->update($this);
            $this->observers->next();
        }
    }
}
//观察者类
class secrity implements SplObserver{
   public function update(SplSubject $subject){
        if($subject->lognum <3)
            echo '这是你第'.$subject->lognum.'次登录';
        else
            echo '这是你第'.$subject->lognum.'次登录,登录异常';
   }
}
class ad implements SplObserver{
    public function update(SplSubject $subject){
        if($subject->hobby == 'sport')
            echo "\n".'直播欧冠决赛';
        else
            echo "\n".'买买买';
    }
}
//进行观察
$user = new user('sport');
$user->attach(new secrity());
$user->attach(new ad());
$user->login();