Проект:

Тенькун класс: заметки

ECMAScript 6: быстрое введение

Автор: Чжэн Сяобин.

Ссылка на курс: https://ke.qq.com/webcourse/index.html#cid=181775&term_id=100214873&taid=1062046628234767.

Архитектура программного обеспечения

Описание архитектуры программного обеспечения.

1. let — определение переменной

Пример: при нажатии на кнопку отображается соответствующий номер нажатия.

Новая функция:

let a = 12;

Код, заключённый в фигурные скобки { }, формирует область видимости блока. Например, if, for, while.

Особенности: можно использовать только в области видимости блока, var имеет область видимости функции.

Характеристики: переменная a имеет область видимости блока, b не допускает повторного объявления.

let a = 12;
let a = 5; // ошибка

В целом, let ближе к переменным в других языках программирования.

Обратите внимание, что всё, что заключено в фигурные скобки, не может быть доступно извне.

Применение: для создания закрытой области видимости.

Например, код, который создаёт закрытую область видимости:

(function() {
  var a = 12;
}());

Теперь с использованием let:

{
  let a = 12
}

Использование: закрытая область видимости позволяет решить проблему с i. Пример: при нажатии кнопки отображается соответствующий номер нажатия:

window.onload = function() {
  var aBtn = document.getElementsByTagName('input');
  for (var i = 0; i < aBtn.length; i++) {
    aBtn[i].onclick = function() {
      alert(i);
    };
  }
};

Здесь неправильно: после нажатия кнопки всегда будет отображаться «3».

Решение с использованием закрытой области видимости:

for (let i = 0; i < aBtn.length; i++) {
  aBtn[i].onclick = function() {
    alert(i);
  };
}

2. const — определение константы

const используется для определения констант, которые нельзя изменить после присвоения значения.

Пример:

const a = 12;
a = 15; // Ошибка

Примечание: const должен иметь начальное значение, его нельзя повторно объявить. Поскольку значение нельзя изменить, оно должно быть присвоено при объявлении.

Назначение: предотвратить случайное изменение переменной. Например, для предотвращения случайного изменения имён библиотек и компонентов.

3. Соединение строк

Раньше:

'abc' + переменная + 'ef';
var a = 'xxx';
var str = 'yyy' + a + 'yyyy';
alert(str);

Сейчас:

`abc${переменная}ef`;
var a = 'xxx';
var str = `yy${a}yy`;
alert(str);

Далее: деструктурирующее присваивание. Перевод текста:

Цикл for of

for (var i of arr.entries()) {} // цикл по индексам и значениям for (var i of arr.keys()) {} // только по индексам for (var i of arr.values()) {} // только по значениям, или: for (var i of arr) {}

Однако цикл for of используется не только для перебора, но и в JSON, хотя нельзя перебирать JSON.

Объекты Map (в сочетании с циклом for of):

• похожи на JSON, также представляют собой пары ключ-значение;
• созданы специально для использования с циклом for of.

Определение: var map = new Map(); Установка: map.set('a', 'apple'); Получение: map.get('a') Удаление: map.delete('a').

Пример объекта Map: var map = new Map(); map.set('a', 'apple'); map.set('b', 'apple2'); console.log(map); // Получение alert(map.get('a')); map.delete('b'); // остаётся только a.

Пример цикла Map + (for of): (если использовать for in, эффекта не будет). var map2 = new Map() map.set('a', 'apple'); map.set('b', 'apple2');

Первый способ: for (var name of map) { console.log(name); // есть имя и значение: a, apple, b, apple2 и т. д. } Второй способ: for (var [key, value] of map) { console.log(key, value); // a apple, b apple2. } Обратите внимание: var name of map фактически является var name of map.entries().

Фактически map — это map.entries(): for (var name of map.entries()) { console.log(name); }

Частичный перебор: for (var key of map.keys()) {// только ключи console.log(key); } for (var value of map.values()) { // только значения console.log(value); }

Далее идут стрелочные функции, наследование и объектно-ориентированное программирование.