JavaScript

Z Wikipedii

JavaScript ("JS") to stworzony przez firmę Netscape zorientowany obiektowo skryptowy język programowania, najczęściej stosowany na stronach WWW. Implementacja JavaScriptu stworzona przez firmę Microsoft nosi nazwę JScript.

Głównym autorem języka JavaScript jest Brendan Eich.

Pod koniec lat 90. ubiegłego wieku organizacja ECMA wydała ustandaryzowaną specyfikację tego języka pod nazwą ECMAScript.

Spis treści 1 Wersje języka 1.1 JavaScript 1.0 1.2 JavaScript 1.1 1.3 ECMAScript v1 1.4 JavaScript 1.2 1.5 JavaScript 1.3 1.6 ECMAScript v2 1.7 JavaScript 1.4 1.8 ECMAScript v3 1.9 JScript 5.0 1.10 JavaScript 1.5 1.11 JScript 5.5 i 5.6 1.12 ECMAScript v4, JavaScript 2.0 i JScript .NET 2 Zastosowania 3 Podstawowe elementy języka ECMAScript v3 (JavaScript 1.5) 3.1 Komentarze 3.2 Zmienne 3.3 Instrukcje sterujące 3.3.1 Instrukcja if 3.3.2 Pętla while 3.3.3 Pętla do...while 3.3.4 Pętla for 3.3.5 Pętla for...in 3.3.6 Instrukcja switch 3.4 Obiekty 3.4.1 Dostęp do pól i metod 3.4.2 Definiowanie własnego obiektu 3.5 Funkcje 3.6 Dziedziczenie 3.7 Obsługa wyjątków 4 Umieszczanie kodu JavaScript w plikach HTML i XHTML 5 JavaScript w przeglądarkach internetowych 6 Java i JavaScript 7 Zobacz też 8 Linki zewnętrzne

[edytuj] Wersje języka

[edytuj] JavaScript 1.0

Pierwotna wersja języka, zaimplementowana w wersji 2.0 przeglądarki Netscape Navigator. Odpowiada jej JScript 1.0, zaimplementowany w Internet Explorerze 3.0

[edytuj] JavaScript 1.1

W tym wydaniu rozbudowano obsługę tablic (obiekt Array) i poprawiono większość błędów wersji 1.0. Ta wersja została zaimplementowana w Netscape Navigatorze 3.0 oraz jako JScript 2.0 w późniejszych wydaniach Internet Explorera 3.0.

[edytuj] ECMAScript v1

Pierwsza specyfikacja języka stworzona przez ECMA, bliska JavaScriptowi 1.1, choć występują pewne różnice. Zaimplementowana jako JavaScript 1.3 w Netscape Navigatorze 4.5 i JScript 3.0 w Internet Explorerze.

[edytuj] JavaScript 1.2

Od tej wersji dostępne są m. in. wyrażenia regularne i instrukcja switch. Wersja 1.2 wydana została zanim ECMA ukończyła pierwszą specyfikację, stąd JavaScript 1.2 nie jest zgodny z ECMA v1. Niektóre operatory i metody obiektów Array i String zachowują się inaczej niż w specyfikacji ECMA oraz inaczej niż w późniejszych wersjach języka, dlatego wersji tej należy unikać.

JavaScript 1.2 został zaimplementowany w Netscape Navigatorze 4.0.

[edytuj] JavaScript 1.3

Wersja ta nie wprowadziła nowych możliwości, zostały w niej poprawione jedynie niezgodności wersji 1.2 ze specyfikacją ECMAScript v1. Dostępna w Netscape Navigatorze 4.5 oraz jako JScript 3.0 w Internet Explorerze.

[edytuj] ECMAScript v2

Poprawiono błędy i niejasności w specyfikacji ECMAScript v1.

[edytuj] JavaScript 1.4

Wersja ta dostępna była tylko jako język programowania po stronie serwera, używana np. w Netscape Enterprise Server.

Według dokumentacji Opery 6, jej implementacja jest najbliższa tej wersji.

[edytuj] ECMAScript v3

Do specyfikacji dołączono instrukcję switch, wyrażenia regularne oraz obsługę wyjątków.

Standard w całości zaimplementowany w Operze 7.

[edytuj] JScript 5.0

Częściowa implementacja ECMAScriptu v3 (obsługuje wyjątki), dostępna w Internet Explorerze 5.0.

[edytuj] JavaScript 1.5

Pełna implementacja ECMAScriptu v3 w przeglądarkach bazujących na Mozilli Suite (w tym Netscape 6.x i 7.x).

[edytuj] JScript 5.5 i 5.6

Pełna implementacja ECMAScriptu v3 dostępna w Internet Explorerze 5.5 i 6.0.

[edytuj] ECMAScript v4, JavaScript 2.0 i JScript .NET

W chwili pisania tego artykułu prace nad kolejną wersją specyfikacji trwały. Microsoft na bazie wstępnej wersji specyfikacji stworzył tzw. JScript.NET, jednakże język ten nie został włączony do Internet Explorera. Firma Netscape wraz z Fundacją Mozilla opracowały eksperymentalną implementację tej specyfikacji pod nazwą "JavaScript 2.0".

Wersja ta wprowadza rewolucyjne zmiany, takie jak statyczna obsługa typów, definiowanie klas oraz prostsze dziedziczenie.

Żadna przeglądarka internetowa w chwili obecnej nie obsługuje ECMAScript v4.

[edytuj] Zastosowania

Najczęściej spotykanym zastosowaniem klienckiej wersji języka JavaScript są strony WWW. Skrypty pisane w JS służą najczęściej do zapewnienia interaktywności oraz sprawdzania poprawności formularzy HTML oraz budowania elementów nawigacyjnych (np. rozwijane menu). Tak uruchomiony skrypt JavaScriptu ma ograniczony dostęp do komputera, na którym jest wykonywany (ma wysoce ograniczony dostępu do zasobów systemu), o ile nie zostanie podpisany cyfrowo.

Niektóre strony WWW zbudowane są z wykorzystaniem JavaScriptu (lub JScriptu) po stronie serwera, jednakże znacznie częściej korzysta się w tym przypadku z innych języków.

W języku JavaScript można także pisać pełnoprawne aplikacje. Istnieje kilka środowisk, które to umożliwiają.

Pierwszego z nich dostarcza Fundacja Mozilla. Dzięki technologiom takim jak XUL, XBL, XPCOM oraz JSLib można szybko tworzyć aplikacje korzystające z zasobów systemowych, z graficznym interfejsem użytkownika dopasowującym się do danej platformy. Przykładem aplikacji JS+XUL może być klient IRC o nazwie ChatZilla, domyślnie dołączony do pakietu Mozilla. Znacznie więcej programów korzystających z tych technologii można znaleźć na stronie MozDev.org.

Microsoft udostępnia także biblioteki umożliwiające tworzenie aplikacji w JavaScript (JScript) jako część środowiska Windows Scripting Host. Ponadto JScript .NET jest jednym z podstawowych języków środowiska .NET.

Warto także wspomnieć o stworzonym przez IBM środowisku SashXB dla systemu Linux, które umożliwia tworzenie w języku JavaScript aplikacji korzystających z GTK+, GNOME i OpenLDAP.

[edytuj] Podstawowe elementy języka ECMAScript v3 (JavaScript 1.5)

[edytuj] Komentarze

Komentarze w skryptach JavaScriptu umieszcza się w sposób identyczny jak w C++. Komentarz blokowy umieszcza się między sekwencją znaków "/*" a "*/", komentarz liniowy rozpoczyna się sekwencją "//" a kończy znakiem końca linii:

/* To jest komentarz
 * blokowy. Zajmuje on
 * kilka linii */

// to jest komentarz liniowy

[edytuj] Zmienne

Zmienne są typowane dynamicznie. Definiowanie zmiennej polega na zwykłym przypisaniu jej wartości lub skorzystaniu z instrukcji var. Zmienne zdefiniowane poza funkcjami są dostępne w zasięgu globalnym (widoczne dla całego skryptu).

[edytuj] Instrukcje sterujące

Podstawowe instrukcje są identyczne z instrukcjami znanymi z języków Java i C++.

[edytuj] Instrukcja if

if (warunki) {
    instrukcje;
}
[else {
    instrukcje;
}]

[edytuj] Pętla while

while (warunki) {
    instrukcje;
}

[edytuj] Pętla do...while

do {
    instrukcje
} while (warunki);

[edytuj] Pętla for

for ([instrukcje-początkowe]; [warunki]; [instrukcje-końcowe]) {
    instrukcje-środkowe;
}

[edytuj] Pętla for...in

Pętla ta przechodzi przez wszystkie pola danego obiektu (w tym elementy tablicy):

for (własność in obiekt) {
    instrukcje;
}

Jest to instrukcja, która nie występuje w C++ ani w Javie (stosowny odpowiednik pojawił się dopiero w wersji JDK 1.5). W PHP5 jej odpowiednikiem jest instrukcja foreach (w PHP4 umożliwiała jedynie iterację po tablicy).

[edytuj] Instrukcja switch

Tak samo jak w C, C++, PHP i Javie.

switch (wyrażenie) {
    case wartość1:
        instrukcje;
        break;
    case wartość2:
        instrukcje;
        break;
    default:
        instrukcje;
        break;
}

[edytuj] Obiekty

W JavaScripcie wszystko jest obiektem. Podstawowym obiektem jest Object. Standard ECMA opisuje także obiekty Array (tablica), String (ciąg znaków), Number (liczba całkowita lub rzeczywista), Boolean (wartość logiczna), Function (funkcja JavaScriptu), Date (data) i Math (operacje matematyczne).

[edytuj] Dostęp do pól i metod

Obiekty JavaScriptu są tablicami asocjacyjnymi. Dostęp do pól obiektów jest możliwy przy użyciu dwóch równoważnych notacji: obiekt.pole i obiekt["pole"]. Trzecią możliwością (aczkolwiek w większości wypadków - niewygodną) jest skorzystanie z numeru danego pola: obiekt[1].

Ponieważ metody obiektu (funkcje) są jego polami, także do nich dostęp jest możliwy przy użyciu zarówno notacji z kropką, jak i notacji z nawiasami kwadratowymi. Poniższe dwie linie kodu są zatem równoważne:

  m.metoda1();
  m["metoda1"]();

Obie notacje z nawiasami kwadratowymi zwyczajowo stosuje się jednak przy korzystaniu z tablic powstałych jako obiekt Array.

Dostęp do pól i metod obiektu ułatwia instrukcja wiążąca "with". Poniższe konstrukcje są równoważne:

obiekt.pole1=wartość;
obiekt.pole2=wartość;

i

with (obiekt)
{ pole1=wartość;
  pole2=wartość;
}

[edytuj] Definiowanie własnego obiektu

Aby zdefiniować własny obiekt wystarczy utworzyć funkcję konstruktora:

// funkcja konstruktora
function MojObiekt(poleA, poleB) {
  this.poleA = poleA;
  this.poleB = poleB;

  function _metoda1() {
    alert("mojObiekt::metoda1()");
  }
  this.metoda1 = _metoda1;

  function _metoda2() {
    alert("mojObiekt::metoda2()");
  }
  this.metoda2 = _metoda2;

}

Dalsza część opisu mówi o "klasach", mimo że w przypadku JavaScriptu 1.x pojęcie "klasy" jest nieformalne. "Klasa" oznacza tutaj zbiór obiektów utworzonych przy użyciu tego samego konstruktora.

Aby utworzyć instancję klasy MojObiekt, należy skorzystać z operatora new:

  var m = new MojObiekt(2, 3);

Podobnie jak w Javie, nowe obiekty w JavaScripcie tworzone są na stercie. W przypadku kiedy do danego obiektu nie istnieje już żadna referencja mechanizm garbage collectora usuwa dany obiekt z pamięci.

[edytuj] Funkcje

Funkcje w JavaScripcie definiujemy przy użyciu słowa kluczowego function, a jej argumenty podajemy w nawiasach:

function dodajDwieLiczby(a, b) {
  return a+b;
}

Funkcje są jednocześnie obiektami typu Function. Obiekt ten ma konstruktor przyjmujący jako argument ciąg znaków, powyższą funkcję można więc także zdefiniować w sposób następujący:

dodajDwieLiczby = new Function("a", "b", "return a+b;");

Ostatni argument Function() jest treścią kodu funkcji, pozostałe to nazwy parametrów. Ten sposób tworzenia funkcji bywa jednak mało wydajny.

Podobny sposób na deklarowanie funkcji:

dodajDwieLiczby = function(a, b) {
  return a+b;
}

W przeciwieństwie do Javy JavaScript pozwala także operować na referencjach do funkcji:

  function dodaj(a,b) {
    alert(a+b);
  }

  function odejmij(a,b) {
    alert(a-b);
  }

  var g = dodaj;

  g(7,3); // wyświetla "10"

  g = odejmij;

  g(7,3); // wyświetla "4"

[edytuj] Dziedziczenie

W implementacjach ECMAScript V3 dziedziczenie realizowane jest przez prototypy. Jeśli chcemy utworzyć klasę Pochodna dziedziczącą po klasie Bazowa, ustawiamy pole Pochodna.prototype na nową instancję klasy Bazowa:

  function Bazowa() {
    this.metodaA = function() {
      alert("Bazowa::A()");
    }
    this.metodaB = function() {
      alert("Bazowa::B()");
    }
  }

  function Pochodna() {
    // metodaB przeciąża odpowiednią metodę z klasy Bazowa:
    this.metodaB = function () {
      alert("Pochodna::B()");
    }
  }
  Pochodna.prototype = new Bazowa();

  x = new Bazowa();
  y = new Pochodna();

  x.metodaA(); // wyświetla: "Bazowa::A()"
  y.metodaA(); // wyświetla: "Bazowa::A()"
  x.metodaB(); // wyświetla: "Bazowa::B()"
  y.metodaB(); // wyświetla: "Pochodna::B()"

Istnieją inne sposoby na uzyskanie dziedziczenia w JavaScripcie. Osoby przyzwyczajone do Javy lub C++ mogą zmodyfikować prototyp obiektu Object w następujący sposób:

  Object.prototype.extending = function (supClass) {
    tempObj = new supClass();
    for (property in tempObj) {
        this[property] = tempObj[property];       
    } 
  };

by później w funkcjach konstruktora korzystać z metody extending(), rozwiązującej szybko problem dziedziczenia (używamy nazwy "extending" zamiast "extends", gdyż to drugie słowo jest słowem zastrzeżonym w JavaScripcie). Oto przykład:

  function Bazowa() {

    this.value = 5;
    
    this.metoda1 = function () {
        alert("Bazowa::metoda1() " + this.value);
    }
    
    this.metoda2 = function () {
        alert("Bazowa::metoda2()");
    }
    
  }

  function Pochodna() {
    this.extending(Bazowa);
    
    this.metoda1 = function () {
        alert("Pochodna::metoda1() " + this.value);
    }
  }

Ważne tylko, żeby extending() wywoływać jako pierwszą instrukcję w konstruktorze.

[edytuj] Obsługa wyjątków

Do obsługi wyjątków w JavaScript wykorzystywana jest "klasa" Error, odpowiadająca znanej z Javy klasie Exception.

Aby wyrzucić nowy wyjątek, należy skorzystać z instrukcji throw:

  function zrobCos() {
    throw new Error("Komunikat wyjątku");
  }

Aby obsłużyć wyjątek, należy zastosować konstrukcję try...catch...finally (przy czym finally jest opcjonalne):

  try {
    zrobCos();
  } catch (wyjatek) {
    alert("Nastąpił wyjątek: " + wyjatek.toString());
  } finally {
    posprzataj();
  }
  ...
  throw("nastapil blad");

[edytuj] Umieszczanie kodu JavaScript w plikach HTML i XHTML

W kodzie HTML 4.x skrypty JavaScript umieszczamy wewnątrz znaczników <script>. Wymaganym parametrem tego znacznika jest type równe dla JavaScriptu "text/javascript". Opcjonalnie można podać parametr language oznaczający minimalny numer wersji JavaScriptu wymaganej przez skrypt:

  <script type="text/javascript" language="JavaScript1.5">
   // Ten skrypt wymaga JS 1.5.
   // Zostanie zignorowany przez przeglądarki
   // nie obsługujące tej wersji języka
     function fun() {
        try {
          ...
        } catch (e) {
          ...
        }
     }
</script>

W przypadku XHTML 1.x nie występuje parametr language. Ponadto specyfikacja XML wymaga, by umieścić treść skryptu wewnątrz sekcji CDATA, jeśli używamy znaków takich jak "<" czy ">". Tak więc dla XHTML:

  <script type="text/javascript">
  // <![CDATA[
     function fun() {
        ...
     }
  // ]]>
  </script>

Znaki komentarza "//" przy początku i końcu sekcji CDATA zapobiegają błędnemu zinterpretowaniu tej sekcji przez starsze przeglądarki.

Zewnętrzne skrypty dodajemy także przy użyciu w/w znacznika, dodając tylko parametr src z nazwą pliku zawierającego kod skryptu:

<script type="text/javascript" src="plik.js"></script>

Typem MIME dla samodzielnych plików z kodem w JavaScripcie jest "text/javascript" lub "application/x-javascript".

[edytuj] JavaScript w przeglądarkach internetowych

Implementacje JavaScriptu w przeglądarkach internetowych dostarczają obiektów pozwalających na modyfikowanie zawartości dokumentu oraz tworzenie i odczyt tzw. cookies (obiekt document), manipulowanie oknami i wyświetlanie prostych okien dialogowych (obiekt window), pobieraniem informacji o przeglądarce (obiekt navigator), sterowaniem pluginami przeglądarek oraz obsługą zdarzeń.

Problem z manipulowaniem zawartością dokumentu stanowił brak standaryzacji obiektowego modelu dokumentu (DOM) - początkowo w wersjach 4.x przeglądarek Netscape dostęp do niektórych elementów dokumentu możliwy był przy użyciu kolekcji document.layers, a w Internet Explorerze 4.x - document.all.

Organizacja W3C opracowała jednak jednolity DOM, obsługiwany przez wszystkie współczesne przeglądarki (Netscape od wersji 6, IE od wersji 5, Opera od wersji 6, Konqueror od wersji 3, Mozilla Suite, Mozilla Firefox i Safari w dowolnej wersji). Aby uzyskać referencje do obiektu wewnątrz dokumentu HTML, należy skorzystać z metody document.getElementById(identyfikator), tym samym wymienione wcześniej kolekcje all i layers uważa się za przestarzałe.

[edytuj] Java i JavaScript

Początkowo Netscape nazwała ten język "LiveScript", lecz szybko nazwa ta została zmieniona na "JavaScript" wskutek biznesowych porozumień między Netscape a firmą Sun Microsystems. Nazwa ta powoduje wiele nieporozumień wśród początkujących programistów.

Mimo odrębności tych języków, skrypty JavaScriptu mogą mieć dostęp do publicznych metod klas Javy (głównie apletów) dzięki tzw. technologii LiveConnect. Programiści Javy mogą także stosować klasę netscape.javascript.JSObject jako "opakowanie" obiektów JavaScriptu, jednakże możliwość ta dostępna jest jedynie, jeśli aplet Javy i skrypt JavaScriptu uruchamiane są przez przeglądarki Mozilla Suite, Mozilla Firefox, Opera i Netscape.

[edytuj] Zobacz też

• DHTML - wykorzystanie języka Javascript do tworzenia dynamicznych stron WWW.
• AJAX - połącznie DHTML z dynamicznymi skryptami wykonywanymi po stronie serwera WWW.

[edytuj] Linki zewnętrzne

• Specyfikacja języka ECMAScript
• Propozycja języka JavaScript 2.0 (Mozilla.org)
• JavaScripcie 1.5 dokumentacja (en) • przewodnik (en)
  • polskie tłumaczenie: dokumentacja • przewodnik
• JavaScripcie 1.4 dokumentacja (en) • przewodnik (en)
• JavaScripcie 1.3 dokumentacja (en) • przewodnik (en)
• Zasoby Mozilla.org na temat JavaScript
• Zasoby MSDN na temat Microsoft JScript
• Kurs i skrypty JavaScript
• jsConcise sourceforge.net