jQuery andmemeetod annab meile võimaluse siduda suvalisi andmeid mis tahes dokumendi või JavaScripti objektiga, muutes teie koodi kokkuvõtlikumaks ja loetavamaks. Alates versioonist jQuery 1.4.3 oli seda meetodit võimalik kasutada JavaScripti objektid, samuti jälgida nende andmete muudatusi.
Põhitõed
Alustuseks võite kutsuda andmemeetodit jQuery objektil ja kasutada ka otse funktsiooni $.data().
// Kasutades meetodit: $("#myDiv").data("key","suvaline väärtus"); // Funktsiooni otse kasutamine: $.data($("#myDiv").get(0),"key","suvaline väärtus");
Andmefunktsioon on madala taseme teostus, mida meetodi kutsumisel tegelikult kasutatakse. jQuery objektimeetod on palju mugavam ja võimaldab kaasata end kõnede ahelasse.
Samuti pange tähele, et peate funktsiooni $.data esimese parameetrina edastama DOM-i elemendi, mitte jQuery objekti.
Objekti meetod nõuab kahte parameetrit – võtit ja väärtust. Võti on stringikonstant ja väärtus on mis tahes andmestruktuur, sealhulgas massiivi funktsioonid ja objektid. On olemas alternatiivne süntaks, kus saate objekti edastada ühe parameetrina:
// Saate edastada objekti: $("#myDiv"). data(("nimi":"Stevie","vanus":21)); // Sama asi: $("#myDiv").data("nimi","Stevie").data("vanus",21);
Nüüd, kui teil on vaja salvestatud andmeid hankida, saate helistada andmefunktsioonile, edastades sellele võtme parameetrina:
Var theValue = $("#myDiv").data("vanus"); // 21
Juurdepääs nendele andmetele on avatud kõikjal skriptis. Salvestatud andmeid saate nii kaua, kuni on olemas element, mille antud selektor hangib.
Var theValue = $("div:first").data("nimi"); // Stevie $("div:first").click(function()( alert($(this).data("vanus"); // 21 ));
jQuery 1.4.3 puhul on saadaval ka atribuutidesse salvestatud HTML5 andmed. See tähendab, et kui teil on selline element deklareeritud:
Sel juhul saate andmed atribuudist data-internal-id, kutsudes välja $("#img1").data("internal-id") meetodi, mis on kindlasti mugav AJAX-i päringute puhul.
Andmemeetodi kasutamine JavaScripti objektidel
Võite olla üllatunud, kuid andmemeetodit saab kasutada ka tavaliste JavaScripti objektide puhul. See funktsioon ilmus ametlikult versioonis jQuery 1.4.3.
Var myObj = (); $(myObj).data("linn","Springfield");
Ülaltoodud näide loob antud objektile tegelikult linnavara. Miks mitte sel juhul lihtsalt kirjutada myObj.city = "Springfield"? Erinevus seisneb selles, et andmemeetod lisab objektile mitmeid kasulikke sündmusi, mis muudavad selle objektiga töötamise lihtsamaks. Näiteks:
var progressBar = (); $(progressBar).bind("setData",function(e,key,value)( switch(key)(suur- ja suurtäht "protsent": $("#progress").width(väärtus+"%"); $("# protsentiText").tekst(väärtus+"%"); paus; suur- ja suurtäht "värv": $("#progress").css("värv",väärtus); break; tõstutäht "lubatud": $("#progress") .toggleClass("aktiivne", väärtus); break; ) )); $(progressBar).data("enabled",true).data("protsent",21).data("värv","roheline"); console.log(progressBar.enabled);
Ülaltoodud näites kasutame andmemeetodit lihtsa API loomiseks, mille abil saame elementi värskendada.
JavaScripti objektil saab kasutada veel kahte sündmust.
- getData – süttib enne andmete lugemist. Saate seda kasutada saadud andmete eeltöötlemiseks. Näiteks väärtuse ümberarvutamiseks.
- changeData – käivitatakse andmete seadistamisel või muutmisel. Seda sündmust kasutatakse jQuery andmelingi pistikprogrammis. See võimaldab teil siduda vormiandmeid JavaScripti objektiga ja käsitleda vormivälju objekti omadustena.
Kaamerate taga
jQuery loob tühja objekti (uudishimulike jaoks nimetatakse seda $.cache), mis on kõigi andmete meetodi abil salvestatud väärtuste salvestusruum. Igale DOM-i elemendile, mida andmemeetodiga kasutatakse, määratakse kordumatu ID, mis on seejärel võti objekti $.cache andmetele juurdepääsuks.
jQuery ei salvesta sellesse vahemällu mitte ainult kasutajaandmeid, vaid ka sisemisi andmeid, sündmuste käitlejaid, mida riputate funktsioonide live() , bind() ja delegate() abil. Keskpoe kasutamine muudab jQuery töökindlamaks.
Järeldus
Andmemeetod on vaid üks jQuery paljudest funktsioonidest, mis muudavad veebiarendajate elu lihtsamaks. Koos muude raamatukogu funktsioonidega loob see tugeva aluse, millele saame toetuda.
Tunnis käsitletakse Javascripti objekte. See puudutab kohandatud objekte: objekti loomine JavaScriptis, töö objektide atribuutide ja meetoditega, aga ka JavaScripti prototüüpidega. Lühitutvustus töösse objektidega asukoht, Navigaator, Ekraan
Saidi saidi ülesanne on anda kasutajatele praktilisi oskusi keelega töötamiseks. Laboratoorsed tööd JavaScriptis, mida esitatakse nende keerukuse suurenedes ja mida toetavad illustreerivad lahendatud näited, hõlbustab uuritava materjali tajumist ja õppimist, kuidas iseseisvalt "reaalajas" dünaamilisi veebilehti luua.
JavaScriptis on mitut tüüpi objekte:
- sisseehitatud objektid
- brauseri objektid
- objektid, mille programmeerija ise loob (kohandatud)
Sisseehitatud objektid on eelmääratletud objektid, millest enamik on juba eelmistes tundides käsitletud.
JavaScripti brauseriobjekte käsitletakse hilisemates õppetundides.
Nüüd on aeg tutvuda kohandatud objektid JavaScriptis.
- Objekt (objektid)
- Number (numbri töötlemine)
- String (stringi töötlemine)
- Massiivid (massiivid)
- matemaatika ( matemaatilised valemid, funktsioonid ja konstandid)
- Kuupäev (töötab kuupäevade ja kellaaegadega)
- Regexp
- Globaalne (selle omadused on Infinity, NaN, undefined)
- funktsiooni
JavaScripti objektide loomine
Objektide loomiseks on kaks võimalust:
- Objekti lähtestaja kasutamine (või kogumisobjektide loomine)
- Objektikonstruktori kasutamine ()
- Kogu objektide loomine
var objekti_nimi = new Object(); objekti_nimi.omadus = väärtus;// punktitähistus objekti_nimi["omadus"] = väärtus;// sulgude märge
Tähtis: Pange tähele, et te ei saa väärtusena kasutada arvu: myObg.rost = 2 // ÄRGE! myObg.rost = "2" // saate
Näide: Looge myBrowseri objekt atribuutide nimega (väärtus ) ja versioon (väärtus " 9.0 »)
✍ Lahendus 1:
var myBrowser = new Object(); myBrowser.name="Microsoft Internet Explorer"; myBrowser["version"]= "9.0";
Näide: Loo kaks kollektsiooniobjekti (auto ja moto) värvi ja brändi omadustega. Kuva vara väärtus värvi objektil auto ja omadused bränd objektil moto.
✍ Lahendus:
| varcar = new Object(); car.color = "Valge" ; auto.maxSpeed = 220 ; car.brand = "Nissan" ; document.write ("Auto värv: " + auto.värv ) ; var moto = ( värv: "Sinine" , hobujõud: 130, kaubamärk: "Yamaha"); document.write( "Mootorrattatootja:"+ moto.bränd ); |
var auto = new Object(); car.color = "Valge"; auto.maxSpeed=220; car.brand = "Nissan"; document.write("Auto värv: " + auto.värv); var moto = ( värv: "Sinine", hobune Võimsus: 130, kaubamärk: "Yamaha" ); document.write("Mootorratta tootja: " + moto.bränd);
"igaühele" jaoks tsüklis, kui käsitlete objekte javascriptis
Sellest disainist on juba üsna palju räägitud.
JavaScripti for in silmus on loodud massiivide, kogude ja objektide itereerimiseks.
Vaatleme näidet selle kasutamise kohta:
| 1 2 3 4 5 6 7 8 | var myBrowser = new Object(); myBrowser.name = "Microsoft Internet Explorer" ; myBrowser[ "version" ] = "9.0" ; for (var a in myBrowser) ( alert(a) ; // Sõidab läbi myBrowser objekti atribuutide. Annab nime, versiooni hoiatus(minubrauser[ a] ); // Tagastab vara väärtused } |
var myBrowser = new Object(); myBrowser.name="Microsoft Internet Explorer"; myBrowser["version"]= "9.0"; for (var a in myBrowser) ( alert(a); // Sirvige läbi myBrowser objekti atribuudid. Annab nime, versiooni alert(myBrowser[a]); // Annab atribuutide väärtused.
Konstruktorite klasside loomine toimub kahes etapis:
- esiteks luuakse klass konstruktori abil;
- siis loodud uus objekt konstruktoripõhine.
Objektiklassi loomine konstruktori abil (konstruktoriklasside loomine):
funktsioon Objekti_klassi_nimi(v1, v2)( this.v1 = väärtus; this.v2 = väärtus; )
Uue objekti loomine objektiklassi konstruktori põhjal:
var objekti_nimi = uus klassi_nimi("väärtus_v1","väärtus_v2");
var objekti_nimi =uus klassi_nimi(); objekti_nimi.v1="väärtus_v1"; objekti_nimi.v2="väärtus_v2";
Konstruktorklassi nimi on tavaliselt suurtähtedega!
Kaaluge näidet:
Näide: Objektiklassi konstruktori loomine ja selle klassi alusel objekti loomine: loo myBrowser objekt atribuutide nimega (väärtus "Microsoft Internet Explorer") ja versioon (väärtus " 9.0 »)
Ava Lahendus
| 1 2 3 4 5 6 7 8 | function Brauser (nimi, versioon) ( this .name = nimi; see .version = versioon; ) var myBrowser = new Browser("Microsoft Internet Explorer" , "9.0" ) ; märguanne(minubrauseri.nimi ) ; hoiatus(myBrowser.version) ; |
function Brauser (nimi, versioon)( this.name = nimi; this.version = version; ) var myBrowser = new Browser("Microsoft Internet Explorer","9.0"); hoiatus(minubrauser.nimi); hoiatus(myBrowser.version);
Niisiis, võrdleme uuesti objektide loomise esimese viisiga:
// koguobjekt var myBrowser = (nimi: "Microsoft Internet Explorer", versioon: "7.0"); hoiatus(minubrauser.nimi); hoiatus(myBrowser.version); // järgmine rida vastuvõetamatu! var myBrowser1 = new myBrowser("MozillaFirefox","3.5"); // POLE TÕSI! !!
Tähtis: Koguobjekti loomisel ei saa te klassi eksemplari luua, kuna see pole klass
js töö 6_1. Looge objekt Töötaja, mis sisaldab teavet teatud ettevõtte töötajate kohta, näiteks nimi, osakond, telefon, palk (kasutage konstruktori funktsiooni ja märksõna see). Looge objekti eksemplar
Juurdepääs objekti omadustele JavaScriptis
Objekti_nimi. kinnistu nimi
| 1 2 | agent007.Name = "Võlakiri" ; hoiatus(agent007.Nimi) ; |
agent007.Name = "Võlakiri"; hoiatus(agent007.Nimi);
Mis on vaikeomadus
Konstruktori funktsioon võimaldab anda objektile vaikeomadused. Need omadused on igal loodud objekti eksemplaril.
| 1 2 3 4 5 6 7 8 9 10 | function Õpilane(nimi, telefon) ( this .name = nimi; this .phone = "22-22-22" ; // vaikeomadus!) var ivanov = new Student("Ivan" , "33-33-33" ) ; hoiatus(ivanov.nimi) ; // annab "Ivanile" märguande (ivanov.phone ) ; // tagastab "22-22-22" ivanov.phone = "33-33-33" ; //vaikeomaduse muutmine hoiatus(ivanov.telefon) ; // tagastab "33-33-33" |
function Õpilane(nimi, telefon) ( this.name=name; this.phone="22-22-22"; // vaikeomadus! ) var ivanov = new Student("Ivan","33-33-33" ) ; hoiatus(ivanov.nimi); // annab "Ivan" märguande (ivanov.phone); // tagastab "22-22-22" ivanov.phone="33-33-33"; //muuta vaikeomaduste hoiatust (ivanov.phone); // tagastab "33-33-33"
Objektiklassi omaduste lisamine
Kinnisvara väärtuse saate lisada:
- konkreetne objekti eksemplar;
- tervet objektide klassi
Omaduste lisamine konkreetsele(näitaja) objekt:
objekti_nimi. property_name = väärtus
ivanov.biology = "suurepärane";
Tähtis: Näites on omadus määratud konkreetsele objektile, mitte objektide klassile!
Omaduste lisamine klassi juurde objektid:
klassi_nimi.prototüüp. property_name = väärtus
student.prototype.biology = "suurepärane";
Tähtis: Näites on (vaikimisi) omadus määratud objektiklassile! Seda tehakse prototüübiga; prototüüp- objekt, mis määrab struktuuri
| 1 2 | Student.prototype .email = " [e-postiga kaitstud]"; märguanne(ivanov.email) ; // annab " [e-postiga kaitstud]" |
student.prototype.email=" [e-postiga kaitstud]"; hoiatus(ivanov.email); // annab " [e-postiga kaitstud]"
Näide: Näide kõigi objekti omaduste kuvamisest koos väärtustega
| 1 2 3 4 5 6 7 8 9 | var summerTour= ( Türgi : 2000 , Hispaania : 3000 , Egiptus : 1000 ); var variant; jaoks (suvetuuri valik) ( document.write (valik + ":" + summerTour[valik] + " " ) ; } |
var summerTour=( Türgi: 2000, Hispaania: 3000, Egiptus: 1000 ); var variant; for (suvetuuri valik)( document.write(valik + ":" + summerTour + "
");
}
Javascripti prototüübid (sissejuhatus)
Vaatame näidet, kuidas javascripti klassid prototüüpide peal
Näide: Loo objektiklass Auto (auto), millel on kolm omadust: nimi (nimi), mudel (mudel), värv (värv). Looge konkreetsete atribuutide väärtustega klassi eksemplar. Seejärel lisage loodud eksemplari kaudu klassi juurde kinnisvara omanik (omanik) konkreetse vaikeväärtusega ( Ivanov). Printige loodud eksemplari kõik atribuutide väärtused
| funktsioon Auto(nimi, mudel, värv) ( /* autoobjekti ehitaja*/ see .nimi = nimi; see .mudel = mudel; see .värv = värv; var myCar= uus Auto; myCar.name = "Mers" ; myCar.model = "600" ; myCar.color = "roheline" ; Auto.prototüüp .owner = "Ivanov" ; /* lisa uus vara */ alert(minuAuto.nimi + " " + minuAuto.mudel + " " + minuAuto.värv + " " + minuAuto.omanik ) ; |
funktsioon Auto(nimi, mudel, värv) ( /* autoobjekti ehitaja*/ see.nimi = nimi; see.mudel = mudel; see.värv = värv; ) var minuAuto=uus Auto; myCar.name="Mercedes"; myCar.model="600"; myCar.color="roheline"; Car.prototype.owner = "Ivanov"; /* lisa uus omadus*/ märguanne(minuAuto.nimi+" "+minuauto.mudel+" "+minuauto.värv+" "+minuauto.omanik);
js ülesanne 6_2. js 6_1 seadistamiseks objekti Töötaja loodud eksemplari kaudu lisage objektiklassile uus aadressi atribuut
JavaScripti objektimeetodid
Looge objektmeetod
Näide: Lisage brauseri objektikonstruktorisse meetod aboutBrowser, mis kuvab brauseri ekraanil teavet selle objekti omaduste kohta
- Objektimeetodid tuletatakse funktsioonist ja lisatakse klassi konstruktorisse
| 1 2 3 4 5 6 7 8 9 10 11 12 13 | function showBrowser() ( document.write ("Brauser: " + see .nimi + " " + see .versioon ) ; ) function Browser(nimi, versioon) ( this .name = nimi; see .version = versioon; see .aboutBrowser = showBrowser; ) var myBrowser= new Browser("Microsoft Internet Explorer" , 8.0 ) ; myBrowser.aboutBrowser(); |
funktsioon showBrowser() ( document.write("Brauser: " + see.nimi + " " + see.versioon); ) function Browser(nimi, versioon) ( this.name = nimi; this.version = versioon; this.aboutBrowser = showBrowser; ) var myBrowser=new Browser("Microsoft Internet Explorer",8.0); myBrowser.aboutBrowser();
function Browser(nimi, versioon) ( this.name = nimi; this.version = versioon; this.aboutBrowser = function()( document.write("Brauser: " + nimi + " " + versioon); ) ) var myBrowser= uus brauser ("Microsoft Internet Explorer", 8.0); myBrowser.aboutBrowser();
js ülesanne 6_3. Koostage reisifirma töö jaoks funktsiooniklass (Tour) reisi maksumuse arvutamise meetodiga: inimeste arv * päevade arv * riigi tariif. Looge objekti turkeyTour eksemplar atribuutide väärtustega. Kuvage ekraanil kõik objekti omadused. Arvutusobjekti meetod loob funktsiooni alusel.
Sisseehitatud objektide Javascripti prototüübid (Prototype).
Sisseehitatud objektidele atribuutide ja meetodite lisamine (prototüüp)
JavaScript- OOP keel (objektorienteeritud programmeerimine), mis põhineb prototüüpidel.
Prototüüp- objekt, mis määrab struktuuri
Kaaluge prototüüpidega töötamist, kasutades näidet:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | /* Muuda prototüüpi */ // Sisseehitatud objektile vaikeatribuudi lisamine String .prototype .color = "must" ; // Meetodi lisamine (muutmine) sisseehitatud objektile String .prototype .write = stringWrite; funktsioon stringWrite()( document.write(" " ) ; document.write (see .toString () ) ; document.write ("") ; } // kasuta muudetud klassi var s = new String("See on string" ) ; s.color = "punane" ; s.write(); |
/* Prototüübi muutmine */ // Vaikimisi atribuudi lisamine sisseehitatud objektile String.prototype.color = "black"; // Meetodi lisamine (muutmine) sisseehitatud objektile String.prototype.write = stringWrite; funktsioon stringWrite()( document.write(" "); document.write(this.toString()); document.write(""); ) // kasutage muudetud klassi var s = new String("See on string"); s.color = "red"; s.write();
Tähtis: Matemaatikaobjektile ei saa atribuute ja meetodeid lisada
js ülesanne 6_4. Lisage ülesande täitmiseks programmi kood: lisage meetod printMe() sisseehitatud String klassi, mis prindib sõna "Hurraa!" kasutaja määratud taseme pealkirjana (h... tag) ().
Päise taseme (1, 2...6) saab lisada klassi String atribuudina.
Tuletage meelde, kuidas peaksid HTML-i pealkirjasildid välja nägema:
päis
Lisa kood:
| 1 2 3 4 5 6 7 8 | String .prototype .uroven = "1" ; ... funktsioon printZagolovok () ( ... ... ) var s= new ...; ... |
String.prototype.level="1"; ... funktsioon printZagolovok ()( ... ... ) var s=new ...; ...
Kokkuvõte: Võrdleme uuesti JavaScriptis kohandatud objektide kahte kasutust:
- Kogu objektide loomine
- Konstruktorite klasside loomine
- Mine avalehele
- ...
- ...
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | var myBook= new Object(); myBook.title = "(!LANG:book"
;
myBook.price
=
"200"
;
alert(myBook[
"title"
]
)
;
!} // 1. võimalus atribuutidele juurdepääsuks hoiatus(minuraamat.hind) ; // 2. võimalus atribuutidele juurdepääsuks funktsioon myBookShow() ( for (var i in myBook) ( document.write (i+ ": " + myBook[ i] + " " ) ; // Itereeri atribuutide üle) ) myBook.show = myBookShow; myBook.show(); |
var myBook=new Object(); myBook.title="(!LANG:book";
myBook.price="200";
alert(myBook["title"]); // 1-й вариант обращения к свойствам
alert(meBook.price); // 2-й вариант обращения к свойствам
function myBookShow()
{
for (var i in myBook)
{
document.write(i+": "+myBook[i]+"!}
"); // Atribuutide silmus ) ) myBook.show=myBookShow; myBook.show();
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | funktsioon minuraamat(pealkiri, hind) ( // omaduste määratlemine see .title = pealkiri; see.hind = hind; // meetodi määratlus see .show = näita; function show() ( document.write ("Pealkiri: " + see .pealkiri ) ; document.write ("Hind: " + see .hind ) ; ) ) var book = new myBook("Raamat" , 200 ) ; book.show(); |
function myBook(title,price)( // defineeri atribuudid this.title = title; this.price = hind; // defineeri meetod this.show = show; function show() ( document.write("Pealkiri: " + see. title); document.write("Hind: " + see.hind); ) ) var book = new myBook("Raamat", 200); book.show();> Mine avalehele</a> <li > ... </li> <li > ... </li>
*Keeruline: menüüpunktide arv, nende nimetused ja url tuleb kasutajalt küsida
Nõuanne: stringi kuvamiseks ekraanil meetodis show() kasuta meetodit document.write().
javaScripti asukoht, navigaator, ekraaniobjektid
JavaScripti navigaator
Kaaluge Navigatori objekti kasutamist JavaScriptis järgmise näitega:
Näide: Kirjutage funktsioon, mis kuvab:
- brauseri nimi
- brauseri keel
- OS-i nimi
- kas küpsised on lubatud
- kas kasutajal on Interneti-ühendus
- ekraani resolutsioon
- värvi sügavus
- laaditud lehe URL
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | var variant; // kuvab kõik navigeerimisobjekti omadused for (valik navigaatoris) ( document.write (valik + " : " + navigaator[valik] + " " ) ; } // funktsioon navigaatori objekti spetsiifiliste omaduste kuvamiseks funktsioon userDetails()(document.write( " Brauseri nimi: "+ navigator.userAgent + " " ); document.write ("Brauseri keel: " + navigator.language + " " ); document.write ("OS-i nimi: " + navigator.oscpu + " "); document.write( "Kas küpsised on lubatud:"+ navigator.cookieEnabled + " "); document.write( "Kas Internet on ühendatud:"+ navigator.nLine + " " ) ; ) userDetails() ; |
var variant; // väljastab kõik navigaatori objekti omadused (navigaatoris valik)( document.write(valik + " : " + navigaator+ "
"); ) // funktsioon objekti navigeerimisfunktsiooni konkreetsete omaduste kuvamiseks userDetails ()( document.write("
Brauseri nimi: " + navigator.userAgent + "
"); document.write("Brauseri keel: " + navigator.language + "
"); document.write("OS-i nimi: " + navigator.oscpu + "
"); document.write("Kas küpsised on lubatud: " + navigator.cookieEnabled + "
"); document.write("Kas Internet on ühendatud: " + navigator.nLine + "
"); ) userDetails();
JavaScripti ekraaniobjekt
Kaaluge objekti Screen kasutamist JavaScriptis näitega:
funktsioon userDetails ()( document.write("Resolutsioon: " + screen.width + " x " + screen.height + "
"); document.write("Värvi sügavus: " + screen.colorDepth + " x " + screen.height + "
"); ) userDetails();
JavaScripti asukohaobjekt
Kaaluge asukohaobjekti kasutamist JavaScriptis järgmise näitega:
| 1 2 3 4 | funktsioon userDetails()(document.write( "Laaditud lehe aadress:" asukoht.href + " " ) ; ) userDetails() ; |
funktsioon userDetails ()( document.write("Laaditud lehe URL: " + asukoht.href + "
"); ) userDetails();
Järeldused:
- Uue märksõnaga väljenditega saate luua objektide eksemplare, st nende konkreetseid kehastusi.
- Veelgi enam, tänu javascripti prototüübi atribuudile on võimalik lisada uusi atribuute ja meetodeid objektidele, mis on kasutaja leiutatud ja mida algsetes sisseehitatud objektides ei olnud.
- Objektide loomist saab kasutada andmebaaside loomiseks.
Selles peatükis:
JavaScriptil on mitmeid eelmääratletud objekte, mida saate skriptide kirjutamisel kasutada. Nende hulka kuuluvad sellised objektid nagu massiiv, tõeväärtus, kuupäev, funktsioon, matemaatika, arv, regExp ja string, aga ka primitiivne objekt. AT varased versioonid keeles sisaldas see ka dokumendiobjekte (aken, dokument), kuid need on nüüd JavaScripti keele tuumast välja jäetud ja kuuluvad dokumendiobjekti mudeli (DOM) definitsiooni, millest tuleb juttu hiljem. Kuid mõned nende objektide omadused (dokument ja aken) on meile juba tuttavad.
Tuleme aga tagasi JavaScripti sisseehitatud objektide juurde tänapäeva mõistes. Kõigil sisseehitatud objektidel, välja arvatud matemaatika ja kuupäev, on sellised omadused nagu konstruktor ja prototüüp. Neid kasutatakse olemasolevatele objektidele uute omaduste lisamiseks ja neid kirjeldatakse funktsiooniobjekti kontekstis.
Objekt
Kõik JavaScripti objektid pärivad objekti objektilt. Seetõttu jagavad kõik selle objekti atribuudid ja meetodid kõik teised JavaScripti objektid.
Objekti objektile on määratletud ainult 2 omadust - konstruktor ja prototüüp. Konstruktori atribuut määratleb funktsiooni, mis loob objekti prototüübi – kogu funktsiooni, mitte ainult selle nime. Teisisõnu, kaaluge võimalust, kui defineeritakse mõni testobjekt ja luuakse selle tmp-objekti eksemplar:
Funktsiooni test(versioon) ( this.version = versioon; ) tmp = uus test(1);
Sel juhul näete konstruktori omadust kasutades testitava objekti lähtekoodi (joonis 4.6):
Alert(tmp.constructor);
Riis. 4.6.
Sellel omadusel on aga üks piirang: see ei saa väljastada sisseehitatud JavaScripti objektide koodi: sellistel juhtudel on väljundteave piiratud prototüübi funktsiooni nime ja stringiga "".
Mis puudutab prototüübi omadust, siis see võimaldab teil pääseda juurde praeguse objekti prototüübi funktsioonile. Selle omaduse kasutamine võimaldab muuta objekti prototüübi omadusi. Näiteks saate prototüübi atribuuti kasutades lisada tüübitesti objektile uue atribuudi:
Test.prototype.comment = "Uus kommentaari omadus";
Nüüd on kõigil tüübitesti objektidel, sealhulgas juba loodud tmp-eksemplaril, kommentaari atribuut, mida on lihtne kontrollida, rakendades seda kontrolli:
hoiatus(tmp.comment);
Lisaks saab sisseehitatud JavaScripti objekte uuendada sarnasel viisil. Näiteks kui meil on vaja massiividele lisada atribuut, näiteks kirjeldus, saame seda teha (muidugi ainult praeguse stsenaariumi raames!) Viidates massiivi objekti prototüübile ja lisades sellele vastava atribuudi see:
array.prototype.description = "";
Mis puutub meetoditesse, siis Objekti objekti jaoks on neid veidi rohkem - tervelt 5 tükki. Need on toSource, toString, watch, unwatch ja valueOf, nende Lühike kirjeldus on toodud tabelis 4.10.
Meetodid toString ja valueOf kehtivad peaaegu kõigi sisseehitatud JavaScripti objektide puhul ja tavaliselt kutsub tõlk neid automaatselt välja, kui on vaja konversiooni teha. Mis puutub meetodisse toSource, siis tegelikult teeb see töö ainult konstruktori atribuudi jaoks.
Ülejäänud vaatamise ja mittevaatamise meetodid, patenteeritud laiendused, mis võeti kasutusele Netscape 4 brauseris (nüüd toetab ka Mozilla), on mõeldud skriptide silumiseks. Kuna selle väljaande raames ei käsitleta programmide silumisprogrammide küsimust, pole mõtet neid meetodeid kirjeldada. Kuid igaks juhuks võite selle teadmiseks võtta Sea Monkey'is (aga mitte sees Firefoxi brauser) sisaldab skripti silurit – JavaScripti silurit.
massiivi objekt
Massiivimuutujad sisaldavad järjestatud väärtuste kogumeid, mis on mugavuse huvides esitatud ühe muutujana. Oleme massiive juba rohkem kui korra kohanud (pidage meeles vähemalt argumentide massiive), nüüd on aeg tegeleda kõigi nende omaduste ja rakenduse peensustega.
Erinevalt teistest programmeerimiskeeltest ei ole JavaScriptil andmetüüpi nagu massiiv. Kuid sellest piirangust saab mööda asjaolu, et saate kasutada eelnevalt määratletud massiiviobjekti - Array. Massiiviobjekti loomiseks saate kasutada ühte järgmistest süntaksitest.
MassiiviNimi = new Massiivi(element1, element2, ... elementN) MassiiviNimi = new Massiivi(massiivi pikkus)
Esimesel juhul on loetletud kõik massiivi komponendid, teisel on lihtsalt näidatud elementide arv. Massiivi deklareerimisel saate kasutada ka literaale:
Arvutid = ["PC", "Mac", "Päike"];
Massiivi elementide väärtustega täitmiseks ja massiivi elementidele üldiselt juurdepääsuks saate kasutada elemendi indeksit. Sel juhul tuleb arvestada, et massiivi elementide indeks algab nullist:
vari värvid = new Array(3); värvid = "punane"; värvid = "sinine"; värvid = "Roheline";
Üsna sageli on mugav kasutada JavaScripti võimalust massiivi otse deklareerimisel täita:
Muut värvid = new Array("Punane","Sinine","Roheline");
Massiivi pikkuse (massiivi moodustavate elementide arvu) väljaselgitamiseks kasutage atribuuti pikkus:
Var NumColors = värvid.pikkus;
Lisaks pikkuse atribuudile pakub JavaScript ka mitmeid muid atribuute ja meetodeid massiividega töötamiseks. Eelkõige hõlmavad massiivi objekti omadused lisaks pikkusele kõigi objektide jaoks universaalset konstruktorit ja prototüüpi, samuti indeksi ja sisendomadusi, mis on mõeldud massiivide kasutamiseks koos regulaaravaldistega.
Mis puutub meetoditesse, siis lisaks standardsetele toSource, toString ja valueOf massiividele on veel kümmekond oma, mis on loetletud tabelis 4.11.
| meetod | Kirjeldus |
|---|---|
| concat | Ühendab kaks massiivi ja tagastab uue |
| liituda | Ühendab kõik massiivi elemendid üheks stringiks |
| pop | Eemaldab viimane element massiivist ja tagastab selle |
| suruma | Lisab ühe või mitu elementi massiivi lõppu ja tagastab selle uue pikkuse |
| tagurpidi | Liigutab massiivi elemente nii, et esimene muutub viimaseks ja vastupidi |
| nihe | Eemaldab massiivi esimese elemendi ja tagastab selle |
| viil | Eemaldab mõned massiivi elemendid ja tagastab uue massiivi |
| splaiss | Lisab ja/või eemaldab massiivi elemendi |
| sorteerida | Sorteerib massiivi elemendid tähestikulises järjekorras |
| käiguvahetust välja lülitama | Lisab ühe või mitu elementi massiivi algusesse ja tagastab massiivi uue pikkuse (MSIE 5.5 ja 6 puhul ei tagasta see meetod midagi) |
Vaatame mõnda meetodit lähemalt. Seega saate concat-meetodit kasutades ühendada 2 massiivi ühes:
Var a = new Array("A1", "A2"); var b = new Array("B1", "B2"); varab = a.concat(b);
Siin muutub muutuja ab massiiviks, mis sisaldab kõiki 4 elementi kahest ühendatavast massiivist. Kui nüüd rakendatakse sellisele massiivile liitumismeetodit, on tulemuseks string, mis sisaldab kõiki selle massiivi elemente, eraldatuna komadega:
Str = ab.join(); // hanki str = "A1,A2,B1,B2"
Mis puutub pop-meetodisse, siis selle samale massiivile rakendades saame vastuseks "B2" ja massiiv kärbitakse kolme esimese väärtuseni. Nihutamismeetod, vastupidi, tagastab esimese elemendi (meie puhul “A1”) ja teeb sama massiiviga, ainsaks erinevuseks on see, et ülejäänud elemendid nihutatakse ettepoole.
Nende ja teiste massiivimeetodite paremaks mõistmiseks vaadake järgmist näidet loendis 4.3.
Loetelu 4.3. Töötamine massiividega
Sama näidet saab vaadata failis array.html, samal ajal on võimalik kõiki selle töö tulemusi vaadata brauseris (vt joonis 4.7).
Riis. 4.7. Splaissimismeetodi rakendamise tulemus: tagastatud massiiv ja muudatused
Massiivid võivad olla ka mitmemõõtmelised, s.t. massiivi element võib olla teine massiiv. Sel juhul kasutatakse massiivielemendile juurdepääsuks järgmist süntaksit:
Array2D="Element 0,0" Array2D="Element 0,1" ... Array2D[N][N]="Element N,N"
Täitmise ja väljundi näide kahemõõtmeline massiiv võib leida failist arrays.html, seal on ka interaktiivne näide peaaegu kõigi massiivimeetodite jaoks.
Boole'i objekt
Boole'i objekt on samanimelise andmetüübi ümbris. Boole'i objekti määratlemiseks kasutatakse järgmist süntaksit:
BooleanObj = uus Boolean(väärtus)
Siin on väärtus lähtestamisavaldis, mis määratakse vajadusel tõeseks või vääraks. Kui määrate väärtuse, nagu 0, null, false, NaN, undefined või tühi string, on Boole'i objekti lähtestamise tulemus väär ja mis tahes muu väärtuse korral on see tõene.
Primitiivseid tõeväärtusi tõene ja false ei tohiks segi ajada Boole'i objekti tõese ja vale andmetüüpidega. Näiteks kui deklareerite muutuja x ja määrate sellele Boole'i objekti väärtuse, mis on lähtestatud väärtusega false, hindab see võrdlemisel ikkagi tõeseks:
X = uus Boolean(vale); // kui võrrelda, kui (x) saame tõeseks
Samal ajal, kui määrate muutujale lihtsalt primitiivse andmetüübi false, saab see selle vastu:
x = vale; // kui võrrelda, kui (x) saame vale
Mis puudutab selle objekti kasutamist, siis praktikas saab seda kasutada funktsioonina mis tahes muud tüüpi väärtuste teisendamiseks tõeväärtusteks:
A = 100; x = Boolean(a); // x muutub tõeseks, kui (x) (...)
Kuid tegelikult ei tee te seda tõenäoliselt, kuna vajaduse korral teostab JavaScripti interpretaator selliseid teisendusi automaatselt - ülaltoodud näites võiksite kohe kirjutada "kui (a) ..." ja vajalikud sel juhul konverteerimine tehakse niikuinii.
kuupäevaobjekt
JavaScript ei paku kuupäevadega töötamiseks spetsiaalset andmetüüpi, kuid nagu massiivide puhul, on olemas spetsiaalne andmeobjekt. Kuupäevaobjekti loomiseks saate kasutada ühte järgmistest meetoditest.
Uus kuupäev() uus kuupäev(millisekundid) new Date("Kuupäev_stringina")
Esimesel juhul luuakse Date objekt praeguse ajaga, teisel juhul tuleks määrata millisekundite arv, mis on möödunud 1. jaanuarist 1970. Kui kuupäev on määratud stringina, peab see olema kujul "28. veebruar 2005". Kuupäeva on võimalik määrata ka aasta, kuu, päeva jne täisarvude abil:
Uus kuupäev (aasta, kuu, päev [, tund, minut, sekund, millisekund])
Loomulikult saate sel juhul vältida sekundite ja millisekundite määramist, eriti kuna brauserite vanemad versioonid ei toetanud isegi millisekundeid. Lisaks ei toeta 1.3 eelne JavaScript kuupäevi, mis on enne 1. jaanuari 1970. Mis puutub real näidatud väärtuste vormingusse, siis aasta on suvaline 4-kohaline arv (kui määrate 2-kohalise numbri, siis lisatakse sellele 1900), kuu number on alates 0 ( jaanuar) kuni 11. (detsember) ja päev on vahemikus 0 kuni 31. Sellest lähtuvalt on ka ajaväärtused piiratud: tundide jaoks on see täisarv vahemikus 0 kuni 23, sekundite ja minutite jaoks - 0 kuni 59 ja millisekundite jaoks - 0 kuni 999. Seega peaksite objekti väärtuskuupäeva tüübina 9. mai 2005 määramiseks kirjutama:
Var anyday = new Date(2005, 5, 9);
Ja kui teil on vaja saada kuupäeva ja kellaaja praegune väärtus, pole parameetreid üldse vaja:
Varnow = new Kuupäev();
Alates JavaScripti versioonist 1.3 võib kuupäevavahemik olla kuni 100 miljonit päeva enne ja pärast 01.01.1970 (kokku peaaegu 550 000 aastat!). Samas versioonis kehtestati nõue märkida aastaarv alati neljakohalises vormingus, et vältida sajandite vahetumisega kaasnevaid vigu.
Kuupäevaobjektiga töötamiseks pakutakse 2 atribuuti - konstruktor ja prototüüp, samuti palju meetodeid, mis võimaldavad teil valida kuupäeva soovitud osa (aasta, kuu, päev, kellaaeg), kuvada seda ühes või teises vormingus, jne. Kõik need on loetletud tabelis 4.12.
| Meetod ja selle süntaks | Kirjeldus |
|---|---|
| getDate() | Tagastab kuu päeva kohaliku aja järgi |
| getDay() | Tagastab nädalapäeva kohaliku aja järgi |
| getFullYear() | Tagastab aastaarvu kohaliku aja järgi |
| getHours() | Tagastab praeguse kellaaja (tunnid) kohaliku aja järgi |
| get Milliseconds() | Tagastab praeguse kellaaja (millisekundites) kohaliku aja järgi |
| getMinutes() | Tagastab praeguse kellaaja (minutites) kohaliku aja järgi |
| get Month() | Tagastab praeguse kellaaja (kuu) kohaliku aja järgi |
| getSeconds() | Tagastab praeguse kellaaja (sekundites) kohaliku aja järgi |
| getTime() | Tagastab praeguse kellaaja numbrina kohaliku aja järgi |
| getTimezoneOffset() | Tagastab aja nihke minutites GMT-st kohaliku aja järgi |
| getUTCDate() | Tagastab kuu päeva universaalaja järgi |
| getUTCDay() | Tagastab nädalapäeva universaalaja järgi |
| getUTCFullYear() | Tagastab aasta universaalajal |
| getUTCHours() | Tagastab praeguse kellaaja (tunnid) universaalajas |
| getUTCMilliseconds() | Tagastab praeguse aja (millisekundites) universaalajas |
| getUTCMutes() | Tagastab praeguse kellaaja (minutites) universaalajas |
| getUTCMonth() | Tagastab praeguse kellaaja (kuu) universaalaja järgi |
| getUTCSecons() | Tagastab praeguse aja (sekundites) universaalajas |
| getYear () | Aegunud. Tagastab aastaarvu lühikeses (kahekohalises) vormingus universaalaja järgi |
| parse(kuupäeva_string) | Tagastab millisekundite arvu, mis kulus 1. jaanuarist 1970 parameetris määratud väärtuseni kohaliku aja järgi |
| määra kuupäev (päev) | Määrab kuu päeva kohaliku aja järgi |
| setFullYear(year) | Määrab aasta kohaliku aja järgi |
| setHours (tunnid) | Määrab kellaaja (kella) kohaliku aja järgi |
| setMilliseconds (millisekundid) | Määrab kellaaja (millisekundites) kohaliku aja järgi |
| set Minutes (minutid) | Määrab kellaaja (minutites) kohaliku aja järgi |
| seatudkuu(kuu) | Määrab kellaaja (kuu) kohaliku aja järgi |
| setSeconds (sekundites) | Määrab kellaaja (sekundites) kohaliku aja järgi |
| setTime (millisekundites) | Määrab kellaaja millisekundites konkreetse kuupäeva jaoks kohaliku aja järgi |
| määraUTCDdaat(päev) | Määrab kuu päeva universaalajal |
| setUTCFullYear(year) | Määrab aasta universaalajal |
| määraUTCHours (tunnid) | Määrab kellaaja (tunnid) universaalajal |
| Määra UTCMillisekundid (millisekundid) | Määrab aja (millisekundites) universaalajaks |
| setUTCMutes (minutites) | Määrab kellaaja (minutites) universaalajal |
| määra UTC kuu(kuu) | Määrab kellaaja (kuu) universaalajal |
| setUTCSeconds (sekundites) | Määrab kellaaja (sekundites) universaalajal |
| setYear (aasta) | Aegunud. Määrab aasta kohaliku aja järgi, aasta väärtuseks on lubatud kahekohaline vorming |
| toGMTString() | Aegunud. Teisendab kuupäeva GMT-le vastavaks stringiks |
| toLocaleString() | Tagastab kuupäeva ja kellaaja stringina, mis on vormindatud vastavalt kohaliku süsteemi sätetele |
| toLocaleDateString() | Tagastab kuupäeva stringina, mis on vormindatud vastavalt kohalikele süsteemiseadetele |
| toLocaleTimeString() | Tagastab aja stringina, mis on vormindatud vastavalt kohalikele süsteemiseadetele |
| toSource() | Tagastab kuupäevaobjekti sõnasõnalises esituses |
| toString() | Tagastab kuupäevaobjekti stringi esituses |
| toUTCString() | Teisendab kuupäeva UTC-vormingus stringiks |
| UTC (seaded) | Tagastab millisekundite arvu alates 1. jaanuarist 1970 universaalaja järgi. Parameetritena on määratud aasta, kuu ja päev, samuti (valikuliselt) tunnid, minutid, sekundid ja millisekundid. |
| väärtusOf() | Tagastab kuupäeva primitiivse väärtusena |
Vaatamata sellisele meetodite rohkusele on Date objektiga töötamine üsna lihtne: peate lihtsalt mõistma nimetamismeetodite põhimõtet:
- meetodid, mis algavad sõnaga "set", on mõeldud kuupäeva ja kellaaja määramiseks Date objektides;
- meetodid, mis algavad sõnaga "get" on mõeldud kuupäevade, kellaaegade või nende osade eraldamiseks kuupäevaobjektidest;
- "to"-ga algavad meetodid tagastavad kuupäeva ja kellaaja (või nende osad) stringiväärtustena;
- meetodid, mis sisaldavad "UTC", erinevad sarnastest ainult selle poolest, et need töötavad universaalse ajavorminguga (st kuvavad kellaaega Greenwichi aja järgi, võttes arvesse nihet praegusest ajavööndist).
Seega jääb hankimiseks või seadmiseks üle vaid lisada või määrata kuupäeva või kellaaja vajaliku osa nimi soovitud parameeter, kasutades valikuliselt ka UTC-d. Noh, kui soovite saada tulemust "inimlikul" kujul, kasutage meetodeid. Samuti peaksite meeles pidama, et aastaarvuga töötamiseks peaksite alati kasutama täisvormingus funktsioone (st getFullYear või getUTCFullYear, mitte getYear).
Kuupäeva stringi esitus JavaScriptis on järgmises vormingus:
Päev Nädal Kuu Päev Aasta Tund: Minut: Teine GMT±nihe
Kuupäevade esituse visuaalseks nägemiseks ja samal ajal selliste funktsioonide nagu toString toimimise kaalumiseks kaaluge, mida need kõik väljundis tagastavad. Sellisel juhul võib esimese asjana konkreetse funktsiooni töö vaatamiseks meelde tulla dokumendi tekstiväljundi kasutamine:
Document.writeln(DateObject.toString()); document.writeln(DateObject.toGMTString()); // jne.
Aga tegelikult, kuna funktsioone on palju, oleks hea ette kirjutada, milline toiming tehti:
Document.writeln("KuupäevObject.toString()" + DateObject.toString());
Nüüd mõtleme uuesti, mitu rida me tegelikult sellisel viisil väljastada tahame. Isegi kui arvestada kõigi poolt toetatud "kopeeri ja kleebi" meetodi võimalusi tekstiredaktorid, see ei kindlusta selliste vigade eest:
Document.writeln("DateObject.toLocaleString()" + DateObject.toString());
Kuid nagu ütleb IBMi moto, inimesed peaksid mõtlema ja masinad peaksid töötama. Nii et mõelgem, kuidas arvuti tööle panna, säästes end samal ajal lisabaitide koodi sisestamisest, mille jaoks pöördume nimekirja 4.4 poole.
Loetelu 4.4. Erinevat tüüpi kuupäevade ja hindamisfunktsiooni kuvamine
Esiteks määratleb see funktsiooni printDate, mis tegelikult kuvab dokumendis kuupäeva ühel või teisel kujul. Pigem kuvab see meie puhul kuupäeva, kuid põhimõtteliselt võib kuvada mida iganes – peaasi, et argument, mida ta võtab, on täielik JavaScripti koodijupp. Sel juhul kuvatakse kood esmalt sellisel kujul (st stringi muutuja trükitakse algsel kujul) ja seejärel kuvatakse täitmise tulemus, mille jaoks kasutatakse funktsiooni eval. Tänu sellele, kui olete sellise funktsiooni ühe korra kirjutanud, saate sellele hiljem kogu dokumendis viidata, säästes sellega vajadust praktiliselt sama teksti kaks korda sisestada.
Väljundfunktsioonile järgneb Date tüüpi objekti loomine, millele omistatakse väärtus 2005, kuu 3 (aprill, kuna jaanuar on null), päev 1, 14 tundi, 30 minutit, 45 sekundit. Järgmisena avatakse dokument kirjutamiseks ja funktsioon printDate kutsutakse järjestikku 6 jaoks erinevaid meetodeid kuupäevaobjekt. Selle skripti tulemuseks on 6 rida, mis sisaldavad kooloniga eraldatud väärtuste paare meetodist ja selle töö tulemusest (joonis 4.8).
Riis. 4.8. Sama kuupäeva väljastamine erinevate meetoditega
Tuleb märkida, et toSource meetodit, mis kuvab kuupäeva programmi siseesituses, toetavad ainult Mozilla brauserid. Lisaks võib kuupäevaväljundi vorming kõikidel muudel meetoditel samuti veidi erineda, olenevalt erinevad brauserid. Saate laadida sellise näite erinevatesse vaatajatesse ja vaadata ise, mida nad välja annavad (date.html fail).
Funktsiooniobjekt
Eelmääratletud funktsiooniobjekt määratleb JavaScripti koodi rea, mis tuleb funktsioonina käivitada. Funktsiooniobjekti deklareerimiseks kasutatakse järgmist süntaksit:
FunctionName = new Function([argument1, argument2, ...argumentN], FunctionBody)
Sel juhul saab funktsiooni nimena kasutada mis tahes muutuja nime või juba olemasoleva objekti omadust. Samuti on võimalik objekti sündmustekäitleja väärtuseks määrata objekti tüüpi Function. Näiteks kui tahame teha oma sündmuste käitleja, nagu "dokumentide laadimine on lõpetatud" (document.onload), võime kirjutada selle:
Document.onload = new Function([Argument1, ...argumentN], FunctionBody);
Argumendid on sel juhul funktsioonile edastatavad parameetrid ja funktsiooni põhiosa on tegelik kood, mis tuleb antud funktsiooniobjektile juurdepääsul käivitada. Näiteks võite kirjutada objekti variandi, mida kasutatakse arvu ruudustamiseks:
Var SquareObj = new Function("x", "tagasi x*x");
Siin on SquareObj muutuja nimi, x on aktsepteeritav argument ja "tagasi x*x" on funktsiooni keha. Pange tähele, et mitte ainult funktsiooni sisu, vaid ka selle kasutatavad argumendid on jutumärkides ning ka objektitüübi nimi, nagu JavaScriptis tavaks, kirjutatakse suure algustähega (Funktsioon).
Sel viisil loodud muutujate kasutamine on sarnane mis tahes muud tüüpi muutujate kasutamisele:
Var a = 5 + SquareObj(2); // saad 9
Tegelikult saab funktsiooni tüüpi objekti alati esitada tavalise funktsioonina, mis on deklareeritud märksõna funktsiooni. Niisiis, sama tõstmist teise astmeni saab kirjeldada järgmiselt:
Funktsioon SquareFunc(x) (tagasi x*x; )
Sellest lähtuvalt saate selle meetodiga deklareeritud funktsiooni kasutada (antud juhul on see funktsioon "puhtal" kujul, mitte protseduur) sarnasel viisil:
Var a = 5 + SquareFunc(2); // saad ka 9
Seega on muutujale väärtuse määramine funktsioonina funktsiooni Function objekti abil sama, mis funktsiooni kui sellise deklareerimine. Kuid samal ajal on neil lähenemisviisidel erinevus: kui SquareObj on muutuja, mille väärtus on viide funktsiooni objekti abil loodud objektile, siis SquareFunc on funktsiooni nimi. Seetõttu käituvad nad programmi käivitamisel ka erinevalt: funktsiooni tüüpi objekti puhul hindab tõlk muutujaga (meie puhul SquareObj) sattudes täielikult funktsiooni kogu koodi ja deklareeritud funktsioonide puhul. tavapärasel viisil hinnatakse koodi ainult esimesel läbimisel. See erinevus ei pruugi olla oluline, kui funktsioon teeb ühekordset tööd, kuid Function objekti alusel loodud muutujate kasutamine vähendab oluliselt programmi efektiivsust tsüklites. Seetõttu on praktikas funktsiooniobjektide kasutamine väga haruldane, kuid sellegipoolest võivad mõnikord olla need mugavad, näiteks teistele objektidele meetodite lisamiseks.
Funktsiooniobjektil on standardne JavaScripti konstruktor ja prototüübi atribuudid, samuti mitu oma:
Argumendid – funktsiooni argumendid.callee parameetritele vastav massiiv – vastab funktsiooni kehale. arguments.caller (vananenud) – osutab selle funktsiooni nimele, millest objekt kutsuti; arguments.length – näitab funktsiooni parameetrite arvu. pikkus – näitab funktsiooni poolt oodatud argumentide arvu (mitte saadud argumentide arvu, nagu argument.length puhul);
TÄHELEPANU
Kõiki argumentide omadusi saab näha ainult funktsiooni "seestpoolt" ja alates JavaScripti versioonist 1.4 ei ole argumendid enam objekti Function atribuut, vaid iseseisev lokaalne muutuja, mis on kaudselt igas funktsioonis olemas. Tegelikult on funktsiooni jaoks ainult 1 oma omadus – pikkus.
Lisaks omadustele on funktsiooniobjektil mitmeid meetodeid. Seega võimaldab rakendusmeetod rakendada ühe objekti meetodit teisele ja kõnemeetod võimaldab praeguse objekti kontekstis välja kutsuda teise objekti meetodit. Kahjuks jätab nende meetodite praktikas rakendamine selgelt soovida. Seega jääb üle vaid mainida standardseid JavaScripti meetodeid toString, toSource ja valueOf, mis on saadaval ka objekti Function jaoks.
Matemaatika objekt
Matemaatika on sisseehitatud JavaScripti keeleobjekt, millel on põhilised matemaatilised konstandid ja funktsioonid meetodite ja omadustena. Näiteks objekti Math atribuut PI sisaldab pi (π) väärtust, mis on ligikaudu 3,1416, ja sin-meetod tagastab määratud arvu siinuse.
Lisaks arvule π on matemaatikaobjektil järgmised omadused:
- E on naturaallogaritmide alus (ligikaudu 2,718)
- LN10 on naturaallogaritm 10 (ligikaudu 2,302)
- LN2 on naturaallogaritm 2 (ligikaudu 0,693)
- LOG10E – E kümnendlogaritm (ligikaudu 0,434)
- LOG2E – E binaarlogaritm (ligikaudu 1,442)
- SQRT1_2- Ruutjuur 0,5-st (umbes 0,707)
- SQRT2 on ruutjuur 2-st (ligikaudu 1,414)
Kuna kõik matemaatikaobjekti atribuudid on etteantud konstandid, ei ole muude matemaatika tüüpi objektide loomine mitte ainult kohustuslik, vaid ka ebaseaduslik ning neile tuleb alati juurde pääseda samal viisil, näiteks:
VarCircleLength = läbimõõt * Math.PI;
Objekt Math määratleb lisaks omadustele ka põhilistele matemaatilistele funktsioonidele vastavad meetodid. Kõik need on loetletud tabelis 4.13.
| Meetod ja selle süntaks | Kirjeldus |
|---|---|
| abs (arv) | Tagastab argumendi absoluutväärtuse |
| atan2(y, x) | Tagastab numbri vahemikus -? kuni 3, mis tähistab nurka (radiaanides) x-telje ja punkti (x,y) vahel. Pange tähele, et esimene argument on y-koordinaat |
| exp(arv) | Tagastab E määratud astmele (eksponentsiaalne logaritm) |
| lagi (number), põrand (arv) | Tagastab väärtuse, mis on lähim suurem (ülem) või väiksem (põrand) täisarv |
| min(arv1, arv2), max(arv1, arv2) | Tagastab kahe võrreldava argumendi väiksema (min) või suurema (max) arvu |
| sin(arv),cos(arv),tan(arv),asin(arv),acos(arv),atan(arv) | Tagastab standardsete trigonomeetriliste funktsioonide – siinus, koosinus, puutuja, arkosinus, arkosinus ja arktangens – täitmise tulemuse |
| pow(alus, astendaja) | Tagastab aluse eksponendi astmele |
| juhuslik () | Tagastab pseudojuhusliku arvu vahemikus 0 kuni 1 |
| ümmargune (number) | Tagastab väärtuse, mis on ümardatud lähima täisarvuni |
| sqrt(arv) | Tagastab arvu ruutjuure |
Nagu atribuutide puhul, tuleb ka matemaatikaobjekti meetodite kasutamiseks viidata otse objektile endale, mitte selle koopiatele. Näiteks kirjutame funktsiooni, mis tagastab läbimõõdu ringi pindala alusel:
Funktsioon CircleDiam(Ruut) ( Raadius = Math.sqrt(Ruut / Math.PI) ; )
Selle praktikas kasutamiseks võite kasutada viipe- ja hoiatusmeetodeid:
Var sq = prompt("Sisesta ala",1); vardi = CircleDiam(sq); alert("Ringi läbimõõt: "+di);
Seda, kuidas need ja teised Math-objekti meetodid töötavad, näete failis math.html.
Numbriobjekt
Number objekt on lihtsate numbritüüpide objekti esitus. Sellel on arvuliste konstantide jaoks spetsiaalsed omadused, nagu "maksimaalne arv", "mitte arv" ja "lõpmatus". Uue Number tüüpi objekti loomiseks kasutage järgmist süntaksit:
UusArv(väärtus)
Praktikas taandub Number objekti kasutamine enamasti selle konstantide kasutamisele argumentide kinnitamiseks ja käitusaja vigade leidmiseks. Näiteks selleks, et kontrollida, kas muutuja väärtus on arv või mitte, saate kasutada järgmist meetodit.
If(x!=Arv.NaN);
Sel juhul on tingimus tõene, kui muutuja x sisaldab arvu, kuna seda võrreldakse eriväärtusega - NaN, mis tähendab "mitte arvu". Lisaks NaN-ile saab kasutada ka muid eriväärtusi - need on kõik numbriobjekti omadused:
- MAX_VALUE – maksimaalne võimalik arv
- MIN_VALUE – minimaalne võimalik arv
- NaN – mitte number (mitte arv)
- NEGATIVE_INFINITY – "negatiivne lõpmatus", ülevoolu korral tagastatav eriväärtus
- POSITIVE_INFINITY – "positiivne lõpmatus", ülevoolu korral tagastatav eriväärtus
Kõik need atribuudid on konstandid, seega ei pea te nende kasutamiseks looma uut objekti tüüpi Number. Lisaks ülaltoodud omadustele on Number jaoks määratletud ka standardsed konstruktori ja prototüübi omadused.
Objektil Number on lisaks omadustele loomulikult ka meetodid. Välja arvatud standardmeetodid toSource, toString ja valueOf, JavaScript 1.5 tutvustab 3 uut natiivset meetodit Number objektil: toExponential, toFixed ja toPrecision. Kõik need on mõeldud numbrite teisendamiseks stringideks ühel või teisel vormingul. Näiteks meetod toExponential teisendab arvu stringiks astendajaga arvuna, meetod toFixed teisendab selle stringiks, mis sisaldab kindla arvu kümnendkohtadega arvu ja meetod toPrecision kasutab ühte neist meetoditest, olenevalt number ja eraldatud märkide arv.
Uurime neid meetodeid üksikasjalikumalt, mille puhul käsitleme nende süntaksit:
Meetod ([Tähemärkide arv])
Ilmselgelt näitab kõigi meetodite puhul numbrite arv kümnendkohtade arvu, kuid kui meetodi toFixed vaikeväärtus (st kui midagi pole määratud) on 0, siis toExponential ja toPrecision puhul - numbrite arv, mis on vajalik meetodi kuvamiseks. number täis. Et paremini mõista, kuidas kõik need meetodid töötavad ja erinevad, vaatleme neid, kasutades näitena loendit 4.5:
Nimekiri 4.5. eksponent-, fikseeritud- ja täppismeetodid
Siin kasutasime jällegi (nagu loendis 4.4) funktsiooni, mis prindib esmalt avaldise ja seejärel selle tõlgenduse tulemuse, antud juhul nimetasime seda ainult printNumber. Sellele järgneb muutuja tegelik deklareerimine, mille alusel arvutusi tehakse. Sel juhul deklareerisime selle Number tüüpi objektina, kuigi tegelikult oleksime võinud piirduda muutuja (x = 12,45678) lihtsa deklaratsiooniga. Lõpuks avatakse dokument kirjutamiseks ja esmalt kuvatakse muutuja x väärtus ilma selgesõnaliste teisendusteta (aga me juba teame, et tegelikult rakendatakse siin automaatselt meetodit toString()), misjärel kutsutakse kõigepealt kõik kolm uuritud meetodit ilma numbrimärke määramata ja seejärel - parameetritega 2 ja 4. Selle skripti tulemuseks on 10 rida, mis sisaldavad paare "avaldis: töötlemise tulemus" (joonis 4.9).
Riis. 4.9.
Kokkuvõtteks tuleb veel kord märkida, et need meetodid ilmusid ainult JavaScriptis 1.5 ja vastavalt ei tööta Netscape 4, MSIE 4/5 ja Opera brauserites enne versiooni 7.0. Samal ajal pakuvad need paindlikumaid väljundi vormindamisvalikuid kui näiteks Math objekti round() meetod.
2011-08-01 // Kas teil on küsimusi, ettepanekuid, kommentaare? Sa saad
Ammu, XHTML/HTML4 päevil, oli arendajatel vaid mõned võimalused suvaliste DOM-iga seotud andmete salvestamiseks. Võiksite välja mõelda oma atribuudid, kuid see oli riskantne – teie kood ei kehtiks, brauserid võivad teie andmeid ignoreerida ja see võib põhjustada probleeme, kui nimi vastab standardsete HTML-atribuutidele.
Seetõttu tugines enamik arendajaid class või rel atribuutidele, kuna need olid ainus mõistlik viis salvestamiseks täiendavad read. Oletame näiteks, et loome vidina sõnumite kuvamiseks, näiteks Twitteri ajaskaala. Ideaalis peaks JavaScript olema konfigureeritav ilma koodi ümber kirjutamata, seega määratleme kasutaja ID klassi atribuudis järgmiselt:
Meie JavaScripti kood otsib elementi ID-ga msglist. Skripti abil otsime klassid algusega kasutaja_, ja "bob" on meie puhul kasutaja ID ja me kuvame kõik selle kasutaja postitused.
Oletame, et sooviksime määrata ka maksimaalse sõnumite arvu ja jätta vahele sõnumid, mis on vanemad kui kuus kuud (180 päeva):
Meie atribuut klass läheb väga kiiresti sassi – eksimine on lihtsam ja stringide sõelumine JavaScriptis muutub aina keerulisemaks.
HTML5 andmeatribuudid
Õnneks tutvustas HTML5 kohandatud atribuutide kasutamise võimalust. Saate kasutada mis tahes väiketähte koos eesliitega andmed-, näiteks:
Kohandatud andmeatribuudid:
- need on stringid – neisse saab salvestada mis tahes teavet, mida saab esitada või stringina kodeerida, näiteks JSON. Tüübi ülekandmine peab toimuma JavaScriptiga
- tuleks kasutada juhtudel, kui puuduvad sobivad HTML5 elemendid või atribuudid
- viidata ainult lehele. Erinevalt mikrovormingutest tuleks neid ignoreerida. välised süsteemid, tüüp otsingumootorid ja otsingurobotid
JavaScripti töötlemise näide nr 1: getAttribute ja setAttribute
Kõik brauserid võimaldavad teil hankida ja muuta andmete atribuute, kasutades meetodeid getAttribute ja setAttribute:
Var msglist = document.getElementById("msglist"); var show = msglist.getAttribute("data-list-size"); msglist.setAttribute("data-list-size", +show+3);
See töötab, kuid seda tuleks kasutada ainult vanemate brauseritega ühilduvuse säilitamiseks.
JavaScripti töötlemise näide #2: jQuery data() meetod
Alates versioonist jQuery 1.4.3 töötleb meetod data() HTML5 andmeatribuute. Te ei pea eesliidet selgesõnaliselt määrama andmed- nii et selline kood toimiks:
Var msglist = $("#msglist"); var show = msglist.data("nimekirja suurus"); msglist.data("nimekirja suurus", näita+3);
Kuid olgu nii, pidage meeles, et jQuery proovib teisendada selliste atribuutide väärtused sobivateks tüüpideks (tõeväärtus, numbrid, objektid, massiivid või null) ja see mõjutab DOM-i. Erinevalt setAttribute, meetod andmed () ei asenda atribuuti füüsiliselt data-list-size- kui kontrollite selle väärtust väljaspool jQueryt, on see ikkagi 5.
JavaScripti töötlemise näide nr 3: API andmekogudega töötamiseks
Ja lõpuks on meil HTML5 andmestiku API, mis tagastab DOMStringMapi objekti. Tuleb meeles pidada, et andmeatribuudid kaardistatakse objektile ilma eesliideteta andmed-, eemaldatakse nimedest sidekriipsud ja nimed ise teisendatakse kaameliks, näiteks:
| Atribuudi nimi | Nimi andmestiku API-s |
| andmekasutaja | kasutaja |
| andmete maksmine | maxage |
| data-list-size | loendi suurus |
Meie uus kood:
Var msglist = document.getElementById("msglist"); var show = msglist.dataset.listSize; msglist.dataset.listSize = +show+3;
Seda API-d toetavad kõik kaasaegsed brauserid, kuid mitte IE10 ja vanemad. Selliste brauserite jaoks on olemas lahendus, kuid tõenäoliselt on otstarbekam kasutada jQueryt, kui kirjutate vanematele brauseritele.
Töötades koos kuupäev ja kellaaeg JavaScriptis kasutatud kuupäevaobjekt. Ma arvan, et pole vaja selgitada, kui sageli peate kuupäeva ja kellaajaga töötama. Ja sellest artiklist saate teada, kuidas seda teha JavaScript.
Alustame traditsiooni kohaselt disaineritest kuupäevaobjekt. Neid on neli. Esimesel konstruktoril pole parameetreid ja see tagastab praeguse kellaaja ja kuupäeva:
Muutuse kuupäev = new Date();
dokument.kirjuta(kuupäev);
Selle tulemusena näete midagi sellist: neljapäev, 14. oktoober 2010 11:42:06 GMT+0400".
Teine konstruktor kuupäevaobjekt on ühe parameetriga konstruktor. See parameeter sisaldab sellest ajast möödunud millisekundite arvu 01.01.1970 (ajastu sünd Unix). Näiteks nii:
Muutuse kuupäev = new Date(135253235);
dokument.kirjuta(kuupäev);
Selle tulemusena näete järgmist. Reede 02. jaanuar 1970 16:34:13 GMT+0300".
Järgmine konstruktor võimaldab teil luua kuupäevaobjekt järgmiste parameetritega: aasta, kuu ja kuupäev:
Muutuse kuupäev = new Date(2010, 0, 12);
dokument.kirjuta(kuupäev);
Tulemus: " teisipäev, 12. jaanuar 2010 00:00:00 GMT+0300". Pange tähele ka seda 0 kuu on jaanuar ja 11- on detsember.
Ja viimane konstruktor Kuupäevaklass JavaScriptis võimaldab luua kuupäevaobjekt kõigi kuupäeva ja kellaaja parameetritega: aasta, kuu, päev, tunnid, minutid ja sekundid.
Muutuse kuupäev = new Date(2010, 0, 12, 23, 45, 12);
dokument.kirjuta(kuupäev);
Saate sellise rea: teisipäev, 12. jaanuar 2010 23:45:11 GMT+0300". See on kõik Kuupäevaobjekti konstruktorid JavaScriptis mida pakuvad arendajad.
Erilised omadused kuupäeva klass Ei, nii et liigume kohe meetodite juurde. Alustame kohe meetodite rühmaga, mis töötavad täpselt samamoodi, kuid igaüks neist tagastab erineva kuupäeva ja kellaaja elemendi:
Muutuse kuupäev = new Date();
document.write("Aasta - " + date.getFullYear() + "
");
document.write("Kuu - " + date.getMonth() + "
");
document.write("Arv - " + date.getDate() + "
");
document.write("Nädalapäev - " + date.getDay() + "
");
document.write("Tund - " + date.getHours() + "
");
document.write("Minut - " + date.getMinutes() + "
");
document.write("Teine - " + date.getSeconds() + "
");
document.write("Millisekund - " + date.getMilliseconds() + "
");
document.write("Millisekundite arv alates 01/01/1970 - " + date.getTime() + "
");
Seda skripti käivitades saate kohe aru, mida kõik need meetodid teevad. Ainus, mida tahaks märkida, on see, et ka nädalapäevade numeratsioon algab sellest null. Ja pühapäeval on indeks 0 ja laupäeval - 6 .
Sarnaseid meetodeid on, kuid need näitavad kuupäev ja kellaaeg GMT. Kirjutame selle koodi:
Muutuse kuupäev = new Date();
document.write("Aasta - " + date.getUTCFullYear() + "
");
document.write("Kuu - " + kuupäev.getUTCMonth() + "
");
document.write("Arv - " + date.getUTCDate() + "
");
document.write("Nädalapäev on " + date.getUTCDay() + "
");
document.write("Tund - " + date.getUTCHours() + "
");
document.write("Minut - " + date.getUTCMutes() + "
");
document.write("Teine - " + date.getUTCSeconds() + "
");
document.write("Millisekund - " + date.getUTCMilliseconds() + "
");
Selle skripti käivitamisel saate teada praeguse kuupäev ja kellaaeg Greenwichis.
Vastupidised meetodid saada () on meetodid - set(). Kui esimene tagastab teatud väärtused, siis teised, vastupidi, muudavad neid. Tegelikult ma seda skripti anda ei saanud, aga et küsimusi ei jääks, teeme ära:
Muutuse kuupäev = new Date();
date.setFullYear(1990);
datesetKuu(11);
datesetDate(15);
datesetHours(9);
datesetMinutes(20);
datesetSeconds(0);
dateset Milliseconds(10);
dokument.kirjuta(kuupäev);
Loodan, et märkasite seda meetodit setDay() ei eksisteeri. See viitab sellele, et nädalapäev valitakse sõltuvalt aastast, kuust ja kuupäevast.
Sarnaseid meetodeid on ka GMT jaoks. Lisage lihtsalt eesliide UTC, näiteks kuu muutmiseks kasutage meetodit setUTCMonth().
Ja viimane meetod on määra aeg(). Võtab parameetriks millisekundite arvu, mis on möödunud ajast 01.01.1970 :
Date.setTime(39293012);
dokument.kirjuta(kuupäev);
Selle tulemusena näete järgmist: Neljapäev, 1. jaanuar 1970 13:54:53 GMT+0300".
See on kõik konstruktorid ja meetodid Kuupäevaobjekt JavaScriptis.
