Javascript

javascript
?
Általános információ
Gyakori bővítmények	.js
Paradigma	Multiparadigma , funkcionális programozás , prototípus alapú programozás , kötelező , értelmezett ( scripting )
Megjelent	1995. december 4
Tervezte	Netscape Communications , Mozilla Foundation
Legújabb stabil verzió	ECMAScript 2021 (2021. június 1. (1 év, 4 hónap és 15 nap))
típusú rendszer	gyenge, dinamikus, kacsa
megvalósítások	SpiderMonkey , Rhino , KJS , JavaScriptCore , V8 , Chakra .
nyelvjárások	ECMAScript
befolyásolta	Java , Perl , Self , Python , C , Séma
befolyásolta	ObjectiveJ, JScript .NET, TIScript

A JavaScript (általában rövidítve JS ) egy értelmezett programozási nyelv , az ECMAScript szabvány dialektusa . Objektumorientált , prototípus alapú , imperatív, gyengén tipizált és dinamikusként definiálható .

Elsősorban kliensoldali használatú, egy webböngésző részeként valósítják meg, amely lehetővé teszi a felhasználói felület fejlesztését és a dinamikus weboldalakat , valamint a szerveroldali JavaScriptet ( szerveroldali JavaScript vagy SSJS ). Használata a weben kívüli alkalmazásokban , például PDF dokumentumokban , asztali alkalmazásokban (többnyire widgetekben ) is jelentős.

2012 óta minden modern böngésző teljes mértékben támogatja az ECMAScript 5.1-et, a JavaScript egyik verzióját. A régebbi böngészők legalább az ECMAScript 3-at támogatják. A hatodik kiadás 2015 júliusában jelent meg. ]

A JavaScriptet a C++- hoz és a Java - hoz hasonló szintaxissal tervezték , ​, bár átveszi a Java programozási nyelv neveit és konvencióit. A Java és a JavaScript szemantikája és célja azonban eltérő. Kapcsolatuk pusztán kereskedelmi jellegű, miután a Nestcape Navigatortól (a LiveScript megalkotója) megvásárolták a Java megalkotóját (Sun Microsystems), és megváltoztatták a programozási nyelv nevét.

Minden modern böngésző értelmezi a weboldalakba ágyazott JavaScript kódot. A weblapokkal való interakcióhoz a JavaScript nyelv a Dokumentumobjektum-modell (DOM) megvalósításával rendelkezik. A Javascript az egyetlen programozási nyelv, amelyet a böngészők natív módon megértenek.

Hagyományosan HTML weboldalakon használták műveletek végrehajtására, és csak a kliens alkalmazás keretein belül, a szerver funkciókhoz való hozzáférés nélkül . Jelenleg széles körben használják információk küldésére és fogadására a szerverről, más technológiák, például az AJAX segítségével . A JavaScriptet a felhasználói ügynök értelmezi, amikor az utasításokat a HTML kóddal együtt tölti le .

Az ECMAScript 1 szabvány 1997. júniusi megjelenése óta létezik a ma legszélesebb körben használt 2., 3. és 5. verzió (a 4-es verziót elvetették ). 2015 júniusában az ECMAScript 6 verziót lezárták és közzétették ]

Előzmények

A JavaScript születése

A JavaScriptet eredetileg Brendan Eich , a Netscape -től fejlesztette Mocha néven , amelyet később LiveScript -re kereszteltek át , végül JavaScript lett. A névváltoztatás nagyjából egybeesett azzal az idővel, amikor a Netscape 1995 decemberében Java technológiai támogatást adott a Netscape Navigator webböngészőjéhez 2002-es verziójában. Az elnevezés zavart keltett, és azt a benyomást keltette, hogy a nyelv a Java kiterjesztése. marketingstratégiaként a Netscape számára, hogy presztízst szerezzen és innovációt fejlesszen ki az új webes programozási nyelvek területén. ]

A „JAVASCRIPT” az Oracle Corporation bejegyzett védjegye . Licenc alapján használják a Netscape Communications és a jelenlegi szervezetek, például a Mozilla Foundation által létrehozott termékek . ]

A Microsoft a JavaScript nyelvjárását " JScript "-nek nevezte el, hogy elkerülje a márkaépítési problémákat. A JScriptet az Internet Explorer 1996 augusztusában kiadott 3.0-s verziójában vették át, és tartalmazta az Effect 2000 dátumfüggvények támogatását , ami eltér az akkoritól. A dialektusok annyira hasonlónak tűnhetnek, hogy a "JavaScript" és a "JScript" kifejezéseket gyakran felcserélhetően használják, de a JScript specifikáció sok szempontból nem kompatibilis az ECMA specifikációval.

Ezen inkompatibilitások elkerülése érdekében a World Wide Web Consortium megalkotta a Document Object Model (DOM, vagy spanyolul Document Object Model) szabványt, amely magában foglalja a Konquerort , az Internet Explorer és a Netscape Navigator 6-os verzióit , az Opera 7-es verzióját, a Mozilla Application Suite -ot és a Mozilla Firefoxot . első verziójától. ^{[ idézet szükséges ]}

1997-ben a szerzők azt javasolták , hogy a JavaScriptet szabványként fogadja el az Európai Számítógépgyártók Szövetsége , az ECMA , amely a neve ellenére nem európai, hanem nemzetközi, genfi ​​székhelyű. 1997 júniusában ECMA-szabványként fogadták el, ECMAScript néven . Hamarosan ISO szabványként is .

JavaScript a szerver oldalon

A Netscape szerveroldali parancsfájl- megvalósítást vezetett be a Netscape Enterprise Serverrel , amely 1994 decemberében jelent meg (röviddel a JavaScript webböngészőknek való megjelenése után). ​ A 2000-es évek közepétől kezdődően elterjedtek a szerveroldali JavaScript implementációk. A Node.js a szerveroldali JavaScript egyik figyelemre méltó példája, amelyet nagy projektekben használnak. ]

Későbbi fejlemények

A JavaScript az egyik legnépszerűbb és legszélesebb körben használt programozási nyelvvé vált az interneten. Eleinte azonban sok fejlesztő helytelenítette a nyelvet, mert a célközönsége többek között cikkkiadókból és más hobbiból állt. Az Ajax érkezése újra előtérbe helyezte a JavaScriptet, és sok más programozó figyelmét is felkeltette. Ennek eredményeként az általános hatókörű keretrendszerek és könyvtárak elterjedtek, a JavaScript programozási gyakorlatok javultak, és a JavaScript használata a webböngészőkön kívül is megnövekedett , amint az a JavaScript-környezetek weboldali elterjedésével is látható. szerver . 2009 januárjában indult el a CommonJS projekt azzal a céllal, hogy egy könyvtárat adjon meg a közös feladatokhoz, elsősorban a webböngészőn kívüli fejlesztéshez. ]

2015 júniusában az ECMAScript 6 szabványt lezárták és közzétették ​ a böngészők közötti szabálytalan támogatással ​, és amely olyan fejlett funkciókat biztosít a JavaScript számára, amelyek hiányoztak és gyakran használtak a JavaScriptben. Más nyelvek, mint pl. mint modulok a kódszervezéshez, valódi osztályok az objektumorientált programozáshoz , nyílkifejezések, iterátorok, generátorok vagy ígéretek az aszinkron programozáshoz.

Az ECMAScript 7-es verziója ECMAScript 2016 néven ismert , és ez a legújabb verzió, amely 2016 júniusában jelent meg. Ez az első verzió, amely új éves kiadási eljárást és fejlesztési folyamatot használ. ]

Jellemzők

A következő szolgáltatások közösek minden olyan megvalósításban, amely megfelel az ECMAScript szabványnak, hacsak kifejezetten másként nem rendelkezik.

Kötelező és strukturált

A JavaScript támogatja a C programozási struktúrájának nagy részét (például utasításokat , ciklusokat , utasításokat stb.). Egy figyelmeztetéssel, részben: C-ben a változók hatóköre arra a blokkra vonatkozik, amelyben meghatározták őket; a JavaScript azonban nem támogatja ezt, mivel a változók hatóköre annak a függvénynek a hatóköre, amelyben deklarálták őket. Ez megváltozik az ECMAScript 2015 kiadással, mivel támogatja a blokk hatókörét a kulcsszó segítségével . A C-hez hasonlóan a JavaScript is különbséget tesz a kifejezések és az utasítások között. A C-hez képest szintaktikai különbség a pontosvesszők automatikus beillesztése, vagyis a JavaScriptben a mondatot lezáró pontosvessző elhagyható. ] ifforswitchlet

Dinamikus

dinamikus gépelés

A legtöbb szkriptnyelvhez hasonlóan a típus az értékhez van kötve, nem a változóhoz. Például xelőfordulhat, hogy egy változó egy időben egy számhoz kötődik, majd később egy karakterlánchoz térhet vissza . A JavaScript számos módot támogat egy objektum típusának ellenőrzésére, beleértve a kacsa gépelést is . Az egyik módja a kiderítésnek a kulcsszó segítségével typeof.

tárgyilagos

A JavaScript szinte teljes egészében objektumokból áll . A JavaScriptben található objektumok asszociatív tömbök , amelyeket prototípusok beépítésével javítanak (lásd alább). Az objektumtulajdonságok nevei a string: típusú kulcsok, obj.x = 10és obj['x'] = 10egyenértékűek, a pontjelölés szintaktikai cukor . A tulajdonságok és értékeik futás közben létrehozhatók, módosíthatók vagy törölhetők. Egy objektum legtöbb tulajdonsága (és azok, amelyek a prototipikus öröklődési láncban szerepelnek) felsorolható a ciklusutasításon keresztül for... in. A JavaScript néhány előre definiált objektumot tartalmaz, például Functionés Date.

Futásidejű értékelés

A JavaScript magában foglalja a evalkarakterláncokként kifejezett kifejezések futási időben történő kiértékelésének lehetőségét. Emiatt ajánlott evalkörültekintően használni, és a lehető legtöbbet használni a funkciót JSON.parse(), mivel sokkal biztonságosabb lehet.

Funkcionális

Első osztályú funkciók

A funkciókat gyakran nevezik első osztályú állampolgároknak; önmagukban tárgyak. Mint ilyenek, olyan tulajdonságokkal és módszerekkel rendelkeznek, mint például .call()és .bind(). ​ A beágyazott függvény egy másikban meghatározott függvény. Ez a külső függvény minden egyes meghívásakor létrejön. Ezenkívül minden létrehozott függvény egy lezárást képez ; egy olyan hatókör kiértékelésének eredménye, amely egy vagy több változót tartalmaz, amelyek egy másik külső hatókörtől függenek, beleértve a konstansokat, a helyi változókat és a hívó külső függvény argumentumait. A bezárás kiértékelésének eredménye az egyes függvényobjektumok belső állapotának része, még azután is, hogy a külső függvény befejezte az értékelést. ]

Prototipikus

prototípusok

A JavaScript osztályok helyett prototípusokat használ az öröklődés használatához . Lehetőség van az osztályok által biztosított számos funkció emulálására a hagyományos objektum-orientált nyelveken JavaScript prototípussal. ]

Objektumkonstruktorként funkcionál

A függvények konstruktorként is viselkednek. A függvényhívás előtagja a kulcsszóval newhozzon létre egy prototípus új példányát, amely örökli a konstruktor tulajdonságait és metódusait (beleértve a prototípus tulajdonságait is Object). Az ECMAScript 5 biztosítja a módszert Object.create, amely lehetővé teszi egy példány explicit létrehozását anélkül, hogy automatikusan örökölnie kellene az objektum prototípusát (régebbi környezetekben a létrehozott objektum prototípusa ként jelenhet meg null). A prototypekonstruktor tulajdonság határozza meg az újonnan létrehozott objektumok belső prototípusához használt objektumot. Új metódusok adhatók hozzá a konstruktorként használt objektum prototípusának módosításával. A JavaScriptben előre definiált konstruktoroknak, például az Arrayu Object-nak is vannak prototípusai, amelyek módosíthatók. Bár ez lehetséges, helytelen gyakorlatnak tekinthető a prototípus módosítása, Objectmivel a Javascript legtöbb objektuma örökli az objektum metódusait és tulajdonságait, az objektumok prototypepedig számíthatnak arra, hogy nem módosították őket. ]

Egyéb funkciók

Futási környezet

A JavaScript jellemzően attól függ, hogy milyen környezetben fut (például egy webböngészőben ), hogy olyan objektumokat és módszereket biztosítson, amelyek segítségével a szkriptek kölcsönhatásba léphetnek a „külvilággal”. Valójában a környezettől függ, hogy képes-e szkriptek beillesztésére vagy importálására (például HTML -ben a címkén keresztül <script>). (Ez nem egy nyelvi funkció, de a legtöbb JavaScript-megvalósításban közös.)

variadic függvények

A függvénynek korlátlan számú paraméter adható át. A függvény a paramétereken keresztül vagy a helyi objektumon keresztül is elérheti őket arguments. A variadic függvények a segítségével is létrehozhatók .apply().

Módszerként funkcionál

Sok objektum-orientált nyelvtől eltérően nincs különbség a függvénydefiníció és a metódusdefiníció között . A megkülönböztetés inkább a függvényhívás során történik; függvényt metódusként hívhatunk. Amikor egy függvényt egy objektum metódusaként hívunk meg, a kulcsszó this, amely a függvény helyi változója, a függvényt meghívó objektumot jelöli.

A tömbök és az objektumok szó szerinti meghatározása

Sok szkriptnyelvhez hasonlóan tömbök és objektumok ( más nyelveken asszociatív tömbök ) is létrehozhatók rövidített szintaxissal. Valójában ezek a literálok képezik a JSON adatformátum alapját .

Reguláris kifejezések

A JavaScript a Perlhez hasonló módon támogatja a reguláris kifejezéseket is , amelyek tömör és hatékony szintaxist biztosítanak a szövegkezeléshez, amely kifinomultabb, mint a karakterlánc-objektumokba épített függvények. ]

Gyártó-specifikus kiterjesztések

A JavaScript hivatalosan a Mozilla Foundation szervezete alá tartozik , és rendszeresen új nyelvi funkciókat adnak hozzá. Azonban csak néhány JavaScript-motor támogatja ezeket a funkciókat:

• A getés tulajdonságok (a WebKit, Opera, ​ ActionScript és Rhino setáltal is támogatott ). ]
• Feltételes kitételek catch.
• A Pythonból átvett iterátor protokoll .
• A korutinok szintén a Pythonból lettek átvéve.
• Listák és kifejezések generálása szövegértés útján, szintén a Pythonból.
• Állítsa be a kulcsszóval blokkolandó hatókört let.
• Tömbök és objektumok strukturálása (a mintaillesztés korlátozott formája).
• Konkrét kifejezések függvényekben (function(args) expr).
• ECMAScript for XML (E4X), egy kiterjesztés, amely natív XML támogatást ad az ECMAScripthez.

Szintaxis és szemantika

a nyelv legújabb verziója az ECMAScript 2016, amely 2016. június 17-én jelent meg ]

Egyszerű példák

A JavaScript változói a var kulcsszóval vannak definiálva : ]

var  x ;  // definiálja az x változót, bár alapértelmezés szerint nincs hozzárendelve értéke 
var  y  =  2 ;  // definiáljuk az y változót, és hozzárendeljük a 2-es értéket

Tekintsük a fenti példában szereplő megjegyzéseket , amelyeket 2 perjel előz meg.

A nyelv nem tartalmaz I/O funkciókat; a futási környezet már biztosítja. Az ECMAScript specifikáció az 5.1-es kiadásában a következőket említi: ]

...valóban, ebben a specifikációban nincsenek rendelkezések külső adatbevitelre vagy -kimenetre a számított eredményekhez.

A legtöbb futásidejű környezet azonban rendelkezik egy meghívott objektummal console ​, amelyet a hibakereső konzol kimeneti adatfolyama nyomtathat. Íme egy egyszerű program, amely kiírja a „Hello world!” szöveget:

konzol . log ( "Helló világ!" );

Egy rekurzív függvény :

function  factorial ( n )  { 
    if  ( n  ===  0 )  { 
        return  1 ; 
    } 
    return  n  *  faktoriális ( n  -  1 ); 
}

Példák anonim függvényre (vagy lambda függvényre ) és lezárásra:

var  displayClosure  =  function ()  { 
    var  count  =  0 ; 
    return  függvény  ()  { 
        return  ++ count ; 
    }; 
} 
var  inc  =  displayClosure (); 
inc ();  // 1 
inc -t ad vissza ();  // 2 
inc -t ad vissza ();  // visszatérés 3

Az önmeghívó kifejezések lehetővé teszik a függvények számára, hogy paraméterenként változókat adjanak át neki a saját lezárásukon belül.

var  v ; 
v  =  1 ; 
var  getValue  =  ( function ( v )  { 
  return  function ()  { return  v ;}; 
}( v ));

v  =  2 ;

getValue ();  1

Haladóbb példák

A következő kód a JavaScript különféle funkcióit mutatja be.

/* Két szám legkisebb közös többszörösének (LCM) megkeresése */ 
function  LCMCalculator ( x ,  y )  {  // konstruktor function 
    var  checkInt  =  function  ( x )  {  // belső függvény 
        if  ( x  %  1  !==  0 )  { 
            throw  new  TypeError ( x  +  " nem egész szám" );  // kivételt dob 
        ​​} 
        return  x ; 
    }; 
    ezt . a  =  checkInt ( x ) //  a pontosvessző nem kötelező 
    . b = checkInt ( és ); } // A konstruktor által létrehozott objektumpéldányok prototípusa a konstruktor "prototype" tulajdonságának prototípusa. LCMC számológép . prototípus = { // literális konstruktorként definiált objektum : LCMCalculator , // amikor újra hozzárendelünk egy prototípust, akkor helyesen állítottuk be a konstruktor tulajdonságát gcd : function () { // a legnagyobb közös tényezőt kiszámító metódus // Euklidész algoritmusa: var a = Matek . abs ( ez . a ), b = Math . abs ( ez . b ), t ; if ( a < b ) { // változók felcserélése t = b ; b = a ; a = t ; } while ( b !== 0 ) { t = b ; b = a % b ; a = t ; } // A GCF-et csak egyszer kell kiszámítanunk, ezért „újradefiniáljuk” ezt a módszert. // (Nem igazán felülírás – magán a példányon van definiálva, így // ez.gcd erre a „felülírásra” hivatkozik, nem pedig az LCMCalculator.prototype.gcd-re). // Továbbá 'gcd' === "gcd", this['gcd'] === this.gcd this [ 'gcd' ] = function () { return a ; }; visszatérés ide : ; }, // Az objektumtulajdonságnevek egyszeres idézőjelekkel (') vagy idézőjelekkel (“) elválasztott karakterláncokkal adhatók meg. "lcm" : function () { // A változónevek nem ütköznek az objektum tulajdonságaival. Például: |lcm| nem |ez.lcm|. // Ne használja a |this.a * this.b|-t hogy elkerüljük a lebegőpontos számításokkal kapcsolatos problémákat. var lcm = ez . erre / erre . gcd () * ez . b ; // Az LCM-et csak egyszer kell kiszámítanunk, ezért "újradefiniáljuk" ezt a módszert. ezt . lcm = függvény () { return lcm ; }; return lcm ; }, toString : function () { return "LCMCalculator: a = " + this . a + ", b = " + ez . b ; } };  


   
      
        
        
               
            
            
              
              
              
        
            
              
                
              
        
        
        
        
        
            
             
        
         
    
    
        
        
        
               
        
            
             
        
         
    
       
               
    


// Meghatározunk egy általános függvényt az eredmény kinyomtatására; ez a megvalósítás csak a webböngészők 
függvény  kimenetében működik ( x )  { 
    document . test . appendChild ( document . createTextNode ( x )); 
    dokumentumot . test . appendChild ( document . createElement ( 'br' )); 
}

// Megjegyzés: Az Array prototípus .map() és .forEach() metódusai a JavaScript 1.6-ban vannak definiálva. 
// Ezeket a módszereket itt a nyelv inherens funkcionális természetének bemutatására használjuk. 
[[ 25 ,  55 ],  [ 21 ,  56 ],  [ 22 ,  58 ],  [ 28 ,  56 ]]. map ( függvény  ( pár )  {  // egy Array + leképezési függvény literális felépítése. 
    return  new  LCMCalculator ( pár [ 0 ],  pár [ 1 ]); 
}). sort ( függvény  ( a ,  b )  {  // a gyűjtemény rendezése ezzel a függvénnyel 
    return  a . lcm ()  -  b . lcm (); 
}). forEach ( függvény  ( obj )  { 
    kimenet ( obj  +  ", gcd = "  +  obj . gcd ()  +  ", lcm = "  +  obj . lcm ()); 
});

A következő példa azt a kimenetet mutatja be, amelyet a böngészőablakban kell megjeleníteni.

LCMC számológép: a = 28, b = 56, gcd = 28, lcm = 56
LCMC számológép: a = 21, b = 56, gcd = 7, lcm = 168
LCMC számológép: a = 25, b = 55, gcd = 5, lcm = 275
LCMC számológép: a = 22, b = 58, gcd = 2, lcm = 638

Használat weboldalakon

Lásd még: JavaScript és AJAX értelmező .

A JavaScript legáltalánosabb használata olyan függvények írása, amelyek HTML-oldalakba vannak beágyazva, és kölcsönhatásba lépnek az oldal dokumentumobjektum-modelljével (DOM). Néhány egyszerű példa erre a felhasználásra:

• Töltsön fel új tartalmat az oldalhoz, vagy küldjön adatokat a szervernek AJAX-on keresztül az oldal újratöltése nélkül (például egy közösségi hálózat lehetővé teheti a felhasználó számára, hogy állapotfrissítéseket küldjön az oldal elhagyása nélkül).
• Az oldalelemek animálása, eltűntetése, átméretezése, áthelyezése stb.
• Interaktív tartalom, például játékok, valamint audio- és videolejátszás.
• A webes űrlap bemeneti értékeinek ellenőrzése annak érdekében, hogy azok elfogadhatók legyenek, mielőtt elküldik a szerverre.
• A felhasználók olvasási szokásairól és böngészési tevékenységeiről szóló információk továbbítása különböző weboldalakra. A weboldalak ezt gyakran webelemzési, hirdetéskövetési, személyre szabási vagy egyéb célokra teszik. ]

Mivel a JavaScript-kód helyileg is végrehajtható a felhasználó böngészőjében (nem pedig távoli szerveren), a böngésző gyorsan reagál a felhasználói műveletekre, így az alkalmazás reagálóbbá válik. Másrészt a JavaScript kód képes észlelni a felhasználói műveleteket, amelyeket a HTML önmagában nem tud, például a billentyűleütéseket. Az olyan alkalmazások, mint a Gmail , kihasználják ezt: a felhasználói felület logikájának nagy része JavaScriptben van írva, és kéréseket küld a szervernek (például egy e-mail üzenet tartalmát). Az Ajax programozás használatának növekvő tendenciája hasonlóan kihasználja ezt a technikát.

A JavaScript motor (más néven JavaScript értelmező vagy JavaScript implementáció) egy olyan tolmács, amely értelmezi a JavaScript forráskódját, és ennek megfelelően végrehajtja a szkriptet. Az első JavaScript motort Brendan Eich készítette a Netscape Communications Corporation-től a Netscape Navigator webböngészőhöz. A SpiderMonkey nevű motor C-ben van megvalósítva. Azóta frissítették (JavaScript 1.5-ben), hogy megfeleljen az ECMA-262 3. kiadásának. Az elsősorban Norris Boyd (korábban Netscape, jelenleg a Google) által létrehozott Rhino motor egy JavaScript implementációja Java nyelven . A Rhino, akárcsak a SpiderMonkey, kompatibilis az ECMA-262 3. kiadással.

A webböngésző messze a legelterjedtebb tárhely a JavaScript számára. A webböngészők gyakran hoznak létre nem natív, futási időtől függő objektumokat a dokumentumobjektum-modell (DOM) megjelenítésére a JavaScriptben. A webszerver egy másik gyakori szolgáltatási környezet. A JavaScript webszerver jellemzően saját objektumait teszi közzé HTTP kérés- és válaszobjektumként, amelyeket aztán egy JavaScript-program lekérdezhet és manipulálhat weboldalak dinamikus létrehozása érdekében.

Mivel a JavaScript az egyetlen nyelv, amelyen a legtöbb népszerű böngésző megosztja a támogatást, ez olyan nyelv lett, amelyre sok más nyelvű keretrendszer lefordítja, bár a JavaScriptet nem ilyen célokra tervezték. A dinamikus természetéből adódó teljesítménykorlátok ellenére a JavaScript-motorok megnövekedett sebessége ezt a nyelvet meglepően megvalósítható fordítási környezetté tette.

Szkriptpélda

Íme egy rövid példa egy weboldalra (amely megfelel a HTML5 szabvány szabványainak ), amely JavaScriptet használ a DOM -kezeléshez :

<!DOCTYPE html> 
< html > 
< head > 
    < meta  charset = "utf-8" > 
    < title > Egyszerű példa </ title > 
</ head > 
< body > 
    < h1  id = "header" > Ez a JavaScript </ h1 >

    < script > 
        dokumentum . test . appendChild ( document . createTextNode ( 'Hello World!' ));
    
        var  h1  =  dokumentum . getElementById ( 'fejléc' );  // tartalmazza a hivatkozást a <h1> címkére 
        h1  =  document . getElementsByTagName ( 'h1' )[ 0 ];  // ugyanannak a <h1> elemnek 
    </ script > elérése

    < noscript > Böngészője nem támogatja a JavaScriptet, vagy a JavaScript le van tiltva. </ noscript > 
</ body > 
</ html >

Kompatibilitási szempontok

Mivel a JavaScript nagyon sokféle környezetben fut, a tesztelés és a hibakeresés fontos része annak tesztelése és ellenőrzése, hogy a JavaScript-kód megfelelően működik-e több böngészőben. A weboldalak elérésére és kezelésére szolgáló DOM felület nem része az ECMAScript szabványnak vagy magának a JavaScript-nek. A DOM-ot a W3C , egy független szervezet szabványosítási erőfeszítései határozzák meg . A gyakorlatban a JavaScript különböző böngészők implementációi eltérnek egymástól és a szabvány szabványaitól is.

E különbségek kiküszöbölése érdekében a JavaScript szerzői képesek voltak olyan szabványoknak megfelelő kódot írni, amely a legtöbb böngészőben is megfelelően futna, vagy ennek hiányában legalább olyan kódot írhattak, amely képes ellenőrizni bizonyos böngészőfunkciók meglétét, és azt, hogy másképp viselkedik, ha azt mondják. funkció nem elérhető. Vannak esetek, amikor két böngésző képes megvalósítani ugyanazt a funkciót, de eltérő viselkedéssel. Ez a tény segíthet a programozóknak abban, hogy felismerjék, melyik böngésző fut az adott pillanatban, és így módosíthatja az írás viselkedését. ​ A programozók gyakran használnak olyan könyvtárakat vagy eszközöket is, amelyek figyelembe veszik a böngészők közötti különbségeket.

Ezenkívül előfordulhat, hogy a szkriptek egyes felhasználóknál nem működnek. Például egy felhasználó:

• Régebbi böngésző használata teljes DOM API támogatás nélkül,
• Használjon olyan PDA-t vagy mobiltelefon-böngészőt, amely nem tudja futtatni a JavaScriptet
• Biztonsági óvintézkedésként tiltsa le a JavaScript végrehajtását,
• Hangböngésző használata például látássérülés miatt.

E felhasználók támogatására a webfejlesztők gyakran hibatűrő oldalakat hoznak létre a JavaScriptet nem támogató felhasználói ügynök (böngésző típus) alapján. Az oldalnak különösen hasznosnak kell lennie a JavaScript által hozzáadott további szolgáltatások nélkül. Alternatív megoldás, amelyet sokan előnyben részesítenek, az, hogy először olyan technológiákkal hoznak létre tartalmat, amelyek minden böngészőben működnek, és javítják a tartalmat azon felhasználók számára, akik engedélyezték a JavaScriptet.

Kisegítő lehetőségek

Feltételezve, hogy a felhasználó nem tiltotta le a JavaScript kód végrehajtását, a kliens oldalon JavaScriptet kell írni egyrészt a látási vagy fizikai fogyatékkal élő látogatók élményének javítása, másrészt az információk elrejtésének elkerülése érdekében. ]

A vakok és gyengénlátók által használt képernyőolvasókat a JavaScript figyelembe tudja venni, és így képes elérni és olvasni az oldal DOM-elemeit. Az írott HTML-kódnak a lehető legtömörebbnek, navigálhatóbbnak és szemantikailag gazdagnak kell lennie, függetlenül attól, hogy a JavaScript fut-e vagy sem.

A JavaScript nem függhet teljes mértékben a böngésző egér eseményeitől, és elérhetőnek kell lennie azoknak a felhasználóknak, akik nem akarnak az egeret (számítógépet) használni a navigációhoz, vagy akik csak a billentyűzet használatát választják. Vannak olyan eszközfüggetlen események, mint például onfocusés onchangeamelyek a legtöbb esetben előnyösebbek. ]

A JavaScript nem használható arra, hogy zavart keltsen a webfelhasználóban. Például a böngésző normál funkcióinak módosítása vagy letiltása, például a visszanavigáció gomb vagy a frissítési esemény viselkedésének megváltoztatása olyan gyakorlatok, amelyeket általában legjobb elkerülni. Hasonlóképpen, ha olyan eseményeket indítanak el, amelyekről a felhasználó nem tud, az csökkenti a felhasználó kontrollérzetét, és váratlan változásokat okoz az oldal tartalmában. ]

Gyakran az a folyamat, hogy egy összetett weboldalt a lehető legmagasabb fokú hozzáférhetőséggel hoznak létre, nem triviális problémává válik, ahol sok kérdés kerül megvitatásra és véleményezésre, amely mindenkitől a végsőkig tartó elkötelezettséget követeli meg. A fogyatékkal élők számára készült felhasználói ágensek és kisegítő technológiák azonban folyamatosan fejlődnek, és továbbra is új iránymutatások és információk kerülnek fel az internetre. ]

Biztonság

Lásd még: Böngésző biztonsága

A JavaScript és a DOM lehetővé teszi a programozók számára, hogy visszaéljenek vele olyan szkriptek bevezetésére, amelyek rosszindulatú tartalommal rendelkező kódot hajtanak végre a felhasználó beleegyezése nélkül, így veszélyeztetve a felhasználók biztonságát.

A böngészőfejlesztők ezt a kockázatot két korlátozás alkalmazásával veszik figyelembe. Először is, a szkriptek egy homokozóban futnak, ahol csak a webhez kapcsolódó műveletek hajthatók végre, általános célú programozási feladatok, például fájlkészítés nem. Másodszor, ugyanaz a származási politika korlátozza: az egyik webhelyről származó szkriptek nem férnek hozzá egy másik webhelyre (másik domainről) küldött információkhoz, például felhasználónevekhez, jelszavakhoz vagy cookie-khoz. A legtöbb JavaScript biztonsági hiba e két korlátozás valamelyikének megsértésével kapcsolatos.

Vannak olyan projektek, mint az AdSafe vagy a Secure ECMA script (SES), amelyek magasabb szintű biztonságot nyújtanak, különösen a harmadik felek által létrehozott kódban (például hirdetések). ]

A tartalombiztonsági szabályzat (CSP) az elsődleges módszer annak biztosítására, hogy csak megbízható kódot lehessen végrehajtani egy weboldalon.

Webhelyek közötti sebezhetőségek

A JavaScript gyakori biztonsági problémája a webhelyek közötti szkriptelés vagy az XSS, amely megsérti az azonos eredetre vonatkozó irányelvet. Az XSS biztonsági rések lehetővé teszik a támadók számára, hogy JavaScript-kódot fecskendezzenek be a felhasználó által meglátogatott weboldalakra. Ilyen lehet egy bank webhelye, ahol a támadó az áldozat jogosultságaival hozzáférhet a banki alkalmazáshoz, amely titkos információkat tárhat fel, vagy pénzt utalhat át az áldozat engedélye nélkül. Az XSS sebezhetőségeinek egyik megoldása a HTML-kihagyás használata, amikor nem megbízható forrásokból származó információkat jelenítenek meg.

Egyes böngészők részleges védelmet tartalmaznak a tükröződő XSS-támadások ellen (a támadó ugyanabban a webes kérésben van). A támadó rosszindulatú kódot tartalmazó URL-t ad meg. Azonban még a böngésző felhasználók is sebezhetőek más XSS-támadásokkal szemben, például olyanokkal szemben, amelyekben rosszindulatú kódot tárolnak egy adatbázisban. Csak a webalkalmazások szerveroldali megfelelő kialakítása képes teljesen megakadályozni az XSS-t. XSS biztonsági rések a böngészőfejlesztők végrehajtási hibái miatt is előfordulhatnak. ]

Egy másik biztonsági rés a helyek közötti kérés hamisítása vagy a CSRF. A CSRF-ben a támadó webhely kódja becsapja az áldozat böngészőjét, lehetővé téve a támadó számára, hogy kéréseket tegyen az áldozat nevében, ami lehetetlenné teszi, hogy a célalkalmazás (például egy pénzátutalást végző bank) tudja, hogy a kérést önkéntesen nyújtották-e be. a felhasználó vagy egy CSRF támadás.

A támadás azért működik, mert ha a céloldal csak cookie-kat használ az áldozatkérések hitelesítésére, a támadó kódja által kezdeményezett kérések ugyanazokkal a hiteles hozzáférési adatokkal rendelkeznek, mint a felhasználó által kezdeményezett kérések.

Általánosságban elmondható, hogy a CSRF megoldása egy rejtett űrlapmező bevezetése, amelynek értéke a hitelesítés végrehajtására szolgál, nem csak cookie-kon keresztül, olyan kérések esetén, amelyeknek tartós hatásai lehetnek. A HTTP hivatkozás fejlécének ellenőrzése is segíthet.

A „JavaScript-eltérítés” a CSRF-támadások egy olyan típusa, amelyben a támadó webhelyén található <script> címke kihasználja az áldozat webhelyének oldalán található biztonsági rést, amely miatt az oldal JSON- vagy JavaScript-kód formájában privát információkat ad vissza. A lehetséges megoldások a következők:

• hogy a POST és GET kérések paramétereiben hitelesítési jogkivonatot kell megadni azokhoz a kérésekhez, amelyek privát felhasználói információk visszaküldését igénylik.
• használja a POST-ot, és soha ne GET-et olyan kérések esetén, amelyek személyes adatokat adnak vissza

Fejlesztő eszközök

A JavaScriptben a hibakereső szükségessé válik nagy, nem triviális alkalmazások fejlesztésekor. Mivel a különböző böngészők között lehetnek eltérések a megvalósításban (különösen a DOM tekintetében), hasznos, ha minden böngészőhöz hozzá kell férni egy hibakeresőhöz, amelyet webalkalmazásunk megcéloz. ]

A webes hibakeresők Internet Explorer, Firefox, Safari, Google Chrome és Opera számára érhetők el. ]

Az Internet Explorerhez három hibakereső érhető el : a Microsoft Visual Studio a legfejlettebb a három közül, amelyet szorosan követ a Microsoft Script Editor (a Microsoft Office egyik összetevője ) és végül a Microsoft Script Debugger, amely sokkal alaposabb, mint a másik. kettő, bár ingyenes. Az ingyenes Microsoft Visual Web Developer Express IDE a Microsoft Visual Studio JavaScript hibakereső funkciójának korlátozott verzióját kínálja. Az Internet Explorer a 8-as verzió óta tartalmaz fejlesztői eszközöket (az F12 billentyű lenyomásával jelenik meg). A Firefox webalkalmazásai a Firebug -bővítmény vagy a régi Venkman hibakereső segítségével hibakereshetők. A Firefox egy alapvető hibakonzollal is rendelkezik, amely naplózza és kiértékeli a JavaScriptet. A CSS hibákat és figyelmeztetéseket is naplózza . Az Opera tartalmaz egy Dragonfly nevű eszközkészletet. A WebKit Web Inspector tartalmaz egy JavaScript hibakeresőt , amelyet a Safariban használnak, valamint a Google Chrome módosított verzióját .

Létezik néhány hibakereső segédeszköz, amelyek szintén JavaScriptben vannak írva, és az interneten való futtatásra készültek. Példa erre a JSLint program , amelyet Douglas Crockford fejlesztett ki , aki sokat írt a nyelvről. A JSLint úgy elemzi a JavaScript kódot, hogy az megfeleljen a szabványoknak és irányelveknek a megfelelő működés és karbantarthatóság biztosítása érdekében.

Lásd még

• VBScript
• AJAX
• Webalkalmazás
• Dokumentum objektum modell
• jQuery
• JSON
• HTML
• HTML5

Külső linkek

• Mozilla fejlesztői központ .
• (angol nyelven) Javascript oktatóanyag .
• JavaScript – Betekintés a kulisszák mögé .