JavaScript: includes vs indexOf

[surefire]

Вариация по теме:

var numbers = [3, 5, 8, 11, 23, 7];

if ( ~numbers.indexOf(1) ) {
    // ...
}

[xenohunter]

За что минусуют? Вполне читаемый вариант. Главное, чтобы в проекте везде использовался один способ.

[justboris]

За то, что это использование оператора не по назначению. Ничем не лучше

if (numbers.indexOf(x) + 1) {
  //...
}

[Keyten]

Кстати, тоже неплохо (имхо).

[justboris]

Писать что угодно, лишь бы не очевидный numbers.indexOf(x) > -1? Такая логика что ли?

[Keyten]

Я о том, что он тоже вполне читаемый, хоть и выглядит странно и непривычно.

Вариант же с ~ мне нравится тем, что он короткий. Если это принято на уровне всего проекта, на уровне кодстайла, и при этом есть оговорка, что ~ используется только с indexOf без вложенности, и не используется в более сложных конструкциях (~arr.indexOf(x) можно, а ~(тут_какое-то_очень_сложное_условие_которое_может_вернуть_-1) — нельзя), то это не должно привести к ухудшению читаемости.

[bjornd]

Не стоит так писать, если это будет кто-то читать.

[AndreyRubankov]

> так как в общем-то indexOf и includes по логике должны иметь одну и ту же вычислительную сложность.

Сложность у них разная будет, как ни крути. Вы же сами выше писали, что indexOf не правильно работает с NaN.

Для исправления этого огреха с NaN необходимо проверять каждый элемент массива на isNaN, при этом нужно будет проверить еще и тип элемента, т.к. isNaN('a') == true.

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

[Methos]

Угу. И судя по результатам, такая проверка у Firefox была (есть) и у indexOf.

[ishashko]

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

[RubaXa]

Надо смотреть код теста, если вы написали что-то типа:

/* Array#indexOf */
array.indexOf(XXX)

/* Array#includes */
array.includes(XXX)

То может смело выкинуть результаты.

[AndreyRubankov]

Спасибо за ссылки! Жаль вторая не работает, но первая ответила на вопрос, который меня давно интересовал, про то, как сравниваются строки.

[AndreyRubankov]

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

[AndreyRubankov]

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

[RubaXa]

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

Например, можно написать вот такой тест:
http://jsbench.github.io/#0c02e5ebe25ee0374e3736f3289e922a

Array#includes — WIN!

Или такой (вначале, середине и не найден):
http://jsbench.github.io/#bc19a03c9aeea1dc1f44731396c05396

Ну, можно сказать, что Array#indexOf иногда выигрывает, но в пределах нормы

Так что используйте Array#includes, мифический выигрыш не стоит ухудшения читаемости.

[ishashko]

В принципе согласен. Я когда делал тесты, то тоже был уверен, что это не прям отличный показатель производительности. Но я запускал тесты несколько раз и смотрел на общую картину. Тоже считаю, что includes() более правильный метод, если речь идет именно о том содержится ли элемент в массиве. Единственное «но» здесь как обычно — это, то что не во всех браузерах работает. Хотя на сайте ECMAScript предлагается решение этой проблемы

[Zenitchik]

Ухудшения читаемости не происходит. "Программисты", не знакомые с побитовыми операциями мне не друзья.

[RubaXa]

Ясно, понятно.

[mayorovp]

"Знаком с побитовыми операциями" !== "умеет читать побитовые операции быстро".

[RubaXa]

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

[mayorovp]

Затем и минусую, чтобы был стимул доносить свою мысль выразительнее.

[gagoman]

Вижу бенчмарки в JS, вспоминаю mraleph: https://www.youtube.com/watch?v=HPFARivHJRY
Вижу бенчмарки в Java, вспоминаю @shipilev

[k_sharonov]

Я думаю стоило бы добавить, что Microsoft Edge поддерживает работу includes для массивов и строк, а то IE уже менее актуален в этом плане.
https://developer.microsoft.com/en-us/microsoft-edge/platform/status/arrayprototypeincludeses2016/?q=includes

[iShatokhin]

В таблице есть IE, но нет EDGE. Тогда можно в строке с IE указать «14.14279» (массивы) и «14.14393» (строки).