1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
|
---
title: Обзор JavaScript
slug: Web/JavaScript/JavaScript_technologies_overview
translation_of: Web/JavaScript/JavaScript_technologies_overview
---
<div>{{JsSidebar("Introductory")}}</div>
<h2 id="Введение">Введение</h2>
<p>Если HTML определяет структуру и контент веб-страницы, а CSS задает формат и внешний вид, то JavaScript добавляет интерактивность и создает богатые веб-приложения. </p>
<p>Однако, под общим термином "JavaScript", в контексте веб-браузера, понимаются несколько очень разных вещей. Одна из них - это базовый язык программирования (ECMAScript), а другая - коллекция Web APIs, включая DOM (Объектно-ориентированная модель документа).</p>
<h2 id="JavaScript_базовый_язык_программирования_(ECMAScript)">JavaScript, базовый язык программирования (ECMAScript)</h2>
<p>Базовый язык JavaScript стандартизирован комитетом ECMA TC-39 как язык программирования под названием <a href="/en-US/docs/JavaScript/Language_Resources" title="en-US/docs/JavaScript/Language_Resources">ECMAScript</a>.</p>
<p>Базовый язык также используется в не-браузерном окружении, например, в <a href="http://nodejs.org/">node.js</a>.</p>
<h3 id="Что_попадает_под_понятие_ECMAScript">Что попадает под понятие ECMAScript?</h3>
<p>Кроме прочего, <a href="/en-US/docs/JavaScript/Language_Resources" title="en-US/docs/JavaScript/Language_Resources">ECMAScript</a> определяет:</p>
<ul>
<li>Синтаксис языка (правила парсинга, ключевые слова, порядок выполнения, инициализацию объекта литерала...)</li>
<li>Механизм обработки ошибок (исключения, try/catch оператор,возможность создавать новые типы ошибок)</li>
<li>Типы данных (логические, числа, строки, функции, объекты...)</li>
<li>Глобальный объект. В браузерах глобальным объектом является <code>window</code>, но ECMAscript определяет только те APIs, которые не являются специфическими для браузера, как <code>parseInt</code>, <code>parseFloat</code>, <code>decodeURI</code>, <code>encodeURI</code>...</li>
<li>Механизм прототипного наследования</li>
<li>Встроенные объекты и функции (JSON, Math, Array.prototype методы, методы самоанализа объекта...)</li>
<li>Строгий режим</li>
</ul>
<h3 id="Браузерная_поддержка">Браузерная поддержка</h3>
<p>На октябрь 2016, текущие версии основы веб-браузеров включали <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5.1</a> и <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_2015_support_in_Mozilla">ECMAScript 2015</a>, но более старые версии (все еще находящиеся в использовании) реализуют только ECMAScript 5.</p>
<h3 id="Будущее">Будущее</h3>
<p>Главное 6-ое издание ECMAscript было официально одобрено и опубликовано как стандарт 17 июня 2015 года на собрании ECMA General Assembly. С тех пор выпуски ECMAscript публикуются на ежегодной основе.</p>
<h3 id="API_по_интернационализации">API по интернационализации</h3>
<p><a href="http://ecma-international.org/ecma-402/1.0/">Спецификация ECMAScript для API по интернационализации</a> - дополнение к языковой спецификации ECMAScript, также стандартизированной Ecma TC39. API по интернационализации обеспечивает сопоставление (строковое сравнение), форматирование чисел, дат и времени для приложений на JavaScript, позволяя выбирать язык и проектировать функционал в зависимости от нужд. Начальный стандарт был одобрен в декабре 2012; статус реализации в браузерах ведется в документации <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Intl"><code>Intl</code> object</a>. Спецификация по интернационализации сейчас также утверждается на ежегодной основе, и браузеры постоянно улучшают ее реализацию.</p>
<h2 id="DOM_APIs">DOM APIs</h2>
<h3 id="WebIDL">WebIDL</h3>
<p><a class="external" href="http://dev.w3.org/2006/webapi/WebIDL/" title="http://dev.w3.org/2006/webapi/WebIDL/">Спецификация WebIDL </a>является связующим звеном между технологиями DOM и ECMAScript.</p>
<h3 id="Ядро_DOM">Ядро DOM</h3>
<p>Объектно-ориентированная модель документа (DOM) это кросс-платформенное, <strong>языково-независимое соглашение</strong> по представлению объектов и взаимодействию с ними в документах HTML, XHTML и XML. Объект в <strong>DOM-дереве</strong> может быть адресован и обработан с помощью своих методов. Ядро Объектно-ориентированной модели документа стандартизируется W3C и определяет языково-независимые интерфейсы, абстрагирующие HTML и XML документы как объекты, и механизмы для управления этой абстракцией. Кроме прочих вещей, опряденных в DOM, можно также найти:</p>
<ul>
<li>Структуру документа, древовидную модель, и архитектуру событий DOM в <a class="external" href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html" title="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html">ядре DOM</a>: <code>Node</code>, <code>Element</code>, <code>DocumentFragment</code>, <code>Document</code>, <code>DOMImplementation</code>, <code>Event</code>, <code>EventTarget</code>, …</li>
<li>Менее строгое определение архитектуры событий DOM, также как и определенные <a class="external" href="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html" title="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html">события DOM</a>.</li>
<li>Другие вещи, такие как <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Traversal-Range/traversal.html">DOM Traversal</a> и <a class="external" href="http://html5.org/specs/dom-range.html" title="http://html5.org/specs/dom-range.html">DOM Range</a>.</li>
</ul>
<p>С точки зрения ECMAScript, объекты определенные в спецификации DOM называются объектами среды исполнения ("host objects").</p>
<h3 id="HTML_DOM">HTML DOM</h3>
<p><a class="external" href="http://www.whatwg.org/html" title="http://www.whatwg.org/html">HTML</a>, это язык разметки Web, который определен в терминах DOM/ is specified in terms of the DOM. Layered above the abstract concepts defined in DOM Core, HTML also defines the <em>meaning</em> of elements. The HTML DOM includes such things as the <code>className</code> property on HTML elements, or APIs such as {{ domxref("document.body") }}.</p>
<p>The HTML specification also defines restrictions on documents; for example, it requires all children of a <code>ul</code> element, which represents an unordered list, to be <code>li</code> elements, as those represent list items. In general, it also forbids using elements and attributes that aren't defined in a standard.</p>
<h2 id="Другие_API_заслуживающие_внимания">Другие API, заслуживающие внимания</h2>
<ul>
<li>Функции setTimeout и setInterval впервые были определены в интерфейсе <a class="external" href="http://www.whatwg.org/html/#window" title="http://www.whatwg.org/html/#window">Window</a> в стандарте HTML.</li>
<li><a class="external" href="http://dev.w3.org/2006/webapi/XMLHttpRequest-2/" title="http://dev.w3.org/2006/webapi/XMLHttpRequest-2/">XMLHttpRequest</a> позволяет отправлять асинхронные HTTP запросы.</li>
<li>Объектная модель <a class="external" href="http://dev.w3.org/csswg/cssom/">CSS</a> абстрагировать CSS-правила как объекты</li>
<li><a class="external" href="http://www.whatwg.org/specs/web-workers/current-work/">WebWorkers</a> обеспечивает выполнение параллельных вычислений.</li>
<li><a class="external" href="http://www.whatwg.org/C/#network">WebSockets</a> обеспечивает низкоуровневое двунаправленное соединение.</li>
<li><a class="external" href="http://www.whatwg.org/html/#2dcontext" title="http://www.whatwg.org/html/#2dcontext">Canvas 2D Context</a> это API для рисования с помощью элемента {{htmlelement("canvas")}}..</li>
</ul>
<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>
<p>Каждый разработчик сталкивавшийся с DOM понимает как там все <a href="http://ejohn.org/blog/the-dom-is-a-mess/" title="http://ejohn.org/blog/the-dom-is-a-mess/">безнадёжно</a>. Реализация той иной функциональности может отличаться, а следовательно и поведение. Главной причиной этого послужило то, что само описание спецификации DOM, было недостаточно ясным и подробным для разработчиков браузеров. Кроме того разные производители браузеров добавили несовместимые функциональности в своих браузеры или функциональности перекрывающие друг друга (например модель событий в IE). В данный момент консорциум W3C и частично WHATWG пытаются описать детально поведение тех или иных функций, чтобы улучшить совместимость между браузерами. Следуя этой тенденции, можно надеяться что браузеры улучшат свои реализации основываясь на этих спецификациях.</p>
<p>Наиболее общий, но возможно не самый надежный способ улучшить кроссбраузерную совместимость это воспользоваться библиотеками JavaScript. Эти библиотеки абстрагируют вас от особенностей реализации DOM в том или ином браузере, и гарантируют, что их API работает одинаково в разных браузерах. Наиболее распространенные из них это <a class="external" href="http://jquery.com/">jQuery</a> и <a class="external" href="http://www.prototypejs.org/">prototype</a>.</p>
|
