odwolanie sie do pola obiektu i do pola funkcji

0

Więc tak mam taki kod

http://4programmers.net/Pastebin/3252

jak widać jest to klasa (mozecie ocenic poprawnosc gdyż wlasnie ucze się obiektowosci w JS) i mam taki problem ze klasa ma metode onclick i inne odpowiedzialne za eventy i teraz chciałbym w tym evencie przypisać coś do pola klasy tyle że this w funkcji eventu wskazuje mi na objekt który wywolal event a nie na obiekt mojej klasy.

Innymi slowy linia 47:

this.style.background = this.config.color; //

mam diva i po kliknieciu ma zmienic sie mu tlo na to z config.color tyle ze this po lewej to wlasnie ten div a chcialbym zeby this po prawej to byl mój obiekt i nie wiem jak to zrobic

0

No więc jak tworzyc klase i jak to bedzie z tym this'em?

0

Praktyką, z którą ja się spotykam jest przypisanie _this = this, np:

 
var Obiekt = {
     _this : this,
     onclick = function(){
              //Tu korzystamy z _this jeżeli chcemu się odwołać do Obiekt
              // z this jeżeli chcemy się odwołać do obiektu HTML, na którym zdarzenie zostało wywołane.
     }
}

Problem jest w tym, że jeżeli zdarzenie zostanie wywołane na danym obiekcie HTML to wewnątrz funkcji "this" wskazuje właśnie na ten element i funkcja "nie wie" w jakim kontekście jest odpalana.
Co do obiektowości.
Jeżeli chcesz mieć jeden obiekt danego typui to robisz po prostu mapę tak jak to jest w kodzie powyżej. Jeżeli chcesz mieć więcej elementów danego typu to robisz konstruktor:

 
function _Obiekt(){
     _this = this;
     _this.jakasZmienna = costam;
     _thisjakasFunkcja = function(){

     }
}

Później tworząc nowy obiekt robisz tak:

 
var nowyObiekt = new _Obiekt();
0

no chcialbym robic kilka instancji dlatego pisalem o klasie wiec jeszcze jedno pytanie do czego i jak sie stosuje prototype?

0

Z prototype korzystałem parę razy i nie wiem czy odpowiem dobrze, ale prototype używasz kiedy chcesz zmienić klasę a nie obiekt. Na przykładzie:
Mamy klasę String. Chcemy, aby jej obiekty miały funkcje, która zwraca true jeżeli w ciągu znaków znajduje się litera "A". Robimy:

 
String.prototype.isAInText = function(){return this.toString().indexOf("A") > -1}

Teraz tworząc obiekty typu String możesz korzystać z nowej funkcji.
Tak więc moim zdaniem wykorzystanie prototype ma sens jeżeli chcemy modyfikować klasy "wbudowane w javascript". W przypadku klas, które tworzymy sami jest bezużyteczna bo możemy zmodyfikować oryginalną klasę i nie musimy później dobierać się do niej przez prototype.
Większość moich informacji jest bardziej efektem doświadczeń niż znajomości teorii więc jeżeli się mylę to proszę bardziej rozumnych o poprawę:)

0

aha chyba ze tak bo na początku myslalem że metody które nie są przypisane do prototype są wspólne dla wszystkich obiektów czyli ze tak jakby statyczne :D

0

Zależy co masz na myśli mówiąc "wspólne". Wspólne są bo dla każdego obiektu metody sa takie same (na tym polega idea robienia klas:) ).
Ale chyba wiem o co Ci chodzi. Funkcja wywołana na obiekcie jest wywoływana w jej kontekście. Tzn korzysta ze zmiennych konkretnie tego obiektu.

1

ponieważ w JS nie ma (jeszcze) klas, spotyka się co najmniej kilka różnych metod implementacji tego wzorca projektowego (jeśli potraktować "klasę" jako wzorzec projektowy, a nie jako element języka). W sumie teraz można zrobić "klasę" bardzo prosto używając funkcji Object.create:
http://jsfiddle.net/cA7MU/1/

(a tak dokładniej to funkcja Object.create robi obiekt na podstawie innego obiektu, który staje się jego prototypem).

// to jest nasz "prototyp" (mozna to nazwac i klasa w tym przypadku):
var Samochod = { 
    ileKol: 4,
    uzyj: function() {
        alert("po użyciu samochód marki " + this.nazwa + " zaczyna jechać");
        alert("i ma " + this.ileKol + " koła");
    },
    toString: function() {
        return "[obiekt 'klasy' Samochod i marki " + this.nazwa + "']";
    }
}

// a to jest "fabryka", funkcja tworząca samochody:
function stworzSamochod(nazwa) {
    var samochod = Object.create(Samochod);
    samochod.nazwa = nazwa;
    document.getElementById(nazwa).addEventListener('click', function() {
        // żeby się dostać do zmiennej samochodu
        // używamy zewnętrznej zmiennej samochod:
        samochod.uzyj();
        // jednoczesnie, poniewaz jestesmy w funkcji obslugujacej zdarzenie,
        // zmienna this to przycisk (HTMLButtonElement), wiec mozemy odwolac sie 
        // do innerHTML
        this.innerHTML = "Jedzie";
        this.style.backgroundColor = 'red';
    });
    return samochod;
}

var ferrari = stworzSamochod('Ferrari');
var fiat = stworzSamochod('Fiat');

1 użytkowników online, w tym zalogowanych: 0, gości: 1