Блог компании RUVDS.com
JavaScript
Разработка веб-сайтов
Комментарии 42
0
а в чем разница между
(function () {
  console.log('Normal IIFE called')
})()
и
(function () {
  console.log('Not normal IIFE called')
}())
0

Так то, можно даже так


!function () {
  console.log('Normal IIFE called')
}();
+function () {
  console.log('Normal IIFE called')
}();
~function () {
  console.log('Normal IIFE called')
}();

Главное, чтобы JS понял, что это выражение а не конструкция. Для этого и применяются скобки, операторы. Например вот это блок/конструкция
{}
а вот это уже будет объект
({})

+2
Двойной восклицательный знак

Он редко когда может пригодится в JS, т.к. в условиях и так идет преобразование в булевой тип. Возможно, только когда нужно явно передать булевое значение, например в JSON, или в переменную is*. Но странно, что вы его засунули в статью малоизвестных возможностей.


Побитовые операторы нужно использовать по предназначению. Такие вот штуки


if (~username.indexOf("Drake")) {
  console.log('Access denied')
}

очень сильно усложняют код. Это неявно, а неявное — плохо.


Оператор «запятая»

Тоже забудьте в продакшине. Неопытных разработчик не сразу скажет, чему тут будет равно а


var a = (10 * 3, 
         20 * 4, 
         10 * 2)

Неявная штукенция, в 99% случаев подходит лишь, когда стоит цель, написать минимум символов. Все равно минификатором все будет сжато.


Все эти штуки из статьи, описываются почти в любом учебнике по JS. Думал будет что-то реально малоизвестное. Вы же вроде хотели доперевести You Dont Know JS, там реально полезный материал.

0
Тоже забудьте в продакшине.

В трансдьюсерах это позволяет обойтись без; и return

Неопытных разработчик не сразу скажет, чему тут будет равно а

Вы так думаете? Мне казалось, что семантика запятой достаточно проста.
0
> очень сильно усложняют код. Это неявно, а неявное — плохо.

Не согласен. Конструкция ~array.indexOf(x) // array.includes(x) легко запоминается и потом читается лучше чем != -1. Или там > -1? или >= 0?
+2
Когда-то сам стал причиной повсеместного использования ~array.indexOf(x) во многих проектах компании. Но это такая себе практика, так как это не каждый js-разработчик то поймет на-лету, не то что проходящий мимо джавист или питонист. Сейчас убежден, что корпоративный код должен быть максимально понятен любому разработчику без разницы на каком языке. И если язык предоставляет готовый метод у массива/коллекции (Array.prototype.includes, не IE) или имеет широко-распространенную либу (lodash), то не надо использовать бинарные операции и прочие хаки не по назначению. Читаемость кода достигается не запоминанием каких-то специфичных конструкций, а декларативностью и явным поведением.
0
Если питонист заглянет в мой код, предпочитаю, чтобы он знал JS, а то когда я отпуске, питонисты и джависты всякую хрень пишут. Лучше пусть ничего не поймёт и свалит в ужасе, если ему не дано, даже если думает, что ему дано.

PS. На самом деле не хрень, но обычно люди не считывают практики из соседних участков кода, а пытаются делать как их учили (или как считают правильным). Оно работает, но артефактно для проекта и часто приходится голову ломать как же такое зарефакторить, чтобы не переделывать с нуля. Так что пусть читают, что написано у меня и включают мозг.
0
Если питонист заглянет в мой код, предпочитаю, чтобы он знал JS, а то когда я отпуске, питонисты и джависты всякую хрень пишут

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

0
Если человек хорошо читает код, то он реально легко загуглит простые идиомы.

Кроме того, я всегда подробно обсуждаю интерфейсы и возможные кейсы использования с бэкерами (равно как, будучи бэком, обсуждал интерфейсы с фронтами). Но согласен, что может быть код, от которого не осталось разработчиков. И тогда его придётся читать (но не боже мой мне указывать какие идиомы (не)использовать коллегам, да и спросить я не постесняюсь, если не нагуглю).

Впрочем, примерно на эту тему у меня две статьи для хабра в работе. Там можно будет и поспорить в комментариях) Ближайшей надо примерно 8-10 поездок на метро, когда удаётся сесть)
0
1.!! — стандартная конструкция. Если у меня есть большая структура, то я хочу видеть в console.log или при трассировке именно true/false, а не 42 или Object{....}. Сразу понятно, что тут bool. Использую не то чтобы часто, но если:
this.is_found = _.find(list, {id})

то лучше запись

this.is_found = !!_.find(list, {id})


она страшноватая, но не засоряет структуру

2. Обожаю ~. Первый раз когда увидел его прифигел, когда прочитал по нему доку, прифегел второй раз: «оказывается вот так можно!». На порядок лучше, чем
a.indexOf(...) >= 0

Просто потому, что можно забыть поставить = и потом долго «хохотать» при поиске ошибки. Если ко мне придёт падаван с вопросом, а что это ~ в коде, то я буду сильно разочарован в человеке не способном воспользоваться один раз гуглом.

3. Не использовал, потому что не знал. Теперь знаю, но в продакшене использовать не планирую, но ребята выше говорят, что это вполне юзабельно в определённом контексте. Вне контекста хороший способ выстрелить в ногу, тут согласен.

В девелопе пригодится, буду юзать для отладки стрелок, оно поизящнее того изврата, что использую обычно:

list.filter(x => console.log(x) || <condition>) // это изврат, да?
list.filter(x => console.log(x) , <condition>)   // а так прикольнее
list.filter(x => x.id === 42 && console.log(x) , <condition>) // а тут можно и условие замутить и даже тернарник


0
Ох! Ё! Точно)

Моё извращение остаётся жить, оборачивать второй скобкой «слишком дорого» с учётом, что её потом убирать
0

По первому, я так и написал


или в переменную is*

Под is* имелся ввиду шаблон названия гетера, например isActive, isFound и.т.д.

0
Я бы просто перенёс это исключение в стандартную практику. Я не большой фанат лишних символов, но!! надо понимать когда использовать и как.

Хотя возможно вы ближе к реакту, где меньше «предварительной магии», чем в ангуляре.
0
Про with был хороший доклад на последнем Московском HolyJS: тыц. Как только орги опубликуют видео обязательно посмотрите.

Если я ничего не путаю суть в том, что необходимо было исполнять функции из некоего набора API и не дать вызвать какие-то другие методы из цепочки прототипов, то есть сделать песочницу. Так вот докладчик использовал для этого связку with + Proxy и это магическим образом и парой костылей (вернее сказать затычек) превратилось в абсолютно изолированную среду. Магия, не иначе!
0

Интересно. Я пару дней назад тоже экспериментировал с with + Proxy. Проблема в том, что with не дёргает обработчик свойств у прокси. Интересно как у докладчика получилось.

+1

Очень даже дергает. Главное — не забывать про то, что, в соответствии с пунктом 8.1.2.1 спецификации, сначала дергается has, а потом уже все остальное.

0

А ведь точно. Я совсем про has забыл, без него ReferenceError вываливается.


const console = global.console;

const sandbox = new Proxy({}, {
  has() {
    return true;
  },

  get(target, prop) {
    console.log('global.%s was called', prop);

    if (prop === 'console') {
      return console;
    }

    return prop;
  }
});

with(sandbox) {
  console.log(hello)
}
+1
Жаль только в строгом режиме все вкусности arguments выпилили (callee, caller). Хотя в конструкторе функций callee еще работает.

'use strict';   
Function`console.log(arguments.callee)```;
0
Ну, если верить старым статьям, то когда-то очень давно аргументы были доступны как свойства arguments не только по номерам, но и по именам (если они были). Кроме того, членами arguments становились локальные переменные функции.
0
Эх… старый-добрый свободный js, это не какой-то TypeScript — тюрьма народов, где все затипизировано и шаг право, шаг влево — расстрел )))
-3

Вместо callee можно использовать this.name, например. Конечно, this должно быть равно функции в этом случае.

-1
ну чето совсем не так, у меня ccылается на window.

'use strict';
(new Function('console.log(this)'))();

-1

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


const f = new Function('console.log(this.name)')
f.call(f) // anonymous

const AAA = function () {console.log(this.name)}
AAA.call(AAA) // AAA

Конечно, this должно быть равно функции в этом случае.

Именно это подразумевало.

0
А мне простым языком программирования для новичков, показался python. JS знаю лучше чем питон, но недавно нужно было написать простенький скрипт пингующий сервер и отправляющий в телеграмм сообщение если сервер не пингуется, я попытался все это реализовать с помощью nodejs и socket.io, но в итоге плюнул и буквально за полчаса все сделал на питоне и уложился в 20 строчек. Хотя питон почти не знаю, чуть чуть основы.
+1

with давно устарел и не рекомендуется к использованию.
void 0 используется по сей день в большей части в минификаторах, так как занимает меньше места.
про + тема не раскрыта. Магия не в том, что + способен "даже moment.js превращать в число", а в том, что он использует valueOf метод, который можно переопределить (ну и делает конверсию, конечно).

0
Никогда не понимал, в чём смысл писать «магию» вроде !!x если можно по-человечески написать Boolean(x). Символы на вес золота что-ли?
+1
Символы, допустим, нет — но вот зачем, например, делать при ограничении на длину строки многоэтажный if на ровном месте, если в этом нет особой нужды? Один-два символа могут стоить многих слов, молодёжь с эмодзи не даст соврать ;-)
-1
тогда !Boolean(x) не очень смотрится. И почему сразу магия? Простое поведение, унарный оператор возвращает значение и передает второму такому же оператору. В javascript можно и !!!!!!!!x написать.
+2
Сложно назвать эти особенности языка малоизвестными. Они описываются в любом более-менее толковом учебнике по JS, например, у Флэнэгана или Закаса. Скорее тут речь идет о малоиспользуемых возможностях, что неудивительно, посколько многое из перечисленного признано устаревшим подходом или плохой практикой.
0
Статья — просто выжимка из learn.javascript.ru, где это все описано достаточно доходчиво и последовательно. В чем минус статьи и ей подобных: уровень подачи материала скатывается до нескольких тезисов, в итоге статья становится одной из многих, после которых надо все-таки идти на тот же learn.javascript и заполнять пробелы в знаниях. Говорю по опыту, как человек, изучавший js с нуля (преимущественно сам), преподававший этот язык и как js девелопер.
0
к чему это я. Для людей, кто изучает предмет систематично — перечисленное не станет малоизвестным, а вот те, кто изучает js по отрывкам (например, начал изучать js аж с реакта, с какой-нибудь статьи «реакт за 10 мин для домохозяек» или со статьи выше) — для них любое ключевое слово js (прототипы,ajax, промисы, стрелочные функции и т д до бесконечности) — любое будет чем-то малоизвестным.
Только полноправные пользователи могут оставлять комментарии. , пожалуйста.