Javascript урок 3. основные операторы языка javascript и конструкции

Flowchart of while Loop

Flowchart of JavaScript while loop

Example 1: Display Numbers from 1 to 5

Output

1
2
3
4
5

Here is how this program works.

Iteration Variable Condition: i <= n Action
1st 1 is printed. i is increased to 2.
2nd 2 is printed. i is increased to 3.
3rd 3 is printed. i is increased to 4.
4th 4 is printed. i is increased to 5.
5th 5 is printed. i is increased to 6.
6th The loop is terminated

Example 2: Sum of Positive Numbers Only

Output

Enter a number: 2
Enter a number: 5
Enter a number: 7
Enter a number: 0
Enter a number: -3
The sum is 14.

In the above program, the user is prompted to enter a number.

Here, is used because takes input from the user as a string. And when numeric strings are added, it behaves as a string. For example, . So converts a numeric string to number.

The loop continues until the user enters a negative number. During each iteration, the number entered by the user is added to the variable.

When the user enters a negative number, the loop terminates. Finally, the total sum is displayed.

Как сделать Object и простые объекты итерируемыми

Простые объекты не являются итерируемыми, как и объекты из .

Однако этот момент можно обойти, добавив @@iterator к Object.prototype с пользовательским итератором.

Переменная  содержит свойства объекта, полученного с помощью вызова . В функции next возвращается каждое значение из переменной properties и обновляется count, чтобы получить следующее значение из переменной properties, используя переменную count в качестве индекса. Когда count будет равен длине properties, устанавливаем значение true, чтобы остановить итерацию.

Тестирование с помощью Object:

Работает!!!

С простыми объектами:

Та-дам!! 

Стоить добавить этот способ в качестве полифилла, чтобы использовать for..of с любыми объектами в приложении.

Использование for…of с классами ES6

Можно использовать for..of для итерации по списку данных в экземпляре класса.

Класс Profiles обладает свойством , которое содержит массив пользователей. Возможно, потребуется отобразить эти данные в приложении с помощью for…of. Пробуем:

Очевидно, for…of не сработает

Вот несколько правил, чтобы сделать  итерируемым:

  • Объект должен иметь свойство .
  • Функция  должна возвращать итератор.
  •  должен реализовывать функцию .

Свойство @@iterator определяется с помощью константы .

Запускаем:

Свойство profiles отображено.

Изучение цикла событий

Это может показаться странным, но до ES6 JavaScript, несмотря на то, что он позволял выполнять асинхронные вызовы (вроде вышеописанного ), не содержал встроенных механизмов асинхронного программирования. JS-движки занимались только однопоточным выполнением неких фрагментов кода, по одному за раз.

Итак, кто сообщает JS-движку о том, что он должен исполнить некий фрагмент программы? В реальности движок не работает в изоляции — его собственный код выполняется внутри некоего окружения, которым, для большинства разработчиков, является либо браузер, либо Node.js. На самом деле, в наши дни существуют JS-движки для самых разных видов устройств — от роботов до умных лампочек. Каждое подобное устройство представляет собственный вариант окружения для JS-движка.

Общей характеристикой всех подобных сред является встроенный механизм, который называется циклом событий (event loop). Он поддерживает выполнение фрагментов программы, вызывая для этого JS-движок.

Это означает, что движок можно считать средой выполнения любого JS-кода, вызываемой по требованию. А планированием событий (то есть — сеансов выполнения JS-кода) занимаются механизмы окружения, внешние по отношению к движку.

Итак, например, когда ваша программа выполняет Ajax-запрос для загрузки каких-то данных с сервера, вы пишете команду для записи этих данных в переменную внутри коллбэка, и JS-движок сообщает окружению: «Послушай, я собираюсь приостановить выполнение программы, но когда ты закончишь выполнять этот сетевой запрос и получишь какие-то данные, пожалуйста, вызови этот коллбэк».

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

Если вы разрабатываете под Node.js, то подобные API реализованы средствами С++.

Итак, что же такое цикл событий?

Цикл событий решает одну основную задачу: наблюдает за стеком вызовов и очередью коллбэков (callback queue). Если стек вызовов пуст, цикл берёт первое событие из очереди и помещает его в стек, что приводит к запуску этого события на выполнение.

Подобная итерация называется тиком (tick) цикла событий. Каждое событие — это просто коллбэк.

Рассмотрим следующий пример:

Займёмся пошаговым «выполнением» этого кода и посмотрим, что при этом происходит в системе.

1. Пока ничего не происходит. Консоль браузера чиста, стек вызовов пуст.


2. Команда добавляется в стек вызовов.


3. Команда выполняется.


4. Команда удаляется из стека вызовов.


5. Команда добавляется в стек вызовов.


6. Команда выполняется. Браузер создаёт таймер, являющийся частью Web API. Он будет выполнять обратный отсчёт времени.


7. Команда завершила работу и удаляется из стека вызовов.


8. Команда добавляется в стек вызовов.


9. Команда выполняется.


10. Команда удаляется из стека вызовов.


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


12. Цикл событий берёт c функцию из очереди коллбэков и помещает её в стек вызовов.


13. Функция выполняется и добавляет в стек вызовов.


14. Команда выполняется.


15. Команда удаляется из стека вызовов.


16. Функция удаляется из стека вызовов.


Вот, для закрепления, то же самое в анимированном виде.


Интересно заметить, что спецификация ES6 определяет то, как должен работать цикл событий, а именно, указывает на то, что технически он находится в пределах ответственности JS-движка, который начинает играть более важную роль в экосистеме JS. Основная причина подобного заключается в том, что в ES6 появились промисы и им требуется надёжный механизм планирования операций в очереди цикла событий.

Вызов конструктора

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

Когда функция вызывается таким образом, функция возвращает новый объект (даже если у него нет оператора return), и значение this внутри функции будет указывать на этот вновь созданный объект.

Объяснение немного упрощено (подробнее тут в MDN).

function MyConstructorFunction() {
  this.a = 1;
}

const myObject = new MyConstructorFunction(); // a new object is created

// inside MyConstructorFunction(), "this" points to the newly created onject,
// so it should have a property  "a".
myObject.a; // 1

Примечание. То же самое относится и к использованию ключевого слова new в классе, поскольку class на самом деле являются синтаксический сахар.

Примечание. Стрелочные функции нельзя использовать в качестве конструктора.

Цикл for

Цикл for представляет собой конструкцию цикла, которая часто оказывается более удобной, чем цикл while. Цикл for упрощает конструирование циклов, следующих шаблону, общему для большинства циклов. Большинство циклов имеют некоторую переменную-счетчик. Эта переменная инициализируется перед началом цикла и проверяется перед каждой итерацией. Наконец, переменная-счетчик инкрементируется или изменяется каким-либо другим образом в конце тела цикла, непосредственно перед повторной проверкой переменной. Инициализация, проверка и обновление — это три ключевых операции, выполняемых с переменной цикла. Инструкция for делает эти три шага явной частью синтаксиса цикла:

for(инициализация; проверка; инкремент)
{
    инструкция
}

Инициализация, проверка и инкремент — это три выражения (разделенных точкой с запятой), которые ответственны за инициализацию, проверку и увеличение переменной цикла. Расположение их в первой строке цикла упрощает понимание того, что делает цикл for, и не позволяет забыть инициализировать или увеличить переменную цикла.

Проще всего объяснить работу цикла for, показав эквивалентный ему цикл while:

инициализация; 

while(проверка) 
{ 
    инструкция;
    инкремент;
}

Другими словами, выражение инициализации вычисляется один раз перед началом цикла. Это выражение, как правило, является выражением с побочными эффектами (обычно присваиванием). В JavaScript также допускается, чтобы выражение инициализации было инструкцией объявления переменной var, поэтому можно одновременно объявить и инициализировать счетчик цикла.

Выражение проверки вычисляется перед каждой итерацией и определяет, будет ли выполняться тело цикла. Если результатом проверки является истинное значение, выполняется инструкция, являющаяся телом цикла. В конце цикла вычисляется выражение инкремент. Чтобы использование этого выражения имело смысл, оно должно быть выражением с побочными эффектами. Обычно это либо выражение присваивания, либо выражение, использующее оператор ++ или —.

Вывести числа от 0 до 9 можно также с помощью цикла for, как показано ниже, в противовес эквивалентному циклу while, показанному в примере ранее:

Конечно, циклы могут быть значительно более сложными, чем в этих простых примерах, и иногда в каждой итерации цикла изменяется несколько переменных. Эта ситуация — единственный случай в JavaScript, когда часто применяется оператор «запятая» — он позволяет объединить несколько выражений инициализации и инкрементирования в одно выражение, подходящее для использования в цикле for:

Переход к следующей итерации: continue

Директива continue – «облегчённая версия» break . При её выполнении цикл не прерывается, а переходит к следующей итерации (если условие все ещё равно true ).

Её используют, если понятно, что на текущем повторе цикла делать больше нечего.

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

Для чётных значений i , директива continue прекращает выполнение тела цикла и передаёт управление на следующую итерацию for (со следующим числом). Таким образом alert вызывается только для нечётных значений.

Цикл, который обрабатывает только нечётные значения, мог бы выглядеть так:

С технической точки зрения он полностью идентичен. Действительно, вместо continue можно просто завернуть действия в блок if .

Однако мы получили дополнительный уровень вложенности фигурных скобок. Если код внутри if более длинный, то это ухудшает читаемость, в отличие от варианта с continue .

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

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

…и перепишем его, используя вопросительный знак:

…то будет синтаксическая ошибка.

Это ещё один повод не использовать оператор вопросительного знака ? вместо if .

JavaScript выход из цикла:

Последнее что мы разберём, это выход из цикла или начала новой итерации, делать это будем благодаря директиве continue и break.

Continue в JS:

Continue по сути возвращает работу цикла в самое начала, и запускает новую итерацию, вот пример.

JavaScript

1
2
3
4
5
6
7
8
9

// Пишем цикл for

for(leti=;i<10;i++){

// Условие при котором будем возвращаться в начало

if(i==2){

// возвращаемся в начало

continue;

}

console.log(i);// Выводим в консоль переменную i

}

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

Как видите у нас нет двойки, это всё потому что мы написали, что когда i равна 2, то вернутся в начала цикла и при этом эта проверка идёт до вывода переменной.

Break в JS:

Break похож на continue, но выходит в конец цикла, вот не большой код.

JavaScript

1
2
3
4
5
6
7
8
9

// Пишем цикл for

for(leti=;i<10;i++){

// Условие при котором будем возвращаться в конец

if(i==2){

// возвращаемся в конец

break;

}

console.log(i);// Выводим в консоль переменную i

}

Тут всё точно также, но теперь не continue, а break, вот результат.

Как видите, теперь вывелось только два числа, двойка и всё что после двойки нет, потому что мы вышли из цикла, когда переменная i стала равна двум.

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

Асинхронный Итератор

В ECMAScript 2018 была введена новая конструкция, способная циклически повторять массив промисов. Эта новая конструкция выглядит как , а новый символ — .

Функция  в итерируемых объектах возвращает итератор, который возвращает промис.

Разница между  и заключается в том, что первый возвращает , а второй возвращает , который устанавливает .

Объект f будет выглядеть так:

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

Чтобы выполнить итерацию через , используем новую конструкцию , вместо :

С помощью  можно также совершить цикл через массив промисов:

Цикл while

Синтаксис цикла while следующий:

Сначала объявляем переменную i, которая является счётчиком и внутри цикла мы этот счётчик инкрементируем. Внутри круглых скобок пишем условие входа/выхода из цикла.

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

Для примера выведем строку ‘Всем привет!’ 10 раз.

var i = 0;
while(i ');
    i++;
}

Переменная i, может начаться как с 0 так и с 1 или с другого любого числа.

Условие выхода является в тоже время и условием входа. Цикл работает следующим образом: Сначала проверяется если переменная i, меньше 10, и если условие истина, то мы входим в цикл, иначе, нет. В данном случае если переменная i будет равна 30, например, то цикл не выполнится, потому что 30 не меньше 10.

Зашли цикл, вывели строчку ‘Всем привет’, инкрементировали счётчик и опять переходим к условию, где опять проверяем если значение переменной i, меньше 10, то мы входим в цикл, иначе выходим из него. И так происходит до того момента когда условие входа станет лож, то есть значение переменной i будет 10. 10 не меньше 10, поэтому мы уже не входим в цикл, а идём дальше.

Замечание! Не забудьте инкрементировать счётчик (i++), иначе опять же получится бесконечный цикл.

С циклом while разобрались, теперь перейдём к циклу do-while.

More Examples

Example

Loop through the indices of an array to collect the car names from the cars
array:

var cars = ;var text = «»;var i;for (i = 0; i < cars.length; i++) {  text += cars + «<br>»;
}

Example above explained:

  • First, we set a variable before the loop starts (var i = 0;)
  • Then, we define the condition for the loop to run. As long as the variable is less than the length of the array (which is 4), the loop will continue
  • Each time the loop executes, the variable is incremented by one (i++)
  • Once the variable is no longer less than 4 (array’s length), the condition is false, and the loop will end

Example

Initiate multiple values in the first parameter:

var cars = ;var i;for (i = 0, len = cars.length, text = «»; i < len; i++) {   text += cars + «<br>»;
}

Example

Omit the first parameter (set values before the loop starts):

var cars = ;var i = 2;var len = cars.length;var text = «»;for (; i < len; i++) {
  text += cars + «<br>»;
}

Example

Using the continue statement — Loop through a block of code, but skip the value of «3»:

var text = «»;var i;for (i = 0; i < 5; i++) {  if (i == 3) {    continue;
  }  text += «The number is » + i + «<br>»;}

Example

Using the break statement — Loop through a block of code, but exit the loop when the variable i is equal
to «3»:

var text = «»;var i;for (i = 0; i < 5; i++) {  if (i == 3) {
    break;  }  text += «The number is » + i + «<br>»;}

Example

Omit the second parameter. In this example, we also use the break statement to exit the loop when i is equal to «3» (if the second parameter is omitted, you must provide a break
inside the loop. Otherwise the loop will never end, and your browser will crash):

var cars = ;var text = «»;
var i;for (i = 0; ; i++) {  if (i == 3) {    break;
  }  text += cars + «<br>»;}

Example

Loop through the indices of an array, in descending order (negative
increment):

var cars = ;var text = «»;var i;
for (i = cars.length — 1; i >= 0; i—) {  text += cars + «<br>»;
}

Example

Omit the last parameter, and increment the values inside the loop:

var cars = ;var i = 0;var len = cars.length;for (; i < len;) {   text += cars + «<br>»;
 
i++;}

Example

Loop through the nodes of a NodeList object and change the background color of all <p> elements in the list:

var myNodelist = document.getElementsByTagName(«P»);var i;for (i = 0; i < myNodelist.length; i++) {  myNodelist.style.backgroundColor = «red»;}

Example

An example of a nested loop (a loop inside a loop):

var text = «»;var i, j;for (i = 0; i < 3; i++) {  text += «<br>» + «i = » + i + «, j = «;
  for (j = 10; j < 15; j++) {    document.getElementById(«demo»).innerHTML = text += j + » «;
  }}

Ограничения промисов и race’ы

Ещё одной не очень изученной темой является выставление ограничений для контроля общего количества выполняемых задач параллельно с . Если вы заядлый пользователь coalan/async, то скорее всего уже использовали  или , но не пугайтесь, установка ограничений возможна. Сейчас мы вернёмся к нашей магии промисов и начнём гонку (от )!

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

Подробно про промисы можно прочитатть в этой статье — Промисы для чайников

1.Простой race

Простой race можно создать, передав список промисов, который в нашем случае, вернёт асинхронную функцию, которая решится за произвольное количество времени:

Первый решенный промис и победит в гонке, став результатом выведенным в консоль.

2. Выставляем ограничения

Мы можем использовать почти всё, что мы обсудили выше, для создания функции, которая выполняет другую асинхронную функцию параллельно с заданным лимитом. Реальным примером тут будет процесс создания списка скриншотов страниц, но только 5 за раз.

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

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

Далее, мы используем  как часть нашего арсенала по контролю потока. Что нам нужно, так это способ остановить итерирование цикла (в этом случае ) до момента, пока следующий промис будет решён (мы будем использовать race для этого) и проверить то каково количество запущенных промисов и не превышает ли оно нужный нам лимит, если да, то мы применим ещё один race. Это довольно легко сделать при помощи следующего  цикла:

Объединив оба, мы сможем закончить с :

Что такое JavaScript?

Изначально JavaScript был создан, чтобы «сделать веб-страницы живыми».

Программы на этом языке называются скриптами. Они могут встраиваться в HTML и выполняться автоматически при загрузке веб-страницы.

Скрипты распространяются и выполняются, как простой текст. Им не нужна специальная подготовка или компиляция для запуска.

Это отличает JavaScript от другого языка – Java.

Почему JavaScript?

Когда JavaScript создавался, у него было другое имя – «LiveScript». Однако, язык Java был очень популярен в то время, и было решено, что позиционирование JavaScript как «младшего брата» Java будет полезно.

Со временем JavaScript стал полностью независимым языком со своей собственной спецификацией, называющейся ECMAScript, и сейчас не имеет никакого отношения к Java.

Сегодня JavaScript может выполняться не только в браузере, но и на сервере или на любом другом устройстве, которое имеет специальную программу, называющуюся «движком» JavaScript.

У браузера есть собственный движок, который иногда называют «виртуальная машина JavaScript».

Разные движки имеют разные «кодовые имена». Например:

  • V8 – в Chrome и Opera.
  • SpiderMonkey – в Firefox.
  • …Ещё есть «Trident» и «Chakra» для разных версий IE, «ChakraCore» для Microsoft Edge, «Nitro» и «SquirrelFish» для Safari и т.д.

Эти названия полезно знать, так как они часто используются в статьях для разработчиков. Мы тоже будем их использовать. Например, если «функциональность X поддерживается V8», тогда «Х», скорее всего, работает в Chrome и Opera.

Как работают движки?

Движки сложны. Но основы понять легко.

  1. Движок (встроенный, если это браузер) читает («парсит») текст скрипта.
  2. Затем он преобразует («компилирует») скрипт в машинный язык.
  3. После этого машинный код запускается и работает достаточно быстро.

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

whileПетля иНовый синтаксис ES6 + для каждого、mapс участиемfor of, Быстрее будет?

Не многословный, практика — единственный критерий проверки истины.

Метод проверки такой же, как и выше, результат проверки:

Метод пятый Метод шестой Метод седьмой Метод восьмой
первый раз 151.380ms 221.332ms 875.402ms 240.411ms
второй раз 152.031ms 223.436ms 877.112ms 237.208ms
третий раз 150.442ms 221.853ms 876.829ms 253.744ms
в четвертый раз 151.319ms 222.672ms 875.270ms 243.165ms
пятый раз 150.142ms 222.953ms 877.940ms 237.825ms
в шестой раз 155.226ms 225.441ms 879.223ms 240.648ms
Седьмой раз 151.254ms 219.965ms 883.324ms 238.197ms
В восьмой раз 151.632ms 218.274ms 878.331ms 240.940ms
В девятый раз 151.412ms 223.189ms 873.318ms 256.644ms
В десятый раз 155.563ms 220.595ms 881.203ms 234.534ms
Среднее время 152.040ms 221.971ms 877.795ms 242.332ms
Разница стека 238511400Byte 238511352Byte 53887824Byte 191345296Byte

вДалее, из приведенных выше данных хорошо видно,、с участием Вот этиГрамматика нетрадиционнаПетля илиЦикл быстрая, особеннометод. Однако из-заЕсть возвращаемое значение, новый массив вызывать не нужноМетод, поэтому использование памяти очень мало при выполнении задач неглубокого копирования. а такжеСинтаксис также имеет определенные преимущества в использовании памяти. Кстати:Может пройтиВыскакивает ключевое слово, иТакого цикла невозможно избежать.

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

Как можно видеть:

  1. Гугл ХромСинтаксис цикла обычно медленнее, чем традиционный синтаксис цикла, но в Firefox и Safari ситуация почти противоположная.
  2. Время выполнения различных синтаксисов циклов в Google Chrome не сильно отличается. ноВ частности, скорость явно ниже, чем у некоторых других грамматик, но в Firefox и Safari происходит обратное.Это быстрее!
  3. Яблочный Дафа — это хорошо

В чем разница между циклами while js и for js?

Разница между этими циклами заключается в том, как они прекращают выполнение фрагмента кода.

Цикл for выполняется установленное количество итераций. Мы точно знаем, сколько раз цикл выполнит заключенный в его теле фрагмент кода.

В while все происходит по-другому. Цикл while JS (JavaScript( выполняется, пока истинно определенное условие. После того, как условие расценивается как ложное, тогда цикл while прекращается.

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

Циклы

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

1. Последовательный цикл

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

2. Отложенный цикл

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

И мы можем уйти ещё дальше, применив условные операторы с , на примере цикла :

3. Параллельный цикл

Если это работает параллельно, делайте это параллельно. Параллельные циклы могут быть созданы добавлением промиса в массив. Сам промис при этом обратится в значение, следовательно все промисы запустятся в одно и тоже время и каждый будет иметь своё время для завершения, конечные результаты будут автоматически сгруппированы :

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

Цикл while в JavaScript

Цикл этого вида является основным. Синтаксис:

В этом цикле сначала вычисляется Выражение.
Если выражение ИСТИННО, то выполняется Инструкция. Если выражение ЛОЖНО, то цикл НЕ выполняется (либо прерывается).

Инструкций может быть несколько (в этом случае они должны быть заключены в
операторные скобки).

Пример:

var i = 0;

while (i ) 
{
  document.write(i);
  i = i + 1;         //Обязательно!!!
}

В теле цикла мы каждый раз увеличиваем значение переменной на единицу. Но мы это делаем уже ПОСЛЕ того, как выводим значение на экран. Поэтому в данном примере мы выводим числа от 0 до 9.

Почему только до 9? Потому что в нашем случае выражение

Цикл for-in

Цикл используется для перебора в случайном порядке перечисляемых свойств объекта и имеет следующий синтаксис:

for (переменная in объект)
  инструкция;

Слева от ключевого слова указывается имя переменной, которой перед началом каждой итерации цикла присваивается в виде строки имя одного из свойств объекта. Справа от ключевого слова указывается объект, свойства которого будут перебираться циклом. Цикл будет выполняться до тех пор, пока не будут перебраны все доступные свойства. Если переменная, представляющая объект, будет иметь значение или цикл не выполнится ни разу:

var obj = {x: 5, y: 10};

for (var prop in obj) {
  alert(prop);
}

Чтобы связанный с циклом код был в одном месте, в цикле допускается объявлять переменную. Поэтому, в качестве выражения перед ключевым словом обычно выступает объявление переменной, которой будут присваиваться имена свойств.

С этой темой смотрят:

  • Инструкции break и continue
  • Метки инструкций
  • Выражения и инструкции
  • Преобразование типов данных
Рейтинг
( Пока оценок нет )
Editor
Editor/ автор статьи

Давно интересуюсь темой. Мне нравится писать о том, в чём разбираюсь.

Понравилась статья? Поделиться с друзьями:
Люкс-хост
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: