Как элегантно улучшить цикл for в программе

Как мы все знаем, в нашем повседневном кодировании для некоторой итерации и обхода данных первое, что приходит на ум, этоfor循环

Все в порядке,for循环Синтаксис записи очень прост, вам нужно знать только длину списка данных для обхода значения, например:

Детская обувь с небольшой базой программирования может быстро придумать описанный выше метод письма. Я не знаю, все ли будут такими, как я.При написании цикла for функция хороша, но она всегда будет чувствовать себя очень неэлегантно при написании, например, необходимо определить соответствующийi变量（拿上述举例）以及还要自主控制i变量的变化, это, несомненно, станет громоздким, а также сделает нас менее эффективными при написании кода.

Итак, у нас есть какой-нибудь элегантный способ справиться с описанным выше случаем? Ответ положительный, что возвращает нас к теме этой статьи:如何优雅地改善for循环？

ForEach

Я верю, что дети, которые изучили ES6, скоро придумают этот метод.Теперь я буду использовать приведенный выше пример, чтобы преобразовать его:

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

сюда,ForEach是不是就是最好的优雅方案？有没有存在问题？, я считаю, что какая-то детская обувь может не ответить, тогда я не буду ее продавать. Если мы столкнемся с ситуацией, когда нам нужно вернуть обработанный массив после обхода списка, можем ли мы продолжать использовать forEach для достижения нашей цели? Мы можем сделать следующее:

Видно, что первая обработка заключается в непосредственном присвоении ее переменной после обработки, ноforEach循环返回的是undefined, хотя вторая обработка может наконец достичь нашей цели и получить обработанные данные, она приводит к проблеме--全局变量的污染. Конечно, также можно установить внешний массив, а затем передать обработанные данные в новый массив для достижения нашей цели, но общий вид все равно не очень элегантный.

Есть ли способ вернуть новый массив, не затрагивая исходные данные? Ответ положительный, а это значит, что мощныйФункциональное программирование (сокращенно FP)

Functional Programing

Что такое ФП? Для чего его используют?

Functional programmings(FP) means coding in functions

Это более краткое и официальное заявление, что это значит? Проще говоря, то есть用函数的方式处理问题, сегодня будет использована одна из его основных идей:纯函数（对于相同的输入，永远得到相同的输出，而且不会有任何的副作用）

Увидеть здесь - это еще не ключ к разгадке 😄. Хорошо, вернемся к теме, какие методы являются чистыми функциями в js и могут элегантно заменить циклы for? Я верю, что детская обувь будет думать об этомmap()

Map()

MapМетод выполняет итерацию по каждому элементу исходного массива один раз, вызывает обратный вызов и, наконец, возвращает новый массив, не затрагивая исходный массив.

Давайте возьмем приведенные выше каштаны, у которых есть проблемы с forEach, и преобразуем их:

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

Filter()

FilterПроще говоря, метод состоит в том, чтобы отфильтровать или отфильтровать массив, а затем вернуть новый массив, который не окажет никакого влияния на исходный массив.

Увидев это, мы должны вернуться к каштану цикла for и использоватьFilter方法Можно ли сделать код элегантным? Возьмите его в руки прямо сейчас:

Очевидно, использоватьFilter方法Только первый шаг к достижению цели — быть элегантнымfor循环условное выражение, что мне делать?

мы найдем,Filter方法вернет новый массив, тогда мы сможем подключитьсяMap方法, какую искру даст их сочетание?

На данный момент, будет ли это выглядеть намного удобнее и понятнее, и это окончательное элегантное решение. Итак, вопрос в том, когда использовать forEach и когда использовать карту?

forEach比较适用于不改变原始数组数据，仅仅拿数组数据进行做一些事情，而map则适用于改变数据值并且返回一个新数组, конечно, в разных сценариях разные практики, это просто для справки

Extension

В дополнение к обычным сценариям, упомянутым выше, мы также столкнемся со многими другими местами, где элегантные циклы for могут продолжаться, что необходимо упомянуть.some方法和every方法以及reduce方法（reduce也属于FP）

1. Каждый() и Некоторые()

   Теперь возникает ситуация, когда подсказка должна отображаться, когда стоимость в списке, возвращаемом бэкендом, меньше 0. Комбинируя методы, которые мы изучили выше, мы можем иметь следующие практики:

   

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

   

   Поскольку forEach обрабатывает данные обратного вызова, поэтому используйтеbreak语法Очевидно, это вызовет синтаксическую ошибку, поэтому даже если вы удалитеbreak, вам также нужно пройти через все элементы, и главный герой приходит, некоторые и каждый:

   • некоторые: пройтись по элементам массива, пока условие истинно, вернуть true напрямую, в противном случае до конца обхода и вернуть false

   • каждый: пройти по элементам массива, пока условие ложно, вернуть false напрямую, в противном случае до конца обхода и вернуть истину

   

   Очевидно, глядя на количество кода, он намного лаконичнее и элегантнее 😆.

2. reduce()

   Некоторая детская обувь может бытьreduce方法Немного странно, для чего он используется? Каков сценарий применения?

   Метод reduce() принимает функцию как аккумулятор, и каждое значение в массиве (слева направо) сводится к одному значению.

   Вышеизложенное является официальным заявлением.Просто понимается, что нужно пройти по списку, взять два элемента для обработки в первый раз, чтобы получить новое значение, а затем взять новое значение и третий элемент для обработки в следующем цикле , И так далее, наконец получить значение и вернуть. Текст слишком сложный, поэтому прямая иллюстрация:

   

   Стало намного понятнее, и какие шикарные сценарии применения? Я не буду продавать это здесь, например, бэкенд возвращает объект, и нам нужно только получить указанное значение атрибута для обработки этого объекта, а лишние атрибуты будут отфильтрованы. Ежедневная практика:

   

   Видно, что двухслойная петля выглядит действительно сложной, и легко вызвать проблемы, если вы не будете осторожны. Однако используйтеreduce方法быть элегантным

   

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

   Если вы думаете, что он недостаточно силен, посмотрите на следующий каштан, вы можете почувствовать его силу.（这是额外话题了，大家有空可以研究一下）. Мы часто сталкиваемся с ситуацией, когда серверная часть возвращает глубоко вложенный объект, а затем, когда передняя часть получает свойство в этом сложном объекте, неизбежно, что каждое значение должно быть оценено, существует ли оно, и затем, пока не будут заданы свойства, это является链式取值вопрос:

   

   фактически链式取值В Интернете есть много решений проблемы, если это самое элегантное решение, я думаю, что это использоватьreduce方法, то как написать это с помощью сокращения? прямо над

   

   Пока что для элегантности цикла for может быть много элегантных решений в разных сценариях, но я хочу сказать, что API, предоставляемый самим нативным js, имеет много способов сделать нашу программу удобной и лаконичной, только вам чем больше вы его используете, тем мощнее он будет.哈哈，如果上文如果有不妥之处，欢迎各位大佬指点一下👻

Last

Наконец, прочитав вышеизложенное, я считаю, что у каждого есть определенное понимание цикла for.（我猜的）, а затем закончите общим вопросом интервью, чтобы дать всем возможность вернуться и подумать о том, какой метод лучше:

实现一个方法，计算出一个字符串中每个字符出现的次数？

Способ писать не буду, пусть у всех будет мозговой штурм 🙈