[ MilosDj @ 19.07.2011. 21:30 ] @
Napravio sam mali timer! Html, css, js. Nista preterano posebno. Timer ucita json file, odredi koliko ima vremenskih stavki i polako odbrojava jednu po jednu stavku kako ide vreme. Odbrojavanje se i prikazuje u jednom <div>.
To lepo radi samo za sebe, kao otvoren tab u browseru.

Ja bih hteo to da nekako enkapsuliram, moduliram, sabijem u jednu klasu, reuse code... Upotrebite izraz koji vam je drag

Hocu ovo:
Code:
 var timer = new Timer();
 document.body.appendChild(timer.html_elem);
I da tako mogu da napravim 50 timera ako pozelim.

Sad nailazimo na moj problem:

1. klasa Timer nije samostalna! Koristi mnoge globalno definisane funkcije: loadFile, rndID, isArray, isObject...
2. koristi jos 3 manje klase Sound, TimerObject i View... koje instancira u sebi.
3. tu je i input_file() koja se poziva kad se ucitava file...

Ja bih zeleo nekako SVE to, sve sto je potrebno za taj timer da upakujem u nesto i da na kraju dobijem var timer = new Timer(); ili makar priblizno jednostavno.

Pitanja:

1. Da li je to moguce?

2. Kako?

3. Sta je najpravilnije, najbolje, najzahvalnije za koriscenje/odrzavanje koda...?



Upravo gledam ovo:
Code:

(function () {
    // ... all vars and functions are in this scope only
    // still maintains access to all globals
}());

i ovo:

var MODULE = (function () {
    var my = {},
        privateVariable = 1;
    
    function privateMethod() {
        // ...
    }
    
    my.moduleProperty = 1;
    my.moduleMethod = function () {
        // ...
    };
    
    return my;
}());


Ali ne zelim da pocnem refactoring (kasapljenje) koda pre nego sto se posavetujem ovde.
[ misk0 @ 19.07.2011. 22:28 ] @
1. Da

2. recimo
Code (javascript):

Timer = function() {
   //constructor
    .  
    .
    var localVar;
    this.publicvar;
}
Timer.prototype = {
    firstMethod : function() {
    }
    secondMethod : function() {
    }
}
 


razmisli i o koristenju namespace-ova.
[ MilosDj @ 20.07.2011. 07:55 ] @
Ok, da vidim da li sam te dobro razumeo:

- Timer = function() { //constructor} je isto sto i function Timer() { //constructor }

- poenta je ubaciti objekat u prototip funkcije koju pravim.
u taj objekat stavim sve trenuno globalne f() i sve druge objekte...

Nije mi palo na pamet da mogu unutar f da imam this.zvono = new this.Sound();

Ima li jos neki nacin a da ga ljudi postuju, koriste, kazu da je ok?


Kad kazes namespace da li si mislio na ovo:

Code:
var yourNamespace = {

    foo: function() {
    },

    bar: function() {
    }
};
...
yourNamespace.foo();


var ns = new function() {

    var internalFunction = function() {

    };

    this.publicFunction = function() {

    };
};
[ Aleksandar Ružičić @ 20.07.2011. 08:19 ] @
Pogledaj ovo - http://www.yuiblog.com/blog/2007/06/12/module-pattern/
[ MilosDj @ 20.07.2011. 10:03 ] @
Da vidim koliko sam ukapirao:


Primer 2: Jedini razlog sto ovde koristi lambdu (function(){})(); umesto da direktno vrati objekat return {}; je zelja da kasnije dodaje "private" var/methods. Da ili Ne?

Code:
YAHOO.myProject.myModule = function () {

   // private vars,methods

    return  {
        myPublicProperty: "I'm accessible as YAHOO.myProject.myModule.myPublicProperty.",
        myPublicMethod: function () {
            YAHOO.log("I'm accessible as YAHOO.myProject.myModule.myPublicMethod.");
        }
    };

}();

Takodje dodatni razlog koriscenja lambde je onemogucavanje ponovnog pravljenja objekta. Dobio je singleton jer ce se YAHOO.myProject.myModule = function (){}(); izvrsiti samo jednom.

Lako je mogao da uradi ovo:

function MyModule(){}
YAHOO.myProject.myModule = new MyModule();

ali onda ga nista ne sprecava da ponovo koristi MyModule + MyModule f je usla u global namespace.
Da/Ne?


To je sto se tice namespace-a.

misk0v metod mi je jasan. Pre nego sto pocnem da radim, zelim da pitam ima li jos neki metod upakivanja koda a da moze odmah da se izvrsi i da mi bude odmah na raspolaganju?
[ Nikola Poša @ 20.07.2011. 18:34 ] @
Module pattern je proširenje singleton pattern-a, i ja često koristim taj pristup kako ne bih "zagadio" global scope tim nekim funkcijama koje napišem.

Suština je upravo to, logiku zatvoriš u tu neku f-ju koju odma' izvršiš, i povratnu vrednost, koja je u stvari taj objekat, upišeš u promenljivu, u tom slučaju YAHOO.myProject.myModule. Sve privatne varijable/f-je koje bi definisao pre samog return-a će biti dostupne metodama tog javnog objekta (closures), jer će ih ove zatvoriti, wrap-ovati pre nego što se taj objekat vrati kao povratna vrednost. Možda bi ti bilo jasnije da je taj deo zapisan ovako:
Code:
YAHOO.myProject.myModule = function () {
   // private vars,methods

    var self = {};

    self.myPublicProperty = "I'm accessible as YAHOO.myProject.myModule.myPublicProperty.";
    self.myPublicMethod = function () {
        YAHOO.log("I'm accessible as YAHOO.myProject.myModule.myPublicMethod.");
    };

    return self;
}();
[ MilosDj @ 20.07.2011. 19:50 ] @
Hvala svima na odgovorima.
Mislim da sam shvatio nacin pravljenja namespace.

Za sada imam misk0v nacin "moduliranja" objekata.

Drugi nacin bi valjda bio:
Code:
var timer = (function () {

  var lokalno_globalnal;
  function Timer () {... = new nj();}
  function nj(){..}

return Timer;    // onda u kodu new, ...
}());

i onda
var t = new timer();


Ako se neko seti boljeg nacina, nek slobodno napise :)
[ misk0 @ 20.07.2011. 20:43 ] @
Za namespace-e sam mislio nesto ovako

Code (javascript):

if (!com) {
  var com = {};
}
if (!com.myapp) {
 com.myapp = {};
}
if (!com.myapp.component) {
 com.myapp.component = {};
}
 


tako imas name space com.myapp.component gdje kasnije stavljas sve objekte.
Mozes tako kreirati i strukturu direktorija pa da imas sve slozeno i znas gdje se sta nalazi.
[ MilosDj @ 20.07.2011. 22:06 ] @
Za sada sam izabrao var namespace = new function () {......}. Malo izmenio imena i sve nekada globalne funkcije su pokrivene jednim imenom. Ok, nije lose. Mali napredak.


Ali enkapsulacija... Sve ovo pisem jer sam ocekivao da cu se okoziti od menjanja koda i debagovanja. Na moju srecu proslo je iznenadjujuce glatko:
Samo sam prebacio 3 klase/funkcije u Timer {} snimio .js i sve je proradilo iz prve!

Nije mi jasno zasto i dalje vucem C++ klasni mentalitet u glavi?! :(



Jos jedan dobar link:

http://www.klauskomenda.com/co...t-programming-patterns/#module

[Ovu poruku je menjao MilosDj dana 20.07.2011. u 23:37 GMT+1]
[ MilosDj @ 21.07.2011. 00:15 ] @
Hmmm, a kako se stavljaju klase/funkcije na namespace

Npr imam function Audio (){} koju uvek instanciram sa var a = new Audio('src', 'id');.

Sad sam se napravio pametan pa sam i Audio prebacio u onaj namespace Prestala je da se instancira.

new ns.Audio();
new ns.Audio.constructor();

Napravio sa u ns pomocnu funkciju koja deklarise Audio i vraca return new Audio(); ali ni to nesto nece...

Resenje je?
[ MilosDj @ 21.07.2011. 14:08 ] @
Ahem, izvinjavam se svima...

Resenje: treba resetovati FF posle 2 dana neprekidnog programiranja
Onda sve volshebno proradi

var a = new ns.Audio(); radi besprekorno :-D