toha_man

https://pugjs.org/api/reference.html
Подключить pug и вот так должно сработать:

import pug from 'pug';

//...
template: pug.render(`span {{ tr(lang).title }} `)

Но я бы не костылил ))

1) addEventListener в старых IE не работает. Или вы думаете что гугло карты только вчера написали? Даже на закате 2016 года в некоторых проектах, нужно поддерживать старые браузеры.

2) А почему вы считаете что все обязаны использовать jQuery в своих проектах? Если у вас нет привязки к чему либо, используйте тот метод, который будет удобен в данном проекте. Если у вас повсеместно используется jQuery, вешайте события через .on(), если у вас IE от 9 и нет jQuery, то смотрите сами.

Задача гугла сделать так, что бы их карты работали везде, без всяких зависимостей

Да возможно.
1. Делаете ссылку переключатель плитка, список.
2. В ссылку вписываете параметр ?listType=list и ?listType=card
3. На странице с вызовом компонента или внутри комплексного компонента пишите обработку передаваемого параметра
4. Если совпадает присваиваете переменной с именем шаблона значение
5. Если не совпадает, то значение по умолчанию
6. Записываете полученное значение в сессию или куку
7. Перед подключением шаблона проверяет значение в куки или сессии
8. Вставляете переменную с именем шаблона.

Если нужно сделать на Ajax то всё тоже самое просто ссылку заменяете на Ajax запрос на эту же страницу и добавляете перед компонентом

$APPLICATION->RestartBuffer();

И после компонента
die();

Естественно с проверкой по наличию передаваемого параметра.
Далее в результате ajax просто вставляете html в блок с списком

Решение для режима разработчика:

STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)

«Эффективно» в смысле кратко, в одну строку:

const everyNth = (arr, n) => arr.filter((e, i) => i % n === 0);

// применение
everyNth([0, 11, 22, 33, 44, 55, 66, 77], 7) // [0, 77]

«Эффективно» без лишних итераций, старым добрым циклом for():

function everyNth(arr, n) {
  const result = [];
  for (let i=0; i<arr.length; i+=n) result.push(arr[n]);
  return result;
}

Какой быстрее – сделал проверку на jsPerf
Цикл for()быстрее в 7 раз!

Один x - свойство экземпляра, другой - статический геттер:

class Base {
  constructor() {
    this.x = 3;
  }

  static get x() {
    return 1.5;
  }
}

Классом этой штуке быть не обязательно:

function Base() {
  this.x = 3;
}
Base.x = 1.5;

// или

function Base() {}
Base.prototype.x = 3;
Base.x = 1.5;

UPD. Наконец-то появились статические свойства, а свойства экземпляра стало необязательно инициализировать в конструкторе:

class Base {
  x = 3;

  static x = 1.5;
}

Для меня по логике перед loohahead должны быть символы

ну будем считать, что там есть "символ" )
"начало строки" ^
3 "смотрящих вперед": (?=.*\d)(?=.*[a-z])(?=.*[A-Z])
(?=.*\d) - обязательно впереди от начала строки должна быть хотябы 1 цифра, не важно в каком именно месте
т.е. сперва идет .*, где . - любой символ и и квантор * 0 или "много" раз, а потом цифра \d
следующее вперед смотрящее
(?=.*[a-z]) - обязательно 1 маленькая буква латинского алфавита
(?=.*[A-Z]) - обязательно 1 большая буква латинского алфавита

И второй вопрос. Почему этот регэксп работает в случае если меняешь местами такие символы:
abC123, Cab123, 123Cab - то есть порядок прописных строчных и цифр не важен, но ведь группы lookahead идут по порядку

тут "смотрящее вперед" идет просто от начала, порядок не важен
оно больше как проверка наличия того или иного символа

https://regex101.com/r/IcUFYB/1
здесь все смотрящие проверяют наличие (?=.*\d)(?=.*[a-z])(?=.*[A-Z]) после слова пример-
если там есть слово "пример-", то в таком случае вас не будет смущать регулярка? :)

п.с. в свое время очень не мог вникнуть в эти все "смотрящие вперед/назад"
п.п.с очень хорошо с регулярками, кончено, разбираться на готовых примерах, в особенности когда есть такие онлайн-инструменты как https://regex101.com

map/filter:

arr.map((n, i) => n ? i : null).filter(n => n !== null)
// или
arr.map((n, i) => n ? i : NaN).filter(n => n === n)
// или
arr.map((n, i) => !!n && i).filter(Number.isInteger)
// или
arr.map((n, i) => !n || i).filter(n => n !== !0)

reduce:

arr.reduce((acc, n, i) => n ? [ ...acc, i ] : acc, [])
// или
arr.reduce((acc, n, i) => (n && acc.push(i), acc), [])

или, если надо изменить текущий массив, а не создавать новый

for (let i = arr.length; i--;) {
  if (arr[i]) {
    arr[i] = i;
  } else {
    for (let j = i; ++j < arr.length; arr[j - 1] = arr[j]) ;
    arr.pop();
  }
}

// или

arr.reduceRight((_, n, i, a) => n ? a[i] = i : a.splice(i, 1), 0);

// или

arr.splice(0, arr.length, ...любое_выражение_с_map/filter_или_reduce_из_показанных_выше);

// или

arr.length -= arr.reduce((acc, n, i, a) => (
  a[i - acc] = i,
  acc + !n
), 0);