Для чего используют событие load? Есть ли у этого события недостатки? Знаете ли вы какие-либо альтернативы и в каких случаях бы стали их использовать?
Событие load происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
Событие DOM DOMContentLoaded будет запущено после создание DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
#вопросы_по_javascript
Событие load происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
Событие DOM DOMContentLoaded будет запущено после создание DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
#вопросы_по_javascript
❤2
Прекрати мечтать и стань мидлом за 50 дней
Опытные Frontend-разработчики создали несколько бесплатных каналов, в которых регулярно выходят топовые посты для начинающих.
Полезная вËрстка — канал с готовыми решениями повседневных задач: слайдеры, анимация, навигация и т.д.
JavaScript заметки — образовательный канал с ежедневными практическими заметками по языку.
JavaScript тесты — канал с тестами и задачами, который прокачает твои навыки во Frontend-разработке.
CSS доширак — готовые анимации, hover-эффекты и прелоадеры, которые можно вставить в свой проект и настроить пока заваривается Доширак.
Развивайся с нами, ведь так проще!
Опытные Frontend-разработчики создали несколько бесплатных каналов, в которых регулярно выходят топовые посты для начинающих.
Полезная вËрстка — канал с готовыми решениями повседневных задач: слайдеры, анимация, навигация и т.д.
JavaScript заметки — образовательный канал с ежедневными практическими заметками по языку.
JavaScript тесты — канал с тестами и задачами, который прокачает твои навыки во Frontend-разработке.
CSS доширак — готовые анимации, hover-эффекты и прелоадеры, которые можно вставить в свой проект и настроить пока заваривается Доширак.
Развивайся с нами, ведь так проще!
👍2❤1
Объясните, что такое блочный контекст форматирования и как он работает.
Блочный контекст форматирования — часть механизма отображения веб-страницы в CSS. Это регион страницы, в котором блоки размещаются в привычном для блоков порядке, и в котором плавающие элементы взаимодействуют с другими элементами.
Блочный контекст форматирования может быть создан чем-либо из этого списка:
- плавающие элементы (элементы, у которых float не равно none)
- абсолютно позиционированные элементы (элементы, значение position которых либо absolute, либо fixed)
- «строчные блоки» (элементы с display: inline-block)
- флекс-элементы (непосредственные потомки элемента с display: flex или inline-flex)
- грид-элементы (непосредственные потомки элемента с display: grid или inline-grid) многоколоночные контейнеры (элементы, у которых column-count или column-width не - равно auto, включая элементы с column-count: 1)
#вопросы_по_css
Блочный контекст форматирования — часть механизма отображения веб-страницы в CSS. Это регион страницы, в котором блоки размещаются в привычном для блоков порядке, и в котором плавающие элементы взаимодействуют с другими элементами.
Блочный контекст форматирования может быть создан чем-либо из этого списка:
- плавающие элементы (элементы, у которых float не равно none)
- абсолютно позиционированные элементы (элементы, значение position которых либо absolute, либо fixed)
- «строчные блоки» (элементы с display: inline-block)
- флекс-элементы (непосредственные потомки элемента с display: flex или inline-flex)
- грид-элементы (непосредственные потомки элемента с display: grid или inline-grid) многоколоночные контейнеры (элементы, у которых column-count или column-width не - равно auto, включая элементы с column-count: 1)
#вопросы_по_css
Как вырасти от junior до middle? Middle-специалист отличается не только опытом и уровнем владения технологиями, но и софт скилами. Курс Яндекс Практикума «Мидл фронтенд-разработчик» составлен так, чтобы вы могли освоить и то, и другое а ещё:
• разработать мессенджер, используя только JavaScript, Typescript, CSS и API браузера;
• познакомиться с теорией и отработать её на практике в больших проектах;
• научиться брать ответственность за решения и вкладываться в общий результат;
• самостоятельно декомпозировать задачи и распределять время;
• исследовать смежные сферы программирования, без которых невозможен фронтенд:
• информационную безопасность, прототипирование интерфейсов, командную работу, DevOps, ООП.
На всех этапах вас будут сопровождать опытные разработчики: мы не дадим просесть по учёбе и поможем выкроить время на образование. Вы будете практиковаться на реальных кейсах и положите в портфолио работающие проекты. А карьерные консультации подготовят вас к разговору о повышении или помогут с поиском новой работы.
Пройдите первый бесплатный урок
• разработать мессенджер, используя только JavaScript, Typescript, CSS и API браузера;
• познакомиться с теорией и отработать её на практике в больших проектах;
• научиться брать ответственность за решения и вкладываться в общий результат;
• самостоятельно декомпозировать задачи и распределять время;
• исследовать смежные сферы программирования, без которых невозможен фронтенд:
• информационную безопасность, прототипирование интерфейсов, командную работу, DevOps, ООП.
На всех этапах вас будут сопровождать опытные разработчики: мы не дадим просесть по учёбе и поможем выкроить время на образование. Вы будете практиковаться на реальных кейсах и положите в портфолио работающие проекты. А карьерные консультации подготовят вас к разговору о повышении или помогут с поиском новой работы.
Пройдите первый бесплатный урок
Промисамы (promises) и их полифилы
Промис — это объект, который может вернуть одно значение в будущем: либо выполненное значение, либо причину, по которой оно не было выполнено (например, произошла ошибка сети). Промис может находиться в одном из 3 возможных состояний: выполнено, отклонено или ожидает выполнения. При использовании промисов можно добавлять callback-функции для обработки выполенного значения или причины отказа.
Некоторыми распространёнными полифилами являются $.deferred, Q и Bluebird, но не все они соответствуют спецификации. ES2015 поддерживает промисы "из коробки", и в настоящее время полифилы обычно не нужны.
#вопросы_по_javascript
Промис — это объект, который может вернуть одно значение в будущем: либо выполненное значение, либо причину, по которой оно не было выполнено (например, произошла ошибка сети). Промис может находиться в одном из 3 возможных состояний: выполнено, отклонено или ожидает выполнения. При использовании промисов можно добавлять callback-функции для обработки выполенного значения или причины отказа.
Некоторыми распространёнными полифилами являются $.deferred, Q и Bluebird, но не все они соответствуют спецификации. ES2015 поддерживает промисы "из коробки", и в настоящее время полифилы обычно не нужны.
#вопросы_по_javascript
🔥6
Для чего используют событие load? Есть ли у этого события недостатки? Знаете ли вы какие-либо альтернативы и в каких случаях бы стали их использовать?
Событие load происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
Событие DOM DOMContentLoaded будет запущено после создание DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
#вопросы_по_javascript
Событие load происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
Событие DOM DOMContentLoaded будет запущено после создание DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
#вопросы_по_javascript
👍4
Что такое AJAX? Каким образом можно выполнить AJAX-запрос в JavaScript?
AJAX (Asynchronous JavaScript and XML) - это технология, позволяющая обновлять части веб-страницы без перезагрузки всей страницы. Она позволяет передавать и получать данные между клиентом (браузером) и сервером асинхронно.
Для выполнения AJAX-запроса в JavaScript можно использовать объект XMLHttpRequest (XHR) или современный метод fetch().
XMLHttpRequest:
AJAX (Asynchronous JavaScript and XML) - это технология, позволяющая обновлять части веб-страницы без перезагрузки всей страницы. Она позволяет передавать и получать данные между клиентом (браузером) и сервером асинхронно.
Для выполнения AJAX-запроса в JavaScript можно использовать объект XMLHttpRequest (XHR) или современный метод fetch().
XMLHttpRequest:
var xhr = new XMLHttpRequest();fetch():
xhr.open('GET', 'https://example.com/data', true); // Указываем метод и URL запроса
xhr.onreadystatechange = function () { // Обработчик события изменения состояния
if (xhr.readyState === 4 && xhr.status === 200) { // Проверяем, что запрос завершен успешно
var data = xhr.responseText; // Получаем данные из ответа сервера
console.log(data);
}
};
xhr.send(); // Отправляем запрос
fetch('https://example.com/data')
.then(function(response) { // Обработчик успешного выполнения запроса
if (response.ok) {
return response.text();
} else {
throw new Error('Ошибка HTTP: ' + response.status);
}
})
.then(function(data) { // Обработчик полученных данных
console.log(data);
})
.catch(function(error) { // Обработчик ошибок
console.log(error);
});
В обоих случаях мы отправляем запрос на указанный URL и обрабатываем полученные данные или ошибку. AJAX-запросы могут быть разных типов (GET, POST, PUT, DELETE) и могут отправлять параметры или тело запроса с данными.👍11❤1
Освоил тут, как делиться папками в ТЛГ.
Вдруг кому пригодится - ловите подборку каналов) https://t.me/addlist/YmlbByWrMX43NDcy
Вдруг кому пригодится - ловите подборку каналов) https://t.me/addlist/YmlbByWrMX43NDcy
❤2
Каким образом можно обмениваться кодом между файлами?
Это зависит от среды выполнения JavaScript. На клиенте (в среде браузера), пока переменные/функции объявлены в глобальной области видимости (window), все скрипты могут на них ссылаться. В качестве альтернативы, используйте Asynchronous Module Definition (AMD) через RequireJS для модульного подхода.
На сервере (Node.js) обычно используется CommonJS. Каждый файл считается модулем, и он может экспортировать переменные и функции, добавляя их к объекту module.exports.
ES2015 позволяет использовать модульный синтаксис, который призван заменить как AMD, так и CommonJS. В конечном итоге он будет поддерживаться как в браузере, так и в Node.
#вопросы_по_javascript
Это зависит от среды выполнения JavaScript. На клиенте (в среде браузера), пока переменные/функции объявлены в глобальной области видимости (window), все скрипты могут на них ссылаться. В качестве альтернативы, используйте Asynchronous Module Definition (AMD) через RequireJS для модульного подхода.
На сервере (Node.js) обычно используется CommonJS. Каждый файл считается модулем, и он может экспортировать переменные и функции, добавляя их к объекту module.exports.
ES2015 позволяет использовать модульный синтаксис, который призван заменить как AMD, так и CommonJS. В конечном итоге он будет поддерживаться как в браузере, так и в Node.
#вопросы_по_javascript
👍3❤1🔥1
В чем разница между .call и .apply?
Сходство заключается в том, что и .call, и .apply используются для вызова функций, а также первый параметр будет использоваться как значение this внутри функции. А разница в том, что .call в качестве слудующих аргументов принимает аргументы, разделенные запятыми, в то время как .apply в качестве следующих аргументов принимает массив аргументов.
function add(a, b) {
return a + b;
}
console.log(_add.call(null, 1, 2)); // 3
console.log(add.apply(null, 1, 2)); // 3
#вопросы\по_javascript
Сходство заключается в том, что и .call, и .apply используются для вызова функций, а также первый параметр будет использоваться как значение this внутри функции. А разница в том, что .call в качестве слудующих аргументов принимает аргументы, разделенные запятыми, в то время как .apply в качестве следующих аргументов принимает массив аргументов.
function add(a, b) {
return a + b;
}
console.log(_add.call(null, 1, 2)); // 3
console.log(add.apply(null, 1, 2)); // 3
#вопросы\по_javascript
🔥3🤩1
Что такое декораторы и к чему их можно применить?
Декоратор - это особый вид объявления, который позволяет вам изменять классы или члены классов сразу, помечая их аннотацией name. Каждый декоратор должен ссылаться на функцию, которая будет оцениваться во время выполнения.
Например, декоратор @sealed будет соответствовать запечатанной функции. Все, что помечено @sealed, будет использоваться для оценки запечатанной функции.
Их можно прикрепить к:
- Объявлениям классов
- Методам
- Свойствам-аксессорам
- Свойствам
- Параметрам
По умолчанию декораторы не включены. Чтобы включить их, вы должны отредактировать поле experimentalDecorators в параметрах компилятора в файле tsconfig.json или в командной строке.
#вопросы_по_typescript
Декоратор - это особый вид объявления, который позволяет вам изменять классы или члены классов сразу, помечая их аннотацией name. Каждый декоратор должен ссылаться на функцию, которая будет оцениваться во время выполнения.
Например, декоратор @sealed будет соответствовать запечатанной функции. Все, что помечено @sealed, будет использоваться для оценки запечатанной функции.
Их можно прикрепить к:
- Объявлениям классов
- Методам
- Свойствам-аксессорам
- Свойствам
- Параметрам
По умолчанию декораторы не включены. Чтобы включить их, вы должны отредактировать поле experimentalDecorators в параметрах компилятора в файле tsconfig.json или в командной строке.
#вопросы_по_typescript
🔥2
Что такое декораторы и к чему их можно применить?
Декоратор - это особый вид объявления, который позволяет вам изменять классы или члены классов сразу, помечая их аннотацией name. Каждый декоратор должен ссылаться на функцию, которая будет оцениваться во время выполнения.
Например, декоратор @sealed будет соответствовать запечатанной функции. Все, что помечено @sealed, будет использоваться для оценки запечатанной функции.
Их можно прикрепить к:
- Объявлениям классов
- Методам
- Свойствам-аксессорам
- Свойствам
- Параметрам
По умолчанию декораторы не включены. Чтобы включить их, вы должны отредактировать поле experimentalDecorators в параметрах компилятора в файле tsconfig.json или в командной строке.
#вопросы_по_typescript
Декоратор - это особый вид объявления, который позволяет вам изменять классы или члены классов сразу, помечая их аннотацией name. Каждый декоратор должен ссылаться на функцию, которая будет оцениваться во время выполнения.
Например, декоратор @sealed будет соответствовать запечатанной функции. Все, что помечено @sealed, будет использоваться для оценки запечатанной функции.
Их можно прикрепить к:
- Объявлениям классов
- Методам
- Свойствам-аксессорам
- Свойствам
- Параметрам
По умолчанию декораторы не включены. Чтобы включить их, вы должны отредактировать поле experimentalDecorators в параметрах компилятора в файле tsconfig.json или в командной строке.
#вопросы_по_typescript
👍3
Перечислите все виды списков, которые можно использовать для создания веб-страниц
В HTML есть 3 вида списков:
- Упорядоченный список: отображает элементы в пронумерованном формате. В тег обозначает упорядоченный список
- Неупорядоченный список: отображает элементы в маркированном формате. В тег обозначает неупорядоченный список
- Список определений: отображает элементы в форме определения, подобной словарю. В , а также теги обозначают список определений.
#вопросы_по_html
В HTML есть 3 вида списков:
- Упорядоченный список: отображает элементы в пронумерованном формате. В тег обозначает упорядоченный список
- Неупорядоченный список: отображает элементы в маркированном формате. В тег обозначает неупорядоченный список
- Список определений: отображает элементы в форме определения, подобной словарю. В , а также теги обозначают список определений.
#вопросы_по_html
ПРИВЕТ!
4 сентября у наших друзей стартует набор на новый поток обучения профессии «frontend-разработчик».
ЧТО ТЕБЯ ЖДЕТ:
😎Крутой и нестандартный подход к изучению JS - ребята набирают студентов в группы, у каждой из которых свой наставник, который ведет за руку ученика.
🤩Максимальное погружение в учебу - до 20 часов в неделю придется потратить строго на УЧЕБУ
😍Глубокое изучение JS+Vue.js от практикующих разработчиков - минимальный опыт - от 10 лет.
🤑ОПЛАЧИВАЕМАЯ СТАЖИРОВКА для лучших студентов. Да, да - первый коммерческий опыт можно получить сразу по окончании или в процессе прохождения курса
🤓Помощь в дальнейшем трудоустройстве - ребята приложат все усилия, чтобы помочь вам попасть на позицию Junior-frontend developer
Заинтересовало? Пиши ребятам - @devhouse_school
P.S. А если назовете промокод [HANLAYOT] - получите жирную такую скидку на 5 000 рублей (а курс там и так дешевле большинства других)
4 сентября у наших друзей стартует набор на новый поток обучения профессии «frontend-разработчик».
ЧТО ТЕБЯ ЖДЕТ:
😎Крутой и нестандартный подход к изучению JS - ребята набирают студентов в группы, у каждой из которых свой наставник, который ведет за руку ученика.
🤩Максимальное погружение в учебу - до 20 часов в неделю придется потратить строго на УЧЕБУ
😍Глубокое изучение JS+Vue.js от практикующих разработчиков - минимальный опыт - от 10 лет.
🤑ОПЛАЧИВАЕМАЯ СТАЖИРОВКА для лучших студентов. Да, да - первый коммерческий опыт можно получить сразу по окончании или в процессе прохождения курса
🤓Помощь в дальнейшем трудоустройстве - ребята приложат все усилия, чтобы помочь вам попасть на позицию Junior-frontend developer
Заинтересовало? Пиши ребятам - @devhouse_school
P.S. А если назовете промокод [HANLAYOT] - получите жирную такую скидку на 5 000 рублей (а курс там и так дешевле большинства других)
Для чего используют событие load? Есть ли у этого события недостатки? Знаете ли вы какие-либо альтернативы и в каких случаях бы стали их использовать?
Событие load происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
Событие DOM DOMContentLoaded будет запущено после создание DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
#вопросы_по_javascript
Событие load происходит в конце процесса загрузки документа. На этом этапе все объекты в документе находятся в DOM, и все изображения, скрипты и ссылки загрузились.
Событие DOM DOMContentLoaded будет запущено после создание DOM для страницы, но не будет ждать окончания загрузки других ресурсов. Оно предпочтительно в тех случаях, когда вам не нужно загружать страницу целиком перед инициализацией.
#вопросы_по_javascript
👍2
Объясните, как this работает в JavaScript.
Использование this гарантирует, что функция работает именно с тем объектом, в контексте которого вызвана, если это не стрелочная функция. У стрелочных функций контекст this определяется в момент создания функции.
Значение this называется контекстом вызова и будет определено в момент вызова функции. Значением this является объект перед точкой, в контексте которого вызван метод.
#вопросы_по_javascript
Использование this гарантирует, что функция работает именно с тем объектом, в контексте которого вызвана, если это не стрелочная функция. У стрелочных функций контекст this определяется в момент создания функции.
Значение this называется контекстом вызова и будет определено в момент вызова функции. Значением this является объект перед точкой, в контексте которого вызван метод.
#вопросы_по_javascript
Как вы реализуете макет, который использует нестандартные шрифты?
Буду подключать шрифты с помощью @font-face для каждого font-weight.
#вопросы_по_css
Буду подключать шрифты с помощью @font-face для каждого font-weight.
#вопросы_по_css
👍2
Расскажите о различия padding и margin?
margin
Устанавливает величину отступа от каждого края элемента. Отступом является пространство от границы текущего элемента до внутренней границы его родительского элемента.
padding
Устанавливает значение полей вокруг содержимого элемента. Полем называется расстояние от внутреннего края рамки элемента до воображаемого прямоугольника, ограничивающего его содержимое.
#вопросы_по_html
margin
Устанавливает величину отступа от каждого края элемента. Отступом является пространство от границы текущего элемента до внутренней границы его родительского элемента.
padding
Устанавливает значение полей вокруг содержимого элемента. Полем называется расстояние от внутреннего края рамки элемента до воображаемого прямоугольника, ограничивающего его содержимое.
#вопросы_по_html
👍3
Open-Closed Principle (Принцип открытости-закрытости)
Модули, отвечающие принципу открытости-закрытости, имеют два главных признака:
- Открыты для расширения. Поведение модуля может быть расширено. Мы можем добавить модулю новое поведение в соответствии с изменившимися требованиями к приложению или для удовлетворения нужд новых приложений.
- Закрыты для изменений. Исходный код такого модуля неприкасаем. Никто не вправе вносить в него изменения.
Модули, отвечающие принципу открытости-закрытости, имеют два главных признака:
- Открыты для расширения. Поведение модуля может быть расширено. Мы можем добавить модулю новое поведение в соответствии с изменившимися требованиями к приложению или для удовлетворения нужд новых приложений.
- Закрыты для изменений. Исходный код такого модуля неприкасаем. Никто не вправе вносить в него изменения.
❤1
Что такое кэш приложения в HTML5?
Одной из наиболее востребованных функций для конечного пользователя является работа в автономном режиме. Другими словами, если соединение с интернетом недоступно, страница должна возвращаться из кэша браузера, и кэш приложения поможет вам в этом.
Кэш приложения помогает вам определить, какие файлы должны быть кэшированы, а какие нет.
#вопросы_по_html
Одной из наиболее востребованных функций для конечного пользователя является работа в автономном режиме. Другими словами, если соединение с интернетом недоступно, страница должна возвращаться из кэша браузера, и кэш приложения поможет вам в этом.
Кэш приложения помогает вам определить, какие файлы должны быть кэшированы, а какие нет.
#вопросы_по_html
👍2