JavaScript Паттерны

Присвоение значения переменной

var store = window.store || {};

// store = window.store, если  window.store != undefined
// store = {} , если  window.store == undefined

Класс

 // A car "class"
function Car( model ) {

  this.model = model;
  this.color = "silver";
  this.year  = "2012";

  this.getInfo = function () {
    return this.model + " " + this.year;
  };

}

var myCar = new Car("ford");

myCar.year = "2010";

console.log( myCar.getInfo() );


Наследование классов

var firstObject = {
    somevalue: 1
};

var secondObject = Object.create( firstObject );

console.log( secondObject.somevalue ); // 1


Замыкания

()();

(function(){return 1;})();


Полная аналогия методов создания класса как в других языках программирования

var MyClass = (function(){


    // Определение свойств класса
    var prop1 = 1;
    var prop2 = 2;

    // Определение частных (private - закрытых для внешнего доступа) методов
   function private_method1() {return 4};
   function private_method2() {return 5};

    // Определение публичных (public - доступных для внешнего доступа) методов класса
    return {
         method1: function(){console.log(prop1);},
         method2: function(){console.log(prop2);},
         method3: function(){prop1 = 3;},
         method4: function(){return private_method1() + private_method2();}
    };

})();

MyClass.method1(); // 1
MyClass.method2(); // 2
MyClass.method3(); // prop1 = 3
MyClass.method1(); // 3
MyClass.method4(); // 9


Передача переменных внутрь модуля, замыкания, класса
Импортирование переменных внутрь класса

var MyModule = (function( $, _ ){

    function private1(){console.log($.jquery())};
    function private2(){_.each([1, 2, 3], alert);};

    return {
        public: function(){
            private1();
            private2();
        }
    };

})(jQuery, underscore);

MyModule.public();


Класс Синглтон - создает только 1 объект на всю программу, если он не создан, или возвращает его же, если он уже создан, а не создает его заново

var mySingleton = (function () {

  // Instance stores a reference to the Singleton
  var instance;

  function init() {

    // Singleton

    // Private methods and variables
    function privateMethod(){
        console.log( "I am private" );
    }

    var privateVariable = "Im also private";

    var privateRandomNumber = Math.random();

    return {

      // Public methods and variables
      publicMethod: function () {
        console.log( "The public can see me!" );
      },

      publicProperty: "I am also public",

      getRandomNumber: function() {
        return privateRandomNumber;
      }

    };

  };

  return {

    // Get the Singleton instance if one exists
    // or create one if it doesn't
    getInstance: function () {

      if ( !instance ) {
        instance = init();
      }

      return instance;
    }

  };

})();


Private method - Частные методы классов (Сотри также чуть выше)

var basketModule = (function () {

  // privates

  var basket = [];

  function doSomethingPrivate() {
    //...
  }

  function doSomethingElsePrivate() {
    //...
  }

  // Return an object exposed to the public
  return {

    // Add items to our basket
    addItem: function( values ) {
      basket.push(values);
    },

    // Get the count of items in the basket
    getItemCount: function () {
      return basket.length;
    },

    // Public alias to a  private function
    doSomething: doSomethingPrivate,

    // Get the total value of items in the basket
    getTotal: function () {

      var q = this.getItemCount(),
          p = 0;

      while (q--) {
        p += basket[q].price;
      }

      return p;
    }
  };
}());


Декоратор

function sum(a, b){
    return a + b;
}

alert(sum(1, 2)); // 3
alert(sum(2, 3)); // 5



function decorator2X(func){
    return function(){
        return 2 * func.apply(this, arguments);
    }
}

sum = decorator2X(sum);

alert(sum(1, 2)); // 6
alert(sum(2, 3)); // 10


Синглтон

var singleton = {
    property: 'somevalue',
    log: function(text){
                                      console.log(text);
                               }
};


Создание цепочки вызова методов

var obj = {
    method1: function(){return this;},
    method2: function(){return this;}
};

var new_obj = obj;
new_obj.method1().method2();


Фабрика объектов

var Shapes = {
    Circle: function (param) {
        console.log("new " + param.color + " circle created with radius " + param.radius + "px");
    },
    Square: function (param) {
        console.log("new " + param.color + " square created with " + param.side + "px on a side ");
    },
    Triangle: function (param) {
        console.log("new " + param.color + " triangle created with " + param.side + "px on a side ");
    }
};

function ShapeFactory(size, color) {
    this.size = size;
    this.color = color;
}

ShapeFactory.prototype = {
    constructor: ShapeFactory,

    makeCircle: function () {
         return new Shapes.Circle({ radius: this.size / 2, color: this.color });
    },
    makeSquare: function () {
         return new Shapes.Square({ side: this.size, color: this.color });
    },
    makeTrinagle: function () {
         return new Shapes.Triangle({ side: this.size, color: this.color });
    }
}

var factory = new ShapeFactory(100, "red")

factory.makeSquare();
factory.makeSquare();
factory.makeTrinagle();
factory.makeCircle();
factory.makeTrinagle();


Memoization - сохранение результатов выполнения функции в памяти функции

function calculation(x, y) {
        var key = x.toString() + "|" + y.toString();
        var result = 0;

        if (!calculation.memento[key])
        {
            for (var i = 0; i < y; ++i) result += x;
            calculation.memento[key] = result;
        }
        return calculation.memento[key];
}

calculation.memento = {};


Наблюдатель

(#button).click( obsever_function );


Event = function()
{
    this._observers = [];
}

Event.prototype = {

    raise: function (data) {
        for (var i in this._observers)
        {
            var item = this._observers[i];
            item.observer.call(item.context, data);
        }
    },

    subscribe: function (observer, context) {
        var ctx = context || null;
        this._observers.push({ observer: observer, context: ctx });
    },

    unsubscribe: function (observer, context ){
        for (var i in this._observers)
            if ( this._observers[i].observer == observer &&
                 this._observers[i].context == context )
                    delete this._observers[i];
    }

var someEvent = new Event();
someEvent.subscribe(function ( data ) { console.log("wohoooooo " + data ) });

var someObject = {
    _topSecretInfo: 42,
    observerFunction: function () { console.log("Top Secret:" + this._topSecretInfo) }
}

someEvent.subscribe(someObject.observerFunction, someObject);
someEvent.raise("yeaah!");
someEvent.raise();
} 



сonsole.log(calculation(2, 100000000));