Введение в ECMAScript 6 (ES-2015)

[JustDont]

Казалось бы мы изменяем свойство объекта B НО после выполнения данного кода и B.a и A.a будут равны 2. Ситуацию можно исправить используя метод Object.assign().

Если вы что-то такое пишете, но не используете магических слов shallow clone — вы только добавляете проблем людям, которые когда-нибудь в будущем подумают, что они могут склонировать что угодно через Object.assign(). Не надо так.

[Elliot_001]

Извините, но где это я добовляю проблем?
Я явно написал то что

Метод Object.assign() используется для копирования значений всех собственных перечисляемых свойств из одного или более исходных объектов в целевой объект. После копирования он возвращает целевой объект.

Почему это люди должны думать то что с помощью Object.assign() можно клонировать «всё что угодно»?
Я написал что был добавлен новый метод для клонирования объектов и преимущество его использования, рассмотрев в качестве примера проблему мутации при копировании объектов без этого метода!

[sfi0zy]

К тому же переменные объявленные с ключевым словом const являются неизменными константами.

Не совсем. Нельзя зделать так:

const a = 1;
a = 2; // error

А вот так очень даже можно:

const b = [1,2,3];
b[0] = 'ooops!';

Занятный пример про for in / for of и различия:

var a = [1,2,3];
a['foo'] = 'ooops!';

for (var prop of a) {
    console.log(prop); // 1 2 3
}

for (var prop in a) {
    console.log(a[prop]); // 1 2 3 ooops!
}

нет встроенной инкапсуляций, но ее можно организовать самому. Например вот так

Лучше использовать модули — понятнее будет.

super() можно использовать для вызова методов родительского класса из дочернего.

Их и через this можно использовать — они же наследуются.

Символы являются служебными инструментами и поэтому вам вряд ли придётся с ними работать

Их полезно использовать при расширении сторонних модулей, чтобы не получить случайно коллизию имен и головную боль, а еще можно добавлять метаданные к объектам — прикольная штука для отладки.

[myemuk]

А вот так очень даже можно:

const b = [1,2,3];
b[0] = 'ooops!';

Да, таких ограничений не было. Запрещено полное присваивание b, например

b = 'error';

[sfi0zy]

Я видел много людей, у которых разрывало мозг, когда уже в процессе работы они обнаруживали, что значение «неизменной константы» (как говорит автор) изменилось. В статье стоило бы явно написать, что такое возможно.

[sfi0zy]

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

[sfi0zy]

Предлагаю минусующим предыдущий комментарий выстроить более продуктивный диалог. Статья — для новичков в этой области. Автор за «простыми словами» забывает про очень важные и совсем не очевидные для начинающих особенности языка, при этом местами подкрепляя свои слова очень спорными примерами. Если вы считаете, что в такой ситуации не нужно делать замечания — поясните, почему? Если не согласны с замечаниями — сделайте их лучше, это будет полезно тем, кто будет читать статью в будущем.

[Free_ze]

Не совсем. Нельзя зделать так

Переменная (ссылка) ведь действительно не изменится, а объект иммутабельным не становится, этого никто не обещал.

Их и через this можно использовать — они же наследуются.

Когда есть переопределение и нужен именно родительский вариант, то this не поможет.

[mayorovp]

Когда есть переопределение и нужен именно родительский вариант, то this не поможет.

Да, но в приведенных примерах кода таких случаев нет (кроме конструктора)

[Elliot_001]

К тому же переменные объявленные с ключевым словом const являются неизменными константами.

Это правда так. Можете посмотреть в документацию. Но вы точно подметили то что атрибуты объектов не защищены и их можно изменять. Это очередная фича js. Думаю я упустил это потому что старался сделать статью максимально информативной и краткой из за чего некоторые моменты пришлось опустить. Ибо более глубокое рассмотрения тонкостей js выходит за пределы этой статьи. Но наверное мне стоило привести больше примеров для лучшего понимания….

Занятный пример про for in / for of и различия:

. Вообще я упоминал об этом в статье:

Кроме того, итерационная переменная представляет собой строку, а не число, а значит, если вы собираетесь производить какие — либо подсчеты с переменной, вам потребуется провести конкатенацию строк вместо добавления.

То есть при переборе свойств через for...in итерационная переменная возвращает строки а не числа. Я просто не стал приводить пример, ведь и так всё понятно.

Лучше использовать модули — понятнее будет.

Возможно и понятнее, но иногда это не то что нужно. Выбор между этими двумя способами обуславливается предпочтениями программиста.

Их и через this можно использовать — они же наследуются.

Да, но мы можем переопределить этот метод в дочернем классе и тогда от использования ключевого слова (this or super) будет зависеть какой метод вызовется: метод из дочернего класса или из родительского.

[vanxant]

Итератор нужен, если вы пилите объект-контейнер (который может содержать другие объекты). С итератором вы можете прокатываться по такому объекту через for и не разбираться, где там объекты-потомки, а где технические поля самого контейнера.

[pinbraerts]

Не могли бы вы ваш "простой язык" прогнать через проверку орфографии перед публикацией?

[sultan99]

Уже на подходе спецификация ES10, а вы еще пишите о ES6, сколько можно?

[syncro]

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

[Elliot_001]

Ну знаете ли многие и в 2019 не знают о ES6 а кто то и вообще только начинает изучать js. ES2015 было самым крупным обновлением за последнее время поэтому я и решил написать про это статью. Если вы знаете ES6 то это не значит что все знают ES6.

[AlexXYZ]

2023 год. И я только приступил. Статью легко читать и сейчас. Спасибо.

[kinguru]

JS все страшнее и страшнее становится

[Tantrido]

Спасибо! Просто и полезно!

[YemSalat]

В примере про стрелочные функции

const Fun = (data) => { data.response }

Что эта функция делает? Как вы думаете что она вернет?

Promise

async/await? 2020 год на носу

[Free_ze]

async/await?

ES8 же.

2020 год на носу

Костыли в виде препроцессинга — вот это 2020, который я люблю.

[YemSalat]

Костыли в виде препроцессинга — вот это 2020, который я люблю.

Для async/await уже относительно давно можно не «препроцессить»
caniuse.com/#feat=async-functions

[Free_ze]

Эх, а у нас пара заказчиков с корпоративными клиентами все еще на IE11.

И все же, изучать лишь сахар без нижележащих технологий, кмк, достаточно безрассудно.

[syncro]

промисы это вобщем-то как раз про async/await

[Elliot_001]

const Fun = (data) => { data.response }

Что эта функция делает? Как вы думаете что она вернет?

Она возвращает data.response
Если вы думаете где ее использовать, то я скажу в ajax запросах, например так:

$.ajax({
		url: "https://myAPIService&param=10",
		success: (data) => myFun(data.response)
	});

Или ее можно использовать как калбек функцию принимающую data и возвращающую (передающую дальше) необходимые данные из запроса.

[mxmvshnvsk]

А вы вообще запускали этот код?)

const Fun = (data) => { data.response }

Она возвращает data.response

[mayorovp]

Вообще-то, она возвращает undefined.

[Elliot_001]

async await были представлены не в ES2015! А это статья про ES2015!

[mxmvshnvsk]

Хороший пример того, как не нужно делать статьи на Хабр.

[Elliot_001]

Аргументируйте пожалуйста!

[mxmvshnvsk]

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

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

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

const Fun = (data) => { data.response }

А теперь давайте запустим:

const data = { response: 'some data' };

// вернет undefined, так как вы используете литералы тела стрелочной функции
// это как минимум должно заставить вас задуматься,
// если комментарии выше не сказали ничего
Fun(data);

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

Вы не раскрываете темы, например Promise, вы даже про catch не написали, я уже не говорю про race например.

Если люди в огромном количестве информации по этой теме ничего не нашли, то ваша статья их уже не спасет.

Ну знаете ли многие и в 2019 не знают о ES6 а кто то и вообще только начинает изучать js.

P.S. Я не пытаюсь вас оскорбить, не нужно воспринимать критику близко к сердцу, просто примите к сведению.

[genew]

Исправьте пожалуйста ошибки в разделе про итераторы (возврощяет, врятле). Глаза кровоточат.

[SnyMaster]

Дочитал до кода:

function myFunction() {
    if (true)
        let a = 5;
    console.log(a); //SyntaxError так как a доступна только в блоке if
    if (true)
        var b = 5;
    console.log(b); //5 так как b доступна во всей функции
}

НО такой код вызывает ошибку: "'let' declarations can only be declared inside a block.", кроме того, что он плохо читается.

«let» для такого примера, должен объявляться внутри "{… }"!!!

Дальше читать статью не имеет смысла.

[Elliot_001]

НО такой код вызывает ошибку: "'let' declarations can only be declared inside a block.", кроме того, что он плохо читается.

В Firefox 68.0.1 код вызывает

SyntaxError: lexical declarations can't appear in single-statement context

«let» для такого примера, должен объявляться внутри "{… }"!!!

Ну да а по отступам не понятно? Если выражение одно принято не писать кавычки. Ну тут скорее уж дело вкуса. Но зачем придираться до этого?

[mayorovp]

То есть, вы проверили код в Firefox, он привел к ошибке — но вы все равно его выложили? Вы правда считаете такой подход нормальным?!

[mxmvshnvsk]

Кавычки — это '' или "", в вашем случае это фигурные скобки {}! В какой вообще вселенной так принято, такой код вызовет у людей только недоумение и боль. Есть кейс писать это в одну строку, но это тоже очень плохая практика!

Если выражение одно принято не писать кавычки.

Тот факт, что ваш код вообще вызывает какие-то варнинги или ошибки вас не смущает?

В Firefox 68.0.1 код вызывает
SyntaxError: lexical declarations can't appear in single-statement context

Я напомню, статья про JavaScript, а не про Python.

Ну да а по отступам не понятно?