--=[ wZine: JS: NeOOPisks OOP ]=--

JS: NeOOPisks OOP
29 Apr 1999 by Laacz

Ievads
No sākuma šādi tādi noteikumi - tev jābūt daudz maz pazīstamam ar layeriem, css, javascriptu vai arī vispār programmēšanu. Protams, ka HTMLs jāzin nu ne pārāk sekli. Un pārējo pats piedomā.

OOP (tā pati ObjektOrientētā Programmēšana) ir lieta, pie kuras i jāpierod. Tas ir pirmais. Ja proties, ka rodās problēmas ar materiāla sagremošanu, apstājies, padomā, kas par lietu, kas tev nepatīk, pameklē kaut kur to izstāstītu un tad atgriezies. Pati jēga tam visam ir tāda, ka tev, pieņemsim, lai operētu ar pieciem dažādiem objektiem, nav jāraksta katram savējās funkcijas un jādefinē katram savējie mainīgie. To vis tavā vietā izdarīs interpretators.

Šoreiz es biš pastāstīšu par OOP, kā arī parādīšu kā veidot vienkāršu (tiešām) objektiņu darbībām ar layeriem.

OOP īss pārskats
Kad tu radi savu objektu, viss, ko tu dari (faktiski tas nav viss, bet nu lai paliek) - savāc vienā kolekcijā, bariņā, čupā, istabā, pudelē visvisādas uz doto objektu attiecināmos mainīgos (propertijus, īpašības, angl. - properties) un funkcijas (metodes, angl. - methods).

Pati fīča objektiem un faktiski ideja ir tāda, ka viņus tu fari klonēt kā sagribies. To biš - sataisīt daudzus dažādus vienāda tipa objektus un tad darīt ar katru no viņiem kas vien ienāk prātiņā.

Lai mazliet pieradināu tevi pie idejas, paņemsim piemēru. Pieņemsim, ka mums ir objekts (faktiski, tips; mēs no sākuma definējam tipu, tā propertijus un metodes, bet pēc tam uztaisām reālu mainīgo ar šim tipam pienākošajamies pričendāļiem). Un mēs gribam trīs objektus - kaste1, kaste2, kaste3. Nu, tas nav grūti izdarāms. Pieņemsim, ka mums tādi trīs jau ir. Katram no viņiem tiek piešķirtas visas tās īpašības, kas mūsu tipam. Un arī metodes. Iedomāsimies, ka mūsu vēlamajam objektam būs tādi propertiji - width, height, depth. Kā mēs viņus dzemdēsim, aprunāsim biš vēlāk. Nu un tad šim objektam pienākošās metodes un īpašības mēs varam izmantot, veidojot pieraksti, ķipa tavo:

kaste3.depth = kaste3.width * kaste3.height
kaste2.width = kaste1.width
kaste1.width = kaste3.depth / kaste2.height

Pamatā mēs objektiņus taisām šādi.. hmm.. aha:

function tKaste(width, height, depth) {
this.width = width
this.height = height
this.depth = depth
}

Tātad tā, mazi paskaidrojumiņi.. Šeit mēs nodefinējām t.s. objekta konstruktoru. Faktiski ar to pietiek iekš javascripta, lai cik tas dīvaini un stulbi nebūtu. Ērti, bet tas ir viss. Nu katrā gadījumā, šai konstruktorā tie mainīgie, kas rakstās ar this. priekšā, tie ir dotā objekta propertiji. Tu jau vari arī taisīt savējos propertijus pče noklusēšanas. Piemēram:

function tKaste(width, height, depth) {
this.width = width
this.height = height
this.depth = depth
this.color = '#cccccc'
}

Šeit tKaste.color neviens uzdot nevar. Nu bet nekas, iztiks, ne?

Sintakse, lai radītu savus objektiņus (nu jaureālus, nevis deģeneratīvas funkcijas) it elementāra:

jaunāObjektaNosaukums = new objektaNosaukums( argumenti )

Tā, piemēram, lai uztaisītu sev mūsu kastes, varam rakstīt:

kaste1 = new tKaste(10, 20, 30)
kaste2 = new tKaste( 5, 20, 10)
kaste3 = new tKaste(15, 30, 15)

Tā.. nu, tad, tici vai ne, tev ir pirmais objekts. Nu tagad tu ar viņa propertijiem vari darboties kā vēlies, to biš - kā ar parastiem mainīgajiem. Mainīt, skatīties un vēl šo to darīt līdz riebumam.

Nu un kad tu esi sapratis, čo pa čom ar tiem propertijiem, varam arī jau sākt domāt par metodēm. Ak, kas tās tādas? Nu es jau kaut ko pieminēju tādu, patin kaut kur biš apakaļ. Moš pat uz sākumu. Metožu radīšanas process arī nemazām nav tik ļoti sāpīgs, kā OOP izklausās:

functino objektaNosaukums(argumenti){
   this.īpašībasNosaukums = kautkādavērtība
   this.metodesNosaukums = metodesFunkcija
}

functino metodesFunkcija(parametri){
   // ieraksti kaut ko priekš
   // sava jaunā objektiņa
}

MetodesFunkcija šiverējās pa tevis izdalīto atmiņu tieši tāpat kā visas pārējās funkcijas, ja neskaita to, ka, izsaucot jamo, priekšā jāliek objekta nosaukums (piem.: Kaste1.Mirsti())

Objekti un layeri
Mēs varam paprovēt kā uzskatāmu piemēru šamajai OOP izvest vienkāršotāku layeru apstrādes veidu.

Atminēsimies šo to.. Ko darīja pointeru mainīgie:

ns4 = (document.layers)?true:false
ie4 = (document.all)?true:false

if (ns4)
   layer1 = document.layer1div
else
   if (ie4)
     layer1 = layer1div.style

..., kas ir identisks ar šamo:

ns4 = (document.layers)?true:false
ie4 = (document.all)?true:false

if (ns4)
   layer1 = document.layers["layer1div"]
else
   if (ie4)
     layer1 = document.all["layer1div"].style

Šajā gadījumā layer1 ir tāds kā referencējošais mainīgais, kurš norāda uz layer1div layera css propertijiem. Nu tad skaties, kā mēs ar to tiekam galā:

functinon layerObj(id) {
   if (ns4)
     this.css = document.layers[id]
   else
    if (ie4)
       this.css = document.all[id].style
}

Šajā gadījumā tu kūli un lēti un elementāri vari inicializēt savus pointera variabļus, nerakstot kaudzi rindiņu ar kodu:

layer1 = new layerObj("layer1div")

Nu un, kad tas izdarīts, paveras plašs lauks: layer1.css.width, layer1.css.visibility, ... Protams, mēs varam iet vēl tālāk un organizēt tādu lietu, kā apvienoto x un y koordinātu, jo kā zinām, netskeipā ir left un top propertiji, bet iekš ie - pixelLeft un pixelRight ... Nu tad skaties un mācies:

functino layerObj(id) {
   if (ns4) {
     this.css = document.layers[id]
     this.x = this.css.left
     this.y = this.css.top
   }
   else
     if (ie4) {
       this.css = document.all[id].style
       this.x = this.css.pixelLeft
       this.y = this.css.pixelTop
   }
}

Nu tad tasiām Metodes
Tas arī ir elementāri, es laikam pat nepaskaidrošu:

function layerObj(id) {
   if (ns4) {
     this.css = document.layers[id]
     this.x = this.css.left
     this.y = this.css.top
   }
   else
     if (ie4) {
       this.css = document.all[id].style
       this.x = this.css.pixelLeft
       this.y = this.css.pixelTop
     }
   this.moveBy = layerObjMoveBy
   this.moveTo = layerObjMoveTo
}

function layerObjMoveBy(x,y) {
   this.x += x
   this.css.left = this.x
   this.y += y
   this.css.top = this.y
}

function layerObjMoveTo(x,y) {
   this.x = x
   this.css.left = this.x
   this.y = y
   this.css.top = this.y
}

Nu un tālāk viss notiek tā kā iedomāts:

layer1 = create layerObj("layer1div")

layer1.moveBy(-5, 10)
layer1.moveTo(100, 100)

Šamais viss ir īss ieskats iekš js objektiem, kā tos taisīt, un ceru, ka tas tev biš (vismaz) izlīdzēja. Jo, kā esmu novērojis, pārsvarā ļauži raksta savējās procedūras laprātāk, nekā izmanto citu rakstītās. Cya in hell, coder.

Banneru sistēma BBA