Javascript и Разработка: истории из жизни, советы, новости и юмор — Все посты, страница 11

16

3 года назад

Undefined и null в JavaScript⁠⁠

Привет, в этом уроке мы подробно поговорим о типах данных undefined и null в JavaScript, рассмотрим то как они работают где их применять и как отвечать на каверзные вопросы на собеседовании связанные с этими типами данных. Текстовое описание в полной версии поста.

Undefined

undefined - примитивный тип данных который присваивается переменным как только они были объявлены.Также присваивается аргументам функции которые не были переданы и возвращается из функций внутри которых отсутствует 'return value' или присутствует 'return' без значения.

Не может вернуться и функции которая вызвана через оператор 'new'.

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

let exampleUndefined_1;
console.log('empty variable', exampleUndefined_1);

function exampleUndefined_2(a, b) {
console.log('func arguments', a, b);
}
exampleUndefined_2();

function exampleUndefined_3() {
return;
}
console.log(
'Empty return value',
exampleUndefined_3()
)

function exampleUndefined_4() {
let a = 2 + 2;
}
console.log(
'No return value',
exampleUndefined_4()
)

Нужно стараться избегать значения undefined, до того момента пока алгоритм решения вашей задачи не потребует обратного.

Для того чтобы избежать undefined есть несколько способов. Самым простым из них является инициализация переменной сразу со значением, а также использование let и const вместо var.

let foo = 10; // Good
let bar; // Bad
bar = 10;
var baz = 10; // Bad

Null

null - примитивный тип данных, обычно представляет собой отсутствие какого либо значения в объекте.

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

let nullExample_1 = null;

// Фигурные скобки используются для создания объекта.
let nullInObjectExample = {
firstName: null,
lastName: null,
age: 10
};

Отличие null от undefined

null является определенным значением отсутствия объекта или отсутствия значения для которого внутри объекта определен ключ.

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

Баг оператора typeof

Если мы используем typeof для проверки тип данных null мы получи object.

console.log(
typeof null
)

Для проверки того что значение действительно null, делаем так:

const anotherNullVariable = null;

console.log(

anotherNullVariable === null
)
Файлы с урока

undefined - link

null - link

P.S. Не забудь подписаться на мой youtube канал и на канал в telegram где я выкладываю контент каждый день.

Показать полностью

[моё] Разработка Программирование Программист IT Баг Javascript Frontend Создание сайта Разработчики Видео YouTube Длиннопост

4

20

directwix

3 года назад

Курс молодого бойца по JavaScript за 1 час с примерами⁠⁠

Всем привет!

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

А видео, на мой взгляд, получилось очень даже неплохим. За 1 час в нем рассказано:

1. Краткая история JavaScript

2. Почему JavaScript

3. Менеджер пакетов npm/yarn

4. Настройка среды, создание пробного проекта

5. Пара слов о TypeScript, и почему это круто

6. Пример реализации ссылки на сайте (http://mysite.ruru/api/calcCircleRadius?radius=5)

7. Минимальное представление о базах данных, виды связей (1 к 1, 1 ко многим и т.д.)

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

В видео используются только современные технологии, и не должно получится так, что через год-два-три что-то из того, что было рассказано на видео, перестанет быть актуальным. Следующее видео планировать записал про React на примере того же проекта, но не получив никакого фидбэка, забил на это дело. Это я тому, что даже этот бэкэнд-проект за час уже подготовил плацдарм для фрондэнда. React - это круто, за реактом будущее)

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

Показать полностью 1

[моё] Программирование Javascript Typescript Разработка IT Обучение Бесплатное обучение Видео YouTube

16

9

InfantAnnihilat

3 года назад

Лига программистов

Прошу совета. Цифровые профессии с поддержкой от государства⁠⁠

Без рейтинга.

Комментарий для минусов внутри.

Суть в том, что государство оплатит обучение 50%, 75% или 100% в зависимости от вашего положения/льгот. Мне положено 100%, все анкеты и заявления уже поданы. На данный жду момент жду ответа о рассмотрении заявки.

Хочу попросить у знающих людей совета, что лучше выбрать из фронтенда? На данный момент есть 4 варианта: Гикбрэйнс, Иннополис, Сбер, Скилбокс. У Скилбокса и Иннополиса выдают диплом о профессиональной переподготовке, но я не совсем уверен, что он мне нужен с двумя высшими техническими. (Хотя остальные вроде тоже выдают, как написано на Госуслугах, но я не уверен.)

Не так давно успешно прошёл курс на Юдеми по вёрстке. Хочу дальше развиваться в этом направлении, учить JavaScript со всеми вытекающими.

Заранее всем спасибо за советы.

Показать полностью

Без рейтинга Консультация IT Разработка Программист Javascript Нужен совет

30

20

skaynet25022022

3 года назад

Книжная лига

Обзор книги Стива Макконнелла «Совершенный код», про которую говорят "должен прочесть каждый разработчик"⁠⁠

Всем доброго времени суток!

Публикую рецензию подписчицы нашего телеграмм-канала t.me/it_begin на книгу "Совершенный код" от автора Стива Макконнелла

Стоит читать? Нет! Почему? Опишу в статье.

Начать, хотелось бы с того, что сообщество StackOverFlow признало книгу Стива Макконнелла "самой впечатляющей книгой, которую должен прочесть каждый разработчик программного обеспечения"

Обратимся к цитате из книги:

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

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

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

Кто целевая аудитория книги?

Это терпеливые, вдумчивые и целеустремленные люди, что имеют достаточно свободного времени.

Для начала, обратим внимание на объём нашей книги. 900 страниц!

Такой объём возможно напугает далеко не каждого и кто читает в среднем 30 страниц в день управится с книгой за месяц. но ...

1. Плотность информации, что изложена на страницах , очень велика,

2. Большое количество ссылок на сайты с дополнительным материалом, которые любезно оставил автор

3. В конце каждой главы - список рекомендуемой литературы

Много ли кода в книге?

Крайне не хватает настоящего кода и реальных задач, автор же ссылается на sourceforge.net , называя его лучшим сборником кода.

В наших реалиях это github и сайты с библиотеками для вашего языка программирования.

Имеет ли смысл читать книгу, если у меня нулевой опыт в программировании?

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

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

Есть ли альтернативы данной книге?

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

Авторы: Катрин Пассиг., Йоханнес Яндер. В чем-то эти книги перекликаются, но книга Стива намного сильнее углубляется в свою тему.

Основные принципы написания кода, изложенные в книге:

1. Никогда не следуйте требованиям, не вникая в них. - ибо требования устаревают и за трендами их развития так или иначе необходимо следить, а не просто делать так, потому что раньше всегда так делали.

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

3.Будь проще - твой код должен быть понятен и ясен каждому, комментарии должны быть как можно ближе к коду.

Если не можете что-то реализовать, не создавайте кучу переменных в одном методе и не держите их там, старайтесь избегать вложенных циклов и разных ветвлений

Делают ли годы программирования нас профессионалами?

Также в книге затрагивается вопрос того, что годы программирования, сами по себе, ни коем образом не характеризуют вас как отличного специалиста. Вы можете кодить 3-10-15 лет, но делать одно и тоже, не расти профессионально. По итогу, становиться лучше или же оставаться на том же уровне профессионализма - дело сугубо ваше. Как и интерес к чему-то новому, смотреть как работают другие и посмотреть на свою работу со стороны - то что поможет вам расти.

Полезна ли книга?

Из всей книги, лишь 3-5% имеют ценность. Заставляет задуматься хорошо глава о семантическом сопряжении. Глава про инструментарий также является по мне полезной. Пожалела я о потраченном времени на данную книги. Книга содержит много моментов из мотивационной литературы наподобие "Думай и Богатей", что дополнительно растягивает книгу и отнимает наше время. За этим ли мы пришли к её прочтению?

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

По мне, буду в здравом уме, прочитать эту книгу от корки до корки - невозможно.

Итог по книге:

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

Пройтись по диагонали и что-то подчеркнуть для себя - книга подойдет. Но вчитываться в неё, вникать в каждую деталь - смысла никого не имеет. Потратите только время и нервы.

Наш канал

Кому интересны программирование, изучение иностранных языков и кто просто любит развиваться

публикую также интересные статьи и интервью на телеграмм-канале IT-старт t.me/it_begin

Подписывайтесь ;)

Спасибо!

Показать полностью 2

[моё] Литература Современная литература Python IT Программирование Программист Математика Разработка Обучение Обзор книг Книги Рецензия Отрывок из книги Образование Учеба Чтение Длиннопост Java Javascript C++

13

21

NosefU

3 года назад

Расширение для создания заметок для пользователей⁠⁠

Всем привет!

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

Выглядит всё это добро вот так:

Расширение для создания заметок для пользователей Пикабу, Разработка, Javascript, Длиннопост

Серьёзный недостаток имеющихся на Пикабу заметок — для того, чтобы их посмотреть, приходится либо вызывать всплывающую панель профиля, либо переходить в сам профиль пользователя. Метки данного расширения всегда на виду, справа от никнейма, либо под ним.

Отображаются метки и в профиле, и в постах, и в комментариях. Если метки не влазят возле никнейма пользователя, то все они переносятся на следующую строку.

Добавление меток происходит в двух местах: на всплывающей панели профиля пользователя (которая появляется при наведении курсора на никнейм) и в самом профиле:

• выбрали цвет,

• ввели метку,

• нажали Enter, либо кнопку [+]

Чтобы удалить метку, достаточно навести на неё курсор и нажать иконку урны.

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

К сожалению, в данный момент опубликовать расширение в Chrome Web Store я не могу - нет возможности оплатить аккаунт разработчика. На это должна быть завязана возможность синхронизировать метки между браузерами, которые привязаны к одному гугл-аккаунту.

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

Всех остальных призываю оставлять в комментариях к посту отзывы, ошибки, проблемы.

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

Ну и ссылка на моё поделие для тех, кто хочет его пощупать: https://github.com/NosefU/pikabu_badges

Показать полностью 3

[моё] Пикабу Разработка Javascript Длиннопост

18

11

shaitan.vladimir

3 года назад

Web-технологии

Теги select и textarea в HTML5⁠⁠

Select

<select> - элемент содержащий меню опций <option> или меню групп опций <optgroup>. Имеет схожие с <input> атрибуты, а также атрибуты multiple и size. Обычно select располагается внутри тега <form> или связывается с ним атрибутом form.

<form action="">
<select name="some_list"></select>
</form>

<option> - тег, который используется для определения пункта списка внутри тега <select>, но также его можно встретить и в тегах. Атрибуты: selected - позволяет пред-выбрать элемент. disabled - работает как всегда. и другие.

<form action="">
<label for="select">Select item</label>
<select name="list" id="select">
<option value="item-1">Item #1</option>
<option value="item-2">Item #2</option>
<option value="item-3">Item #3</option>
<option value="item-4">Item #4</option>
</select>
</form>

<optgroup> - позволяет группировать опции внутри <select>. Имеет атрибуты - name и disabled. name - задает имя группы. disabled - исключает возможность выбора элементов из группы. label - Задает имя группы которое видно пользователю.

<form action="">
<label for="select2">Select item</label>
<select name="list" id="select2">
<optgroup label="Veggie">
<option value="item-1" selected>Mushrooms</option>
<option value="item-2">Carrot</option>
</optgroup>
<optgroup label="Meat" disabled>
<option value="item-3">Pork</option>
<option value="item-4">Chicken</option>
</optgroup>
</select>
</form>

Атрибут multiple тега <select> позволяет выбирать не один, а сразу несколько <option> если зажата клавиша CTRL (для windows или linux) или COMMAND (для macOS)

<form action="">
<label for="select3">Select item</label>
<select name="list" id="select3" multiple>
<optgroup label="Veggie">
<option value="item-1" selected>Mushrooms</option>
<option value="item-2">Carrot</option>
</optgroup>
<optgroup label="Meat" disabled>
<option value="item-3">Pork</option>
<option value="item-4">Chicken</option>
</optgroup>
</select>
</form>

Textarea

<textarea> - позволяет добавить поле для ввода большого количества текста, обычно располагается внутри тега <form>. Имеет атрибуты схожие с <input>, а также cols и rows.

cols - определяет ширину <textarea>

rows - определяет высоту <textarea>

<form action="">
<label for="message">Your massage</label>
<textarea
name="user_message"
id="message"
cols="30"
rows="10"
placeholder="Your message..."
></textarea>
</form>

У тега <textarea> нет атрибута value, а если вы ходите установить ему какое-то значение по-умолчанию, нужно писать его между открывающим и закрывающим тегами.

<form action="">
<label for="message2">Your massage</label>
<textarea
name="user_message"
id="message2"
cols="30"
rows="10"
placeholder="Your message..."
>Some predefined data goes here</textarea>
</form>

Файлы с урока

select

textarea

P.S. Подписывайся на мой youtube и telegram каналы чтобы получать больше контента )

Показать полностью