Javascript возможности и особенности

JavaScript

JavaScript® (часто просто JS) — это легковесный, интерпретируемый или JIT-компилируемый, объектно-ориентированный язык с функциями первого класса. Наиболее широкое применение находит как язык сценариев веб-страниц, но также используется и в других программных продуктах, например, node.js или Apache CouchDB. JavaScript это прототипно-ориентированный, мультипарадигменный язык с динамической типизацией, который поддерживает объектно-ориентированный, императивный и декларативный (например, функциональное программирование) стили программирования. Подробнее о JavaScript.

Эта часть сайта посвящена самому языку JavaScript, и она не затрагивает тонкостей, связанных с веб-страницами или окружением, в котором исполняется JavaScript. Информация об API, относящихся к веб-страницам, находится в разделах, посвящённых Веб-API и DOM (en-US) .

Стандартом языка JavaScript является ECMAScript. По состоянию на 2012 год, все современные браузеры полностью поддерживают ECMAScript 5.1. Старые версии браузеров поддерживают по крайней мере — ECMAScript 3. 17 июня 2015 года состоялся выпуск шестой версии ECMAScript. Эта версия официально называется ECMAScript 2015, которую чаще всего называют ECMAScript 2015 или просто ES2015. С недавнего времени стандарты ECMAScript выпускаются ежегодно. Эта документация относится к последней версии черновика, которой является ECMAScript 2018.

Не следует путать JavaScript c языком программирования Java. И «Java», и «JavaScript» являются торговыми марками или зарегистрированными торговыми марками Oracle в США и других странах. Однако, у обоих языков различный синтаксис, семантика и применение.

Учебные материалы

Научитесь программировать на JavaScript вместе с нашим руководством.

Для абсолютных новичков

Загляните в наш Учебный План, если вам хочется изучить JavaScript, но у вас нет опыта в JavaScript или программировании. Доступные разделы:

Отвечаем на такие вопросы, как «что такое JavaScript?», «как он выглядит?», «и что он может делать?», а также обсуждаем основные возможности JavaScript, такие, как переменные, строки, числа и массивы.

Продолжаем наше изучение главных возможностей JavaScript, обращаем наше внимание на самые часто встречающиеся блоки кода, такие, как условные выражения, циклы, функции и события.

Объектно-ориентированная природа JavaScript важна для понимания, если вы хотите углубить знание языка и писать более эффективный код. Поэтому мы подготовили модуль, который поможет вам в этом.

Обсуждение асинхронного JavaScript: почему это так важно, как эта возможность языка может использована для обработки потенциальных блокирующих операций, как, например получение данных с сервера.

Когда вы пишите клиент веб-сайтов или приложений на JavaScript, вы не далеко уйдёте без использования API – интерфейсов для взаимодействия с браузером и операционной системой, на которой запущен сайт, или даже для операций с данными, полученными от других веб-сайтов и сервисов. В этом цикле статей мы разбираемся, что такое API и как использовать некоторые самые распространённые API, которые вам встретятся при разработке.

Руководство по JavaScript

Более подробное руководство по языку программирования JavaScript, нацеленное на тех, кто уже имеет опыт программирования на JavaScript или на любом другом языке.

Средний уровень

JavaScript-ффреймворки являются неотъемлемой частью современной веб-разработки,предоставляя разработчикам проверенные и протестированныеинструменты для создания масштабируемых и интерактивных веб-приложений. Многиесовременные компании используют фреймворки для своих решений, поэтому многие задачи связанные с разработкой клиентской части веб-приложений теперь требуют опыта работы с ними.

Обзор для тех, кто думает, что знает JavaScript.

Обзор существующих структур данных в JavaScript.

JavaScript предоставляет три различных оператора сравнения значений: строгое равенство === , с приведением типов == и метод Object.is() .

Замыкания это сочетание функции и лексического окружения в котором она была определена.

Продвинутый уровень

Статья разъясняет бытующие заблуждения и недооцененность наследования, основанного на прототипах.

Строгий режим говорит о том, что вы не можете использовать какую-либо переменную до её объявления. Это ограниченный вариант ECMAScript 5, для более быстрой производительности и простой отладки.

Типизированные массивы предоставляют механизм для работы с необработанными двоичными данными в JavaScript.

Жизненный цикл памяти и сборка мусора в JavaScript.

В JavaScript есть модель параллелизма, основанная на «цикле событий».

Этот документ описывает интерфейс для использования XPath в JavaScript напрямую, внутри расширений и на веб-сайтах.

Справочник

Узнайте о поведении таких операторов в JavaScript, как instanceof , typeof , new , this , приоритете операторов и многом другом.

Узнайте о do-while , for-in , for-of , try-catch , let , var , const , if-else , switch и многих других выражениях и ключевых словах в JavaScript.

Узнайте, как работать с функциями в JavaScript, чтобы разрабатывать свои приложения.

Инструменты и дополнительные ресурсы

Полезные инструменты для написания и отладки вашего JavaScript кода.

JavaScript шеллы позволяют быстро проверять фрагменты JavaScript-кода.

Объединение усилий стало проще. Добавляя TogetherJS на вашу веб-страницу, ваши пользователи могут помочь другу-другу в реальном времени!

Вопросы по JavaScript на Stack Overflow.

Просмотрите историю возможностей JavaScript и их статус.

Редактируйте JavaScript, CSS, HTML и получайте живые результаты. Используйте экспериментальные ресурсы и взаимодействуйте с вашей командой онлайн.

Plunker — это онлайн-сообщество для создания, обмена и совместной работы над идеями, касающимися веб-разработки. Редактируйте ваши JavaScript, CSS, HTML файлы, смотрите результат их выполнения и организуйте их в файловую структуру.

JS Bin это инструмент с открытым исходным кодом для отладки и совместной разработки.

Codepen ещё одна платформа для совместной веб-разработки, дающие результат в реальном-времени.

StackBlitz — это «песочница»/инструмент отладки, где вы можете размещать полновесные приложения написанные на React, Angular, т др.

Found a content problem with this page?

This page was last modified on 7 нояб. 2022 г. by MDN contributors.

Your blueprint for a better internet.

Источник

Обзор возможностей современного JavaScript

JavaScript, наверное, самый известный мультипарадигменный язык, в котором очень много неочевидных особенностей. Но тем не менее любим ли мы его или ругаем, факт остается фактом — это основной язык, на котором работает современный web.

В ушедшем году, вышел стандарт ECMAScript 2015 (неформально ES6), который сильно изменил, то к чему мы привыкли. Появилась масса новых возможностей, которые по сути представляют собой современное надмножество языка, пытающегося решить существующие проблемы. Class, let, const, стрелочные функции… разработчик, который ранее не видел код, написанный на ES6, не сразу догадается, что перед ним, по сути, старый добрый JS.

Есть масса прекрасных статей, посвященных современному стандарту. В этом же посте я хочу показать, что нам может предложить современный JS, когда необходимо решить насущную задачу. Например, поздравить всех c Новым Годом.

Императивный подход

Самый простое решение, сделать все императивно. Да, действительно, если следовать принципу «меньше больше — больше меньше», то это будет самое прагматичное решение:

function sayHappyNewYear(year) < console.log('Happy New ' + year + ' Year!'); >sayHappyNewYear(2016); 

Решение простое, и оно будет работать во всех средах, где есть реализация объекта console, но в нем есть изъян: у нас есть не только Новый Год, но и множество других праздников. Создавать для каждого праздника свою отдельную функцию не очень разумное занятие. Если нам необходимо отформатировать сообщения однообразно, то при изменении формата сообщения необходимо будет изменить соответствующий код во всех функциях (да, примеры в статье получились немного искусственными). Можно, конечно, вынести все, что связано с форматированием, в отдельную функцию formatMessage() и пропустить через нее поздравление во всех функциях. Но давайте для начала попробуем отразить предметную область с помощью ООП и посмотреть, чем нам может помочь JavaScript в этой ситуации.

Объектно-ориентированный подход

Как всем вам хорошо известно в JS можно писать в объектно-ориентированном стиле с наследованием на базе прототипов:

function Greeter() <> Greeter.prototype.doGreeting = function(msg) < console.log(msg); >function NewYearGreeter(currentYear) < this.currentYear = currentYear; >NewYearGreeter.prototype = Object.create(Greeter.prototype); NewYearGreeter.prototype.constructor = NewYearGreeter; NewYearGreeter.prototype.doGreeting = function() < var year = this.currentYear + 1; var newYearMsg = 'Happy New ' + year + ' Year!'; Greeter.prototype.doGreeting.call(this, newYearMsg); >var newYearGreeter = new NewYearGreeter(2015); newYearGreeter.doGreeting(); 

Получилось довольно многословное решение, плюс которого в том, что этот код будет работать во всех современных runtime-средах (браузеры, Node.js). Именно из-за многословности реализации объектно-ориентированного подхода в ES6 появились классы, которые знакомы любому программисту, владеющему C++, Java, C#, Python etc. Вот таким образом будет выглядеть пример выше, если использовать классы ES6:

'use strict'; class Greeter < doGreeting(msg) < console.log(msg); >> class NewYearGreeter extends Greeter < constructor(currentYear) < super(); this.currentYear = currentYear; >doGreeting() < let year = this.currentYear + 1; let newYearMsg = 'Happy New ' + year + ' Year!'; super.doGreeting(newYearMsg); >> let newYearGreeter = new NewYearGreeter(2015); newYearGreeter.doGreeting(); 

Выглядит уже симпатичнее. Но как вы наверное знаете было много споров вокруг классов в JS. Были ярые противники этого новшества. В целом их позиция была ясна — ООП в перспективе порождает проблему «гориллы и банана»:

Проблема объектно-ориентированных языков в том, что они тащат с собой всё своё неявное окружение. Вам нужен был банан – а вы получаете гориллу с бананом, и целые джунгли впридачу.
Джо Армстронг «Coders at Work»

Поэтому языковые средства, которые делали возможным создание сложной таксономии классов простым способом, воспринималось противоборствующей стороной в штыки. Как бы то ни было классы сейчас это стандарт языка, пользуйтесь, но без фанатизма.

Хорошо, если наследование порождает проблему связности, какой есть альтернативный вариант? Композиция.

Предпочитайте объектную композицию наследованию классов
Гамма, Хелм, Джонсон, Влиссидс «Приёмы объектно-ориентированного проектирования. Паттерны проектирования.»

В JS, композицию можно реализовать разными способами. Вот одно из решений, которое будет работать во всех современных runtime-средах:

function extend(destination, source) < for (var key in source) < if (source.hasOwnProperty(key)) < destinationJavascript возможности и особенности = sourceJavascript возможности и особенности; >> > function Greeter() < this.doGreeting = function(msg) < console.log(msg); >> function NewYearGreeter(year) < this.year = year; this.doNewYearGreeting = function() < var newYearMsg = 'Happy New ' + this.year + ' Year!'; this.doGreeting(newYearMsg); >> var greeter = new Greeter; var newYearGreeter = new NewYearGreeter(2016); extend(newYearGreeter, greeter); newYearGreeter.doNewYearGreeting(); 

В этом примере с помощью конструкторов создаются объекты, свойства которых (методы) компонуются в одной сущности (объект newYearGreeter) с помощью служебной функции extend. Современный стандарт позволяет упростить реализацию композиции с помощью Object.assign():

'use strict'; let greeter = < doGreeting(msg) < console.log(msg); >>; let newYearGreeter = < setYear(year) < this.year = year; >, doNewYearGreeting() < let newYearMsg = 'Happy New ' + this.year + ' Year!'; this.doGreeting(newYearMsg); >>; Object.assign(newYearGreeter, greeter); newYearGreeter.setYear(2016); newYearGreeter.doNewYearGreeting(); 

Object.assign() по сути делает тоже самое, что и extend, за тем исключением, что его можно использовать «из коробки» при этом компоновать можно любое количество объектов.

Это объектная сторона вопроса. Но JS также предоставляет средства для программирования в функциональном стиле.

Функциональный стиль

Особенность такого подхода заключается в том, что мы больше не оперируем объектами, а оперируем чистыми функциями, композиция которых позволяет решить поставленную задачу. Наш пример слишком маленький, поэтому для примера возьмем другое понятие из функционального программирования — каррирование:

function createGreeter(msg) < return function(param) < return msg.replace(/%.*%/, param); >> var greetWithNewYear = createGreeter('Happy New %year% Year!'); console.log(greetWithNewYear(2016)); 

В ES6 из средств для упрощения программирования в функциональном стиле, самое заметное нововведение — стрелочные функции. Стрелочная функция — это анонимная функция (например, функция сразу после return из примера выше) или лямбда-выражение, как говорит народ из функционального лагеря. Вот таким образом преобразуется наш пример, если мы будем использовать «толстую стрелку»:

function createGreeter(msg) < return param =>msg.replace(/%.*%/, param); > var greetWithNewYear = createGreeter('Happy New %year% Year!'); console.log(greetWithNewYear(2016)); 

Программирование в функциональном стиле дает много преимуществ: код получается компактнее без побочных эффектов, но к нему, конечно, необходимо привыкать, так как при функциональном программировании рассуждения с императивного уровня (как сделать) переходят на декларативный уровень (что сделать).

Что почитать / посмотреть?

Итоги

JavaScript развивается очень быстро — будущий стандарт готовит другие замечательные нововведения в языке, но то, что мы можем использовать для создания web-приложений уже сегодня по большому счету новая инкарнация языка, цель которой упростить жизнь всем разработчикам.

Источник