Structural Design pattern

JS structural design pattern

by bhupendra negi

HTML

<ul> Structural Design Pattern
  <li>
    Decorator Pattern
  </li>
  <li> Facade Pattern</li>
</ul>

JavaScript

/* Decorator  pattern */
/*
function Task(name) {
  this.name = name;
  this.completed = false;
}

Task.prototype = {
    complete: function() {
      this.completed = true;
    },
    toString: function() {
      console.log("The task is " + this.name + " and its status is :" + this.completed)
    }
  }
  //var task1 = new Task("demo for Decorator pattern");
function UrgentTask(name, priority) {
  Task.call(this, name);
  this.priority = priority;
}
UrgentTask.prototype = Object.create(Task.prototype);
var ut = new UrgentTask("urgent task", 1);

ut.complete();

// more methods can be decorated or added to urgent task Object;
UrgentTask.prototype.getPriority = function() {
  console.log("The priority of " + this.name + " is " + this.priority);
}
ut.getPriority();
// can override exiting methods of parent
UrgentTask.prototype.toString = function() { // perform some own action
  console.log("saving urgent Task");
  Task.prototype.toString.call(this);
};

ut.toString();
*/

/* Facade  Pattern */

var Ftask = function(data) {
  this.name = data.name;
  this.priority = data.priority;
  this.completed = data.completed;
};

var FtaskService = function() {
  // this is module pattern
  return {
    complete: function(task) {
      task.completed = true;
      console.log("task is completed");
    },
    setPriority: function(task, priority) {
      task.priority = priority;
      console.log("Priority updated to " + priority)
    },
    save: function(task) {
      console.log("This task " + task.name + "has been saved");
    }
  }
}();

// now create tasks
var myTask = new Ftask({
  name: "Facade Task",
  priority: 0,
  completed: false
});
// below is the complex things that needs to be wrapped using facade pattern
/*
FtaskService.complete(myTask);
if (myTask.completed) { // call rest of methods
  FtaskService.setPriority(myTask, 1);
  FtaskService.save(myTask);
}
*/

var FtaskServiceWrapper = function() {
  var setandsave = function(myTask) {
   ...