Фронтендщик


Гео и язык канала: Россия, Русский
Категория: Технологии


Все для frontend developer, шуточки, тесты, статьи
Администрация/Реклама @vtopua

Связанные каналы  |  Похожие каналы

Гео и язык канала
Россия, Русский
Категория
Технологии
Статистика
Фильтр публикаций


Сделаем это и убедимся, что все работает:

for (let elem of arr) {
console.log(elem);
}

📌 #instr || Фронтендщик


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

Первым маленьким шагом я бы предложил просто перебрать элементы массива циклом и вывести их в консоль.

📌 #instr || Фронтендщик


Давайте попробуем на практике. Пусть для примера у вас дан массив с числами:

let arr = [1, 2, 3,
4, 5, 6, 7,
8, 9]; 

📌 #instr || Фронтендщик


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

📌 #instr || Фронтендщик


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

📌 #instr || Фронтендщик


Советы по написанию кода циклов в JavaScript

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

📌 #instr || Фронтендщик


Теперь после цикла мы можем сделать иф, который посмотрит на переменную flag и выведет на экран '+++' или '---':

let arr = [1, 2, 3, 4, 5];
let flag = false;

for (let elem of arr) {
if (elem == 3) {
flag = true;
break;
}
}

if (flag === true) {
console.log('+++');
} else {
console.log('---');
}

📌 #instr || Фронтендщик


Ответ на вопрос, если в массиве 3 или нет, мы можем дать только после цикла. И этот ответ у нас уже есть: после цикла переменная flag могла остаться falseили могла сменить свое значение на true, если цикл обнаружил в массиве 3:

let arr = [1, 2, 3, 4, 5];
let flag = false;

for (let elem of arr) {
if (elem == 3) {
flag = true;
break;
}
}

// тут переменная flag
равна или
true, или false 

📌 #instr || Фронтендщик


Затем запустим цикл с ифом так, как мы делали это раньше. Если цикл обнаружит, что в массиве есть элемент 3 - то поставим переменную flag в значение true и выйдем из цикла с помощью break:

let arr = [1, 2, 3, 4, 5];
let flag = false; // считаем,
что элемента
3 нет в массиве 

for (let elem of arr) {
if (elem == 3) {
flag = true; // элемент
есть - переопределим
переменную flag 
break; // выйдем из цикла
}
}

📌 #instr || Фронтендщик


Изначально поставим переменную flag в значение false - то есть будем считать, что элемента 3 в массиве нет:

let arr = [1, 2, 3, 4, 5];
let flag = false; // считаем,
что элемента 3 нету в
массиве 

📌 #instr || Фронтендщик


Как уже упоминалось выше, флаг - это такая переменная, которая может принимать два значения: true или false.
Итак, давайте сделаем переменную flagс таким значением: если она равна true, то в массиве есть элемент 3, а еслиfalse, то такого элемента нет.

📌 #instr || Фронтендщик


Итак, идея добавить else - плохая идея, не рабочая. Для решения задач подобного типа (такие задачи встречаются достаточно часто) и используют так называемые флаги.

📌 #instr || Фронтендщик


Давайте теперь попробуем сделать так, чтобы, если в массиве вообще нет элементов со значением 3, выводилось '---'.

Распространенным заблуждением будет добавить else к нашему ифу - в этом случае '---' будет выводиться на все элементы, не являющиеся 3:

let arr = [1, 2, 3, 4, 5];

for (let elem of arr) {
if (elem == 3) {
console.log('+++');
// выведет
на элементе 3 
} else {
console.log('---');
// выведет на элементах
1, 2, 4, 5 
}
}

📌 #instr || Фронтендщик


Поправим проблему: завершим цикл с помощью break, если элемент уже найден:

let arr = [1, 2, 3, 4, 3, 5];

for (let elem of arr) {
if (elem == 3) {
console.log('+++');
break; // завершим цикл
}
}

📌 #instr || Фронтендщик


Но наше решение не очень хорошо: ведь если в массиве будет не одно значение 3, а несколько, то '+++' выведется несколько раз. Давайте исправим наш массив (сделаем два элемента со значением 3) и убедимся в этом:
let arr = [1, 2, 3, 4, 3, 5];

for (let elem of arr) {
if (elem == 3) {
console.log('+++');
// выведет
несколько раз 
}
}

📌 #instr || Фронтендщик


Для начала давайте попробуем вывести '+++'. Для этого переберем все элементы нашего массива и ифом будем спрашивать - равен ли текущий элемент значению 3. Если равен - выведем '+++':
let arr = [1, 2, 3, 4, 5];

for (let elem of arr) {
if (elem == 3) {
console.log('+++');
}
}

📌 #instr || Фронтендщик


Давайте решим следующую задачу: дан массив с числами, нужно проверить, есть ли в нем элемент со значением 3или нет. Если есть - выведем '+++', если нет - выведем '---'.

📌 #instr || Фронтендщик


Работа с флагами в JavaScript

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

📌 #instr || Фронтендщик


Давайте переберем его циклом for-in и увеличим каждый из его элементов в 2раза:

for (let key in obj) {
obj[key] = obj[key] * 2;
}

📌 #instr || Фронтендщик


Изменение объектов через цикл в JavaScript

Объекты также можно менять в цикле. Пусть, к примеру, у нас есть вот такой объект:

let obj = {a: 1, b: 2, c: 3};

📌 #instr || Фронтендщик

Показано 20 последних публикаций.