Implementacja JavaScript

Kern ECMAScript (JavaScript) opisuje gramatykę i podstawowe obiekty języka;

DOM opisuje metody i interfejsy do przetwarzania treści strony;

BOM opisuje metody i interfejsy do interakcji z przeglądarką.

ECMAScript, DOM i BOM

Chociaż ECMAScript jest ważnym standardem, nie jest to jedyny element JavaScript, oczywiście, nie jest to również jedyny element standaryzowany. W rzeczywistości, pełna implementacja JavaScript składa się z trzech różnych części:

JavaScript obejmuje ECMAScript, DOM i BOM

ECMAScript

ECMAScript nie jest związany z żadną konkretną przeglądarką, w rzeczywistości, nie wspomina również o metodach wejścia/wyjścia użytkownika (co różni się od języków takich jak C, które wymagają zewnętrznych bibliotek do realizacji takich zadań). Więc co to jest ECMAScript? Opis standardu ECMA-262 (sek. 2) brzmi następująco:

„ECMAScript może dostarczać kluczowe możliwości programowania skryptów dla różnych środowisk hostów, więc kluczowy język skryptowy jest regulowany niezależnie od jakiegokolwiek konkretnego środowiska hosta... ...”

Przeglądarka internetowa jest środowiskiem hosta dla ECMAScript, ale nie jest to jedyne środowisko hosta. W rzeczywistości istnieje nieskończona liczba różnych środowisk (np. Nombas ScriptEase oraz ActionScript używany przez Macromedia w Flash i Director MX), które mogą zawierać realizację ECMAScript. Co więc ECMAScript reguluje poza przeglądarkami?

Prosto mówiąc, ECMAScript opisuje następujące zawartości:

  • Gramatyka
  • Typy
  • Zdania
  • Kluczowe słowa
  • Słowa kluczowe
  • Operatorzy
  • Obiekty

ECMAScript jest tylko opisem, który definiuje wszystkie atrybuty, metody i obiekty języka skryptowego. Inne języki mogą realizować ECMAScript jako punkt odniesienia dla funkcji, JavaScript jest jednym z nich:

ECMAScript, JavaScript, ActionScript, ScriptEase

Każdy przeglądarka ma swoją własną realizację interfejsu ECMAScript, a następnie ta realizacja jest rozszerzana, zawierając DOM i BOM (będą omówione w następnych rozdziałach). Oczywiście istnieją również inne realizacje języka, które rozszerzają ECMAScript, takie jak Windows Script Host (WSH), ActionScript w Flash i Director MX Macromedia, oraz Nombas ScriptEase.

1. Wersje ECMAScript

ECMAScript dzieli się na kilka różnych wersji, które są zdefiniowane w standardzie o nazwie ECMA-262. Jak inne standardy, ECMA-262 jest redagowany i aktualizowany. Kiedy pojawia się główna aktualizacja, jest publikowana nowa wersja standardu. Najnowsza wersja ECMA-262 to 5.1, która została opublikowana w czerwcu 2011 roku.

Pierwsza wersja ECMA-262 jest w zasadzie taka sama jak Netscape JavaScript 1.1, ale wszystkie kod związane z przeglądarką zostały usunięte, oprócz kilku drobnych dostosowań. Po pierwsze, ECMA-262 wymaga wsparcia dla standardu Unicode (w celu wsparcia wielojęzyczności). Po drugie, wymaga, aby obiekty były niezależne od platformy (w rzeczywistości Netscape JavaScript 1.1 ma różne realizacje obiektów, na przykład obiekt Date zależy od platformy). To jest główny powód, dla którego JavaScript 1.1 i 1.2 nie odpowiadały specyfikacji ECMA-262 pierwszej wersji.

Większość aktualizacji drugiej wersji ECMA-262 była głównie edytorską. Tego razu aktualizacja standardu miała na celu ścisłą zgodność z ISO/IEC-16262, nie dodając, zmieniając ani usuwając żadnych treści. ECMAScript zazwyczaj nie przestrzega drugiej wersji.

Trzecia wersja ECMA-262 była pierwszą prawdziwą aktualizacją tego standardu. Zapewniała aktualizacje dotyczące przetwarzania ciągów znaków, definicji błędów i wyjścia liczb. Ponadto, dodała obsługę wyrażeń regularnych, nowych instrukcji kontrolnych, obsługi wyjątków try...catch oraz kilka drobnych zmian na potrzeby standaryzacji międzynarodowej. Ogólnie rzecz biorąc, oznaczało to, że ECMAScript stał się prawdziwym językiem programowania.

2. Co to jest zgodność ECMAScript

W ECMA-262, zgodność ECMAScript ma jasno zdefiniowane znaczenie. Język skryptowy musi spełniać poniższe cztery podstawowe zasady:

  • Dopuszczalne implementacje muszą obsługiwać wszystkie
  • Dopuszczalne implementacje muszą obsługiwać standard Unicode (UCS)
  • Dopuszczalne implementacje mogą obsługiwać

Wszystkie implementacje ECMAScript muszą odpowiadać powyższym standardom.

Wsparcie ECMAScript w przeglądarkach internetowych

Netscape Navigator 3.0, który zawiera JavaScript 1.1, został wydany w 1996 roku. Następnie, specyfikacja JavaScript 1.1 została przedłożona jako projekt nowego standardu do ECMA. Z popularnością JavaScript, Netscape z radością zaczął rozwijać wersję 1.2. Ale był jeden problem, ECMA nie zaakceptowała projektu Netscape. Niebawem po wydaniu Netscape Navigator 3.0, Microsoft wydał IE 3.0. Ta wersja IE zawierała JScript 1.0 (nazwa implementacji JavaScript własnego Microsoftu), która miała być porównywalna z JavaScript 1.1. Jednak ze względu na brak dokumentacji oraz niektóre niewłaściwe powtarzające się cechy, JScript 1.0 znacznie ustępował poziomowi JavaScript 1.1.

Przed ostatecznym zatwierdzeniem pierwszej wersji ECMA-262, Netscape Navigator 4.0 z JavaScript 1.2 został wydany w 1997 roku. Później w tym roku, standard ECMA-262 został zaakceptowany i zstandaryzowany. Zatem JavaScript 1.2 nie jest zgodny z pierwszą wersją ECMAScript, mimo że ECMAScript powinien być oparty na JavaScript 1.1.

Następny krok JScript to JScript 3.0 w IE 4.0 (wersja 2.0 została wydana z IIS 3.0, ale nie była zawarta w przeglądarce). Microsoft mocno promował JScript 3.0 jako pierwszy na świecie język skryptowy, który w pełni odpowiada standardowi ECMA. Wtedy jeszcze ECMA-262 nie został ostatecznie ukończony, więc JScript 3.0 również miał ten sam los co JavaScript 1.2 - nie spełnił ostatecznie standardu ECMAScript.

Netscape wybrał aktualizację swojej implementacji JavaScript w Netscape Navigator 4.06. JavaScript 1.3 w końcu doprowadził Netscape do pełnej zgodności z pierwszą wersją ECMAScript. Netscape dodał wsparcie dla standardu Unicode i umożliwił wszystkim obiektom zachowanie nowych funkcji wprowadzonych w JavaScript 1.2, jednocześnie osiągając niezależność platformową.

Kiedy Netscape opublikował swój kod źródłowy jako projekt Mozilla, planowano, że JavaScript 1.4 zostanie zintegrowany z Netscape Navigator 5.0. Jednakże, decyzja o całkowitym przeprojektowaniu kodu Netscape zniszczyła ten projekt. JavaScript 1.4 został wydana tylko jako język skryptowy serwerowy Netscape Enterprise Server i nigdy nie został umieszczony w przeglądarce.

Obecnie wszystkie główne przeglądarki internetowe przestrzegają wersji trzeciej ECMA-262.

Poniższa tabela przedstawia wsparcie ECMAScript w większości popularnych przeglądarek internetowych:

Przeglądarka Zgodność DOM
Netscape Navigator 2.0 -
Netscape Navigator 3.0 -
Netscape Navigator 4.0 - 4.05 -
Netscape Navigator 4.06 - 4.79 Edycja 1
Netscape 6.0+ (Mozilla 0.6.0+) Edycja 3
Internet Explorer 3.0 -
Internet Explorer 4.0 -
Internet Explorer 5.0 Edycja 1
Internet Explorer 5.5+ Edycja 3
Opera 6.0 - 7.1 Edycja 2
Opera 7.2+ Edycja 3
Safari 1.0+/Konqueror ~ 2.0+ Edycja 3

DOM

DOM (Document Object Model) jest interfejsem aplikacyjnym (API) dla HTML i XML. DOM planuje całą stronę jako dokument z hierarchią węzłów. Każda część strony HTML lub XML jest potomkiem węzła. Weźmy pod uwagę poniższą stronę HTML:

<html>
  <head>
    <title>Sample Page</title>
  </head>
  <body>
    <p>hello world!</p>
  </body>
</html>

To kod można przedstawić jako diagram hierarchii węzłów DOM:

Drzewo hierarchiczne węzłów DOM

DOM reprezentuje dokument poprzez tworzenie drzewa, co daje deweloperom bezprecedensową kontrolę nad zawartością i strukturą dokumentu. Dzięki DOM API można łatwo usuwać, dodawać i zastępować węzły.

1. Dlaczego DOM jest niezbędny

Od wersji IE 4.0 i Netscape Navigator 4.0, które wspierały różne formy dynamicznego HTML (DHTML), deweloperzy po raz pierwszy mogli zmieniać wygląd i zawartość strony bez ponownego wczytywania jej. To był wielki przełom w technologii Web, ale przyniósł również ogromne problemy. Netscape i Microsoft rozwijali swoje własne DHTML, co zakończyło okres, w którym deweloperzy mogli pisać jedną stronę HTML, dostępna dla wszystkich przeglądarek.

Przemysł zdecydował, że musi coś zrobić, aby zachować międzyplatformowość Web, obawiając się, że jeśli pozwoli na to Netscape i Microsoft, Web rozpadnie się na dwie niezależne części, każda z nich odpowiednia tylko dla określonych przeglądarek. Dlatego zespół odpowiedzialny za określanie standardów komunikacji w Web, W3C (World Wide Web Consortium), zaczął tworzyć DOM.

2. Poziomy DOM

DOM Level 1 został zaproponowany przez W3C w październiku 1998 roku. Składa się z dwóch modułów, tj. DOM Core i DOM HTML. Pierwszy z nich dostarcza strukturę dokumentu opartą na XML, aby można było uzyskać dostęp do dowolnej części dokumentu i operować na niej; drugi dodaje obiekty i metody specyficzne dla HTML, rozszerzając w ten sposób DOM Core.

Uwaga, DOM nie jest wyłącznie własnością JavaScript, w rzeczywistości wiele innych języków zaimplementowało go. Jednak DOM w przeglądarkach internetowych został zaimplementowany za pomocą ECMAScript i jest teraz dużą częścią języka JavaScript.

DOM Level 1 jest tylko celem, który polega na planowaniu struktury dokumentu, podczas gdy cele DOM Level 2 są znacznie szersze. Rozszerzenie oryginalnego DOM o wsparcie dla zdarzeń myszy i interfejsów użytkownika (DHTML oferuje bogate wsparcie dla tego), zakres, przegląd (powtarzające się metody DOM dokumentu) oraz wsparcie dla CSS (kaskadowych tablic stylów) poprzez interfejs obiektowy. Oryginalny DOM Core wprowadzony na poziomie 1 również dodał wsparcie dla przestrzeni nazw XML.

DOM Level 2 wprowadził kilka nowych modułów DOM, które są używane do przetwarzania nowych typów interfejsów:

  • Widoki DOM - opis śledzenia różnych widoków dokumentu (czyli dokument przed i po stylizacji CSS)
  • Zdarzenia DOM - opis interfejsów zdarzeń
  • Styl DOM - opis interfejsów do przetwarzania opartych na CSS stylów
  • Przegląd i zakres DOM - opis interfejsów do przeglądania i operowania na drzewie dokumentu

DOM Level 3 wprowadził metody do jednorodnego ładowania i utrzymywania dokumentu (zawarte w nowym modułu DOM Load and Save) oraz metody walidacji dokumentu (walidacja DOM), co pozwoliło na dalsze rozszerzenie DOM. W poziomie 3, DOM Core został rozszerzony o wsparcie dla wszystkich cech XML 1.0, w tym XML Infoset, XPath i XML Base.

Podczas nauki DOM, można napotkać osoby, które odnoszą się do DOM Level 0. Pamiętaj, że nie istnieje standard DOM Level 0, jest to tylko historyczny punkt odniesienia DOM (DOM Level 0 odnosi się do pierwotnego DHTML wspieranego przez IE 4.0 i Netscape Navigator 4.0).

3. Inne DOM

Oprócz DOM Core i DOM HTML, inne języki również opublikowały swoje standardy DOM. Wszystkie te języki są oparte na XML, a każdy DOM dodaje unikalne metody i interfejsy dla odpowiedniego języka:

  • Język wektorów skalowalnych (SVG) 1.0
  • Język znaczników cyfrowych (MathML) 1.0
  • Język integracji multimedii synchronicznej (SMIL)

Komentarz:Jeśli chcesz dowiedzieć się więcej, odwiedź CodeW3C Kurs SMIL i Kurs SVG.

Ponadto, inne języki również opracowały swoje implementacje DOM, takie jak język interfejsu użytkownika XML Mozilla (XUL). Jednak tylko wymienione powyżej języki są zalecanymi standardami W3C.

Wsparcie DOM w przeglądarkach internetowych

DOM był już standardem przed tym, zanim został zaimplementowany w przeglądarkach internetowych. IE pierwszy raz próbował zaimplementować DOM w wersji 5.0, ale rzeczywiście obsługa DOM została wprowadzona dopiero w wersji 5.5, gdzie IE zaimplementował Poziom 1 DOM. Od tamtej pory IE nie wprowadził nowych funkcji DOM.

Netscape dodał obsługę DOM dopiero w wersji 6 (Mozilla 0.6.0). Obecnie Mozilla ma najlepszą obsługę DOM, realizując pełny Poziom 1, prawie w całości Poziom 2 oraz część Poziomu 3 (cel grupy deweloperskiej Mozilla to budowa przeglądarki zgodnej z normą 100%, ich praca przyniosła owoc.).

Opera do wersji 7.0 dodała obsługę DOM, a Safari również zaimplementowała większość Poziomu 1. Wiele z nich jest na tym samym poziomie co IE 5.5, a w niektórych przypadkach nawet wyższym. Jednak pod względem obsługi DOM, wszystkie przeglądarki są znacznie w tyle za Mozilla. Poniższa tabela pokazuje, jak różne przeglądarki wspierają DOM.

Przeglądarka Zgodność DOM
Netscape Navigator 1.0 - 4.x -
Netscape 6.0+ (Mozilla 0.6.0+) Poziom 1, Poziom 2, Poziom 3 (cząstkowo)
IE 2.0 - 4.x -
IE 5.0 Poziom 1 (najmniejszy)
IE 5.5+ Poziom 1 (prawie w całości)
Opera 1.0 - 6.0 -
Opera 7.0+ Poziom 1 (prawie w całości), Poziom 2 (cząstkowo)
Safari 1.0+/Konqueror ~ 2.0+ Poziom 1

Komentarz:Jeśli chcesz pogłębić wiedzę na temat DOM, odwiedź CodeW3C Kurs HTML DOM i Kurs XML DOM.

BOM

IE 3.0 i Netscape Navigator 3.0 wprowadziły funkcję - BOM (Browser Object Model), która umożliwia dostęp i operowanie na oknach przeglądarki. Dzięki BOM, deweloperzy mogą przenosić okna, zmieniać tekst w pasku stanu oraz wykonywać inne działania niezwiązane bezpośrednio z treścią strony. Co wyróżnia BOM i często budzi wątpliwości, to fakt, że jest to tylko część JavaScript, która nie ma żadnych związanych standardów.

BOM głównie obsługuje okna przeglądarki i ramki, ale zazwyczaj rozszerzenia specyficzne dla przeglądarki są uważane za część BOM. Te rozszerzenia obejmują:

  • Wysuwanie nowego okna przeglądarki
  • Przesuwanie, zamykanie okna przeglądarki oraz zmiana rozmiaru okna
  • Obiekt lokalizacji dostarczający szczegółowe informacje o przeglądarce internetowej
  • Obiekt ekranu dostarczający szczegółowe informacje o rozdzielczości ekranu użytkownika
  • Wsparcie dla cookie
  • IE rozszerzył BOM, dodając klasę ActiveXObject, która może instancjonować obiekty ActiveX za pomocą JavaScript

Brak standardów BOM, każda przeglądarka ma swoją implementację BOM. Istnieją pewne faktyczne standardy, takie jak obiekt okna i obiekt nawigacji, ale każda przeglądarka może zdefiniować swoje własne atrybuty i metody dla tych obiektów lub innych obiektów.

Zobacz: