How To WebDev
Открыть в Telegram
Заявки принимаются моментально! Обучаем фронтентду и бекенду просто и понятно! Сотрудничество: @me_Smith Ссылка на канал: @HowTo_WebDev
Больше3 353
Подписчики
Нет данных24 часа
-157 дней
-6130 день
Архив постов
3 353
🧾 Подъемный JavaScript (финал)
Объявляйте свои переменные наверху!
Подъем - это (для многих разработчиков) неизвестное или недооцененное поведение JavaScript.
Если разработчик не понимает подъема, программы могут содержать ошибки (errors).
Чтобы избежать ошибок, всегда объявляйте все переменные в начале каждой области видимости.
Так как JavaScript интерпретирует код именно так, это всегда хорошее правило.
JavaScript в строгом режиме не позволяет использовать переменные, если они не объявлены.
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
‼️ 3 канала, которые дадут ощутимый буст начинающим и опытным айтишникам
Телеграм — кладезь полезной инфы, и мы выделили самые важные источники. Подпишись, чтобы не потерять!
🖥 ПК_User — канал с фичами и хаками системы, которые прокачают твоё владение железом и помогут обойти многие ограничения.
🤝 JavaScript Teacher — серьёзный источник по JavaScript с тестами, гайдами и секретами (авторы канала — профессиональные разрабы и наставники).
🐍 Python Teacher — сообщество Senior-разработчиков, разжёвывающих темы и проводящих тестирования по самому известному языку программирования.
3 353
🧾 Подъемный JavaScript (часть 4)
Имеет ли смысл, что у не определен в последнем примере?
Это потому, что наверх поднимается только объявление (var y), а не инициализация (=7).
Из-за подъема у был объявлен до его использования, но поскольку инициализации не поднимаются, значение у не определен.
Пример:
var x = 5; // Инициализируем x
var y; // Объявляем y
elem = document.getElementById("demo"); // Находим элемент
elem.innerHTML = x + " " + y; // Отображаем x и y
y = 7; // Присваиваем 7 к y
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
🧾 Подъемный JavaScript (часть 3)
Инициализации JavaScript не поднимаются
JavaScript поднимает только объявления, а не инициализации.
В примере 1 получается тот же результат, что и в примере 2:
Пример 1:
var x = 5; // Инициализируем x
var y = 7; // Инициализируем y
elem = document.getElementById("demo"); // Находим элемент
elem.innerHTML = x + " " + y; // Отображение x и y
Пример 2:
var x = 5; // Инициализируем x
elem = document.getElementById("demo"); // Находим элемент
elem.innerHTML = x + " " + y; // Отображение x и y
var y = 7; // Инициализируем y
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
4PDA теперь в Telegram!
4PDA – крупнейший в рунете тематический ресурс, посвященный технологиям, приложениям и кодингу. Специально для программистов у них появился официальный канал в телеграм, где вы увидите сливы платных курсов, интересные статьи и много другого!
Подписывайтесь: @4pda_forum
3 353
🧾 Подъемный JavaScript (часть 2)
Ключевые слова let и const
Переменные, определенные с помощью let и const, поднимаются в верхнюю часть блока, но не инициализируются.
Блок кода знает об этой переменной, но ее нельзя использовать до тех пор, пока она не будет объявлена.
Использование переменной let до ее объявления, приведет к ReferenceError.
Переменная находится в "временной мертвой зоне" с начала блока до тех пор, пока она не будет объявлена.
Пример – это приведет к ReferenceError:
carName = "Вольво";
let carName;
Использование переменной const до того, как она будет объявлена, является синтаксической ошибкой, поэтому код просто не будет выполняться.
Пример – этот код не запускается:
carName = "Вольво";
const carName;
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
🧾 Подъемный JavaScript (часть 1)
В этой серии постов мы подробнее рассмотрим подъёмный Let и подъёмный JavaScript.
Подъем - это поведение JavaScript по умолчанию, при котором все объявления перемещаются в верхнюю часть текущей области (в верхнюю часть текущего скрипта или текущей функции).
Объявления поднимаются
В JavaScript переменная может быть объявлена после её использования. Другими словами, переменную можно использовать до ее объявления.
Пример 1 дает тот же результат, что и пример 2.
Пример 1:
x = 5; // Присваиваем 5 к x
elem = document.getElementById("demo"); // Находим элемент
elem.innerHTML = x; // Отображаем x в элементе
var x; // Объявить x
Пример 2:
var x; // Объявить x
x = 5; // Присваиваем 5 к x
elem = document.getElementById("demo"); // Находим элемент
elem.innerHTML = x; // Отображаем x в элементе
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
Быстро прокачать свой скилл в HTML/CSS/JS? Легко!
Еще Конфуций говорил: "Скажи мне — и я забуду, покажи мне — и я запомню, дай мне сделать — и я пойму."
Он был мудрым мужиком, а мудрых надо слушать!
Решить проблему с нелегким заучиванием и нехваткой практики можно — подписывайся на Frontend Quiz.
Ребята ежедневно публикуют задачи по HTML, CSS и JS.
Присоединяйся к уютному комьюнити!
3 353
🧾 Ключевое слово Let в JavaScript (финал)
Поддержка браузера
Ключевое слово let не полностью поддерживается в Internet Explorer 11 и в более ранних версиях браузера.
Сейчас мы приведём первые версии браузера с полной поддержкой ключевого слова let:
Chrome 49 – Mar, 2016.
Edge 12 – Jul, 2015.
Firefox 44 – Jan, 2015.
Safari 11 – Sep, 2017.
Opera 36 – Mar, 2016.
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
🧾 Ключевое слово Let в JavaScript (часть 5)
Подъемный Let
Переменные, определенные с помощью var, являются подъемными сверху и могут быть инициализированы в любое время.
Вы можете использовать переменную до ее объявления:
carName = "Вольво";
var carName;
Переменные, определенные с помощью let, также поднимаются в верхнюю часть блока, но не инициализируются.
Использование let до ее объявления приведет к ReferenceError:
carName = "Сааб";
let carName = "Вольво";
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
Факт, про который вы забываете: весь код уже написан
Где его найти?
ФронтЛиба - это сборник удобных библиотек с готовым кодом под твои задачи. Открываешь – находишь нужную либу – выполняешь задачу в 5 раз быстрее.
Подписывайся. Уважай свое время: @frontLibs
3 353
🧾 Ключевое слово Let в JavaScript (часть 4)
Повторное объявление
Повторное объявление переменной JavaScript с var, допускается в любом месте программы:
var x = 2;
// Здесь x равно 2
var x = 3;
// Здесь x равно 3
С let повторное объявление переменной в том же блоке не допускается: код.
Повторное объявление переменной с let, в другом блоке, допускается: код.
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
🧾 Ключевое слово Let в JavaScript (часть 3)
Повторное объявление переменных
Повторное объявление переменной с использованием ключевого слова var, может вызвать проблемы.
Повторное объявление переменной внутри блока, также приведет к повторному объявлению переменной вне блока: код.
Повторное объявление переменной с использованием ключевого слова let, может решить эту проблему.
Повторное объявление переменной внутри блока
не приведет к повторному объявлению переменной вне блока: код.
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev3 353
Сайт, Сэр - telegram канал web-разработчика с 10-летним стажем. В нем он делится:
нейросетями - сделают за вас грязную работу
готовым кодом - реализует крутые фишки на сайте
сервисами - упростят любую работу
библиотеками - помогут быстрей решить задачу
Присоединяйся и прокачивай свои скилы!
3 353
🧾 Ключевое слово Let в JavaScript (часть 2)
Область действия блока
До ES6 (2015) JavaScript имел только глобальную область действия и область действия функций.
В ES6 введены два важных новых ключевых слова JavaScript: let и const.
Эти два ключевых слова обеспечивают область действия блока в JavaScript.
Переменные, объявленные внутри блока {}, не могут быть доступны извне блока:
{
let x = 2;
}
// x НЕЛЬЗЯ использовать
Переменные, объявленные с помощью ключевого слова var не могут иметь область действия блока.
Переменные, объявленные внутри блока { }, могут быть доступны извне блока:
{
var x = 2;
}
// x МОЖНО использовать здесь
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
🧾 Ключевое слово Let (часть 1)
Переменные, определенные с помощью let, не могут быть повторно объявлены.
Вы не можете случайно повторно объявить переменную.
С let вы не можете этого сделать:
let x = "Андрей Щипунов";
let x = 0;
// Синтаксическая ошибка: "x" уже объявлен
С помощью var вы можете:
var x = "Андрей Щипунов";
var x = 0;
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
Фронтендеры на месте?
Нашли для вас канал, где постят эффекты с готовым кодом на Codepen. Увидел – и сразу заюзал в своём проекте.
Подпишись и пили сайты на уровне Apple – @frontend_formula
3 353
🧾 Комментарии JavaScript (финал)
Использование комментариев для предотвращения выполнения кода
Использование комментариев для предотвращения выполнения кода подходит для тестирования кода.
Добавление // перед строкой кода изменяет строки кода с исполняемой строки на комментарий.
В этом примере // используется для предотвращения выполнения одной из строк кода:
//document.getElementById("myH").innerHTML = "Моя первая страница";
document.getElementById("myP").innerHTML = "Мой первый параграф.";
В этом примере используется блок комментариев для предотвращения выполнения нескольких строк:
/*
document.getElementById("myH").innerHTML = "Моя первая страница";
document.getElementById("myP").innerHTML = "Мой первый параграф.";
*/
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
🧾 Комментарии JavaScript (часть 2)
Многострочные комментарии
Многострочные комментарии начинаются /* и заканчиваются */.
Любой текст между /* и */ будет игнорироваться JavaScript.
В этом примере для объяснения кода используется многострочный комментарий (блок комментария):
/*
Приведенный ниже код изменится
заголовок с id = "myH"
и параграф с id = "myP"
на моей веб странице:
*/
document.getElementById("myH").innerHTML = "Моя первая страница";
document.getElementById("myP").innerHTML = "Мой первый параграф.";
Чаще всего используются однострочные комментарии. Блочные комментарии часто используются для формальной документации.
📋 #JavaScript #Совет
▬▬▬▬▬▬▬▬
// How To WebDev
3 353
Устал писать код с нуля? 🙁
Канал Нестыдный код ежедневно выпускает готовые решения повседневных задач 🤩:
🔸 Анимации
🔸 Карточки
🔸 Кнопки
🔸 Модальные окна
🔸 Готовые блоки кода
🔸 И многое другое...
Подпишись, чтобы не потерять ✅
Цени свое время! 🫶🏻
