jobo: OO bgColorChanger - next try: alles in einem Objekt

Beitrag lesen

Hallo,

Meinst du, man sollte Objektmethoden nicht als Event-Handler verwenden? Wieso?

Nun ja, dann ist das Objekt wohl eher ein Namespace für eine Methodensammlung, die mit Eventhandlern verknüpft werden.

Objekte, vor allem in JavaScript, sind immer Namespaces für Methoden sowie Status-Variablen.

Dann habe ich das jetzt mal alles in eine eigenes Objekt verpackt, um den allgemeinen Namensraum nicht zu verschmutzen. Und definiere im Timeout eine Funktion, die eine Objektmethode aufruft, um das "this" korrekt zu erhalten:

  
<script type="text/javascript">  
[code lang=javascript]  
var MyBgColorChanger;  
MyBgColorChanger = {  
    red : false,  
    green : false,  
    blue : false,  
    bgElem : false,  
    createColorObj : function (value, range) {  
        return {  
            "value": value,  
            "tmpValue" : value,  
            "range" : range,  
            "goDown" : true  
        };  
    },  
    init : function (bgElem, redVal, greenVal, blueVal) {  
        this.bgElem = bgElem;  
        this.red = this.createColorObj(redVal, 55);  
        this.green = this.createColorObj(greenVal, 10);  
        this.blue = this.createColorObj(blueVal, 16);  
    },  
    getValue : function (colorName) {  
        if (this[colorName].tmpValue < this[colorName].value - this[colorName].range) {  
            this[colorName].goDown = false;  
        }  
        if (this[colorName].tmpValue > this[colorName].value) {  
            this[colorName].goDown = true;  
        }  
        if (this[colorName].goDown) {  
            this[colorName].tmpValue -= 1;  
        } else {  
            this[colorName].tmpValue += 1;  
        }  
        return this[colorName].tmpValue;  
    },  
    bgColorChange : function () {  
        var red, green, blue;  
        red = this.getValue("red");  
        green = this.getValue("green");  
        blue = this.getValue("blue");  
        this.bgElem.style.backgroundColor = "RGB(" + red + "," + green + "," + blue + ")";  
    }  
};  
  
window.onload = function () {  
    var myBgElem;  
    myBgElem = document.getElementsByTagName("body")[0];  
    MyBgColorChanger.init(myBgElem, 255, 168, 136);  
    window.setInterval(function () {MyBgColorChanger.bgColorChange(); }, "120");  
};  

</script>
<body>
</body>

[/code]

Gruß

jobo

0 59

OO Backgroundcolorchanger - optimieren /Kontext von this

jobo
  • javascript
  1. 0
    unknown
    1. 0

      OO - optimieren /Kontext von this - was macht der Browser da?

      jobo
      1. 0
        unknown
        1. 0
          jobo
          1. 0
            unknown
            1. 0
              jobo
              1. 0
                unknown
                1. 0
                  jobo
                  1. 0
                    unknown
  2. 0
    ChrisB
    1. 0
      jobo
      1. 0
        ChrisB
        1. 0
          jobo
          1. 0
            molily
            1. 0
              jobo
      2. 0
        molily
        1. 0
          jobo
          1. 0
            molily
            1. 0

              OO bgColorChanger - next try: alles in einem Objekt

              jobo
              1. 0

                OO bgColorChanger - next try: alles in einem Objekt - kl. opt.

                jobo
                1. 0
                  unknown
                  1. 0
                    jobo
                    1. 0
                      jobo
                      1. 0

                        colorChanger - rein funktional - Feinschliff

                        jobo
                        1. 0
                          jobo
                          1. 0

                            colorChanger - Feinschliff en Detail, macht das Sinn?

                            jobo
                            1. 0
                              molily
                              1. 0
                                jobo
                                1. 0
                                  molily
                          2. 0
                            molily
                            1. 0
                              jobo
                              1. 0
                                unknown
                                1. 0
                                  jobo
                                  1. 0
                                    unknown
                                2. 0
                                  molily
                                  1. 0
                                    unknown
                  2. 2
                    molily
                    1. 0
                      unknown
                      1. 0
                        molily
                        1. 0
                          molily
                          1. 0
                            unknown
                            1. 0
                              jobo
                            2. 0
                              jobo
                            3. 0

                              OO bgColorChanger - mit Closure (verschachtelte Objekte)

                              jobo
                            4. 0
                              molily
                              1. 0

                                OO bgColorChanger - elegant oder zumindest vernünftig!

                                jobo
                    2. 0
                      jobo
                    3. 0

                      bgColorChanger - OO vs. funktional

                      jobo
                      1. 1
                        molily
                        1. 0
                          jobo
  3. 0

    OO - Zugriff auf Objektmethode mittels Namen als Stringparameter

    jobo
    1. 0
      unknown
      1. 0
        jobo
        1. 0
          ChrisB
          1. 0
            jobo
        2. 0
          unknown
    2. 0
      molily
      1. 0
        jobo