Что я изучаю или пытаюсь внедрить в свою ежедневную кодинговую деятельность?
Я работаю над тем, чтобы понять, как и когда задавать вопросы в отношении расплывчатых подсказок. В профессиональной среде будет обязательно попросить разъяснений, потому что разбить проблему или решение на этапы кода, решение или продукт сложно создать.
Чтобы отработать этот навык, я трачу время на то, чтобы действительно сосредоточиться на подсказках или проблемах, которые нужно решить, разбивая их на шаги на простом английском языке, а затем помещая их в логические шаги кода. Это все еще продолжается, но чем больше я могу разбить логические шаги в «обычной речи», тем легче понять, как преобразовать ее в код.
Разница между == и === ?
«==» означает: объект подобен ожидаемому результату (например, x == 3). В этом примере x == 3, «x» может быть числом 3 или строковым элементом «3» — как это будет проходить через элемент ввода html в форме.
«===» означает: объект точно соответствует ожидаемому или желаемому результату (например, x === В этом случае x === 3 означает, что это должно быть число 3, а не строковый элемент «3» .
Один из способов представить это так: если вы сортируете электронную таблицу Excel, числа и текст могут быть перемешаны в зависимости от настроек или от того, кто вводит информацию. В этом сценарии, если мы хотим подобрать какие-либо числа, которые были случайно классифицированы или введены как текст («строковые элементы»), нам нужны двойные знаки равенства «==».
Знаки тройного равенства «===» — это абсолютное совпадение, тип данных и фактический символ (символы).
Каково значение foo в этой функции? "var foo = 10 + ‘20’;”
В этом сценарии foo буквально будет иметь значение или вывод «1020», потому что код читается как предложение.
«foo равно 10 и 20»
«+» означает и, он добавляет два объекта вместе. Поскольку в «20» нет пробела, в добавлении не будет пробела.
«» делает объект «20» строковым элементом, а не числом.
В зависимости от того, как объект 10 был сохранен или введен, он все равно может быть строкой. Например, входные значения в форме всегда каталогизируются как строковые значения. Несмотря на то, что есть опции, позволяющие сделать входные значения числами, они по-прежнему являются строковым элементом HTML.
«Числовой тип» означает, что если на мобильном устройстве появится цифровая клавиатура, она также предварительно заполняет параметры числовых символов, которые представляют собой целые числовые символы со стрелками вверх или вниз, чтобы числовые символы увеличивались или уменьшались (включая - 1…).
Что такое терминальное приложение?
Терминальное приложение — это локальный или удаленный терминал, где приложение или компонент можно проверить на функциональность без пользовательского интерфейса. Это может быть особенно полезно, если вы хотите протестировать серию функций, игру, приложение или этапы разработки внутреннего компонента/продукта, которые очень велики, и поэтому использование большой пропускной способности было бы менее эффективным.
Они также могут быть полезны для внутреннего организационного или крупномасштабного тестирования проектов в больших командах, если все в команде используют одно и то же терминальное приложение.
Вот несколько хороших ресурсов ниже:
https://spin.atomicobject.com/2016/01/11/command-line-interface-testing-tools/
Что такое тернарный оператор?
Тернарный оператор — это метод JavaScript для сокращения или ярлыка для «оператора if». Это может помочь очистить код. Формат выглядит простым, но в начале (где находятся мои практические уровни) для правильного написания может потребоваться немного подумать над логикой. Следует отметить, что они полезны, но не всегда необходимы. Важно помнить о чистоте кода. Если использование тернарных операторов предназначено для того, чтобы «выглядеть круто», а не для очистки кода, возможно, лучше вернуться и посмотреть на него свежим взглядом. Если использование тернарных операторов делает код более запутанным для будущего или коллеги-разработчика (или даже для вас самих через 1–2 недели), возможно, длинная рука лучше.
Из веб-документов MDN:
Условный (тернарный) оператор — это единственный оператор JavaScript, который принимает три операнда: условие, за которым следует вопросительный знак (?), затем выражение для выполнения, если условие «истинно, за которым следует двоеточие (:) и, наконец, выражение для выполнения, если условие ложно. Этот оператор часто используется как сокращение для оператора if.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator
Еще один хороший ресурс:
Каким образом можно обеспечить доступность и удобство дизайна вашего веб-сайта или веб-приложения?
Во-первых, для обеспечения доступности необходимо ознакомиться со стандартами и рекомендациями W3C/WAI. Затем использование контрольных списков проекта A11y во всем дизайне веб-сайта может помочь обеспечить доступный дизайн. Также важно проверять и перепроверять эти ресурсы, а также любые другие, которые вам нравятся, поскольку рекомендации и рекомендации для различных функций, элементов и т. д. могут меняться по мере обновления браузеров и адаптации языков кодирования и синтаксиса.
Также очень важно помнить на этапе проектирования, что только потому, что что-то соответствует всем критериям доступности контрольного списка (ов), это не приравнивается к удобному или интуитивно понятному взаимодействию с веб-сайтом или веб-приложением. Важно постоянно тестировать на стороне пользователя.
Я начинаю получать все больше и больше информации, заходя на веб-сайты, которые мне нравятся или которые имеют приятный дизайн, затем я выключаю коврик для мыши и пытаюсь перемещаться ТОЛЬКО с помощью клавиатуры. Или я попытаюсь перемещаться по веб-сайтам, используя программу чтения с экрана и надевая маску для сна.
Это два очень быстрых способа, которыми я могу проверить доступный и интуитивно понятный дизайн как зрячий человек. Это не означает, что я делаю идеально доступные, красивые и интуитивно понятные веб-сайты, но это полезный опыт обучения, который позволяет мне быть скромным и учиться с нуля, чтобы стать солидным инженером по доступности (в некоторой степени).
Также важно учитывать на этапе проектирования такие вопросы, как предупреждения о срабатывании мигающих изображений или видео для отдельных лиц, чувствительных к чрезмерной стимуляции или внезапным вспышкам света (например, эпилепсия, некоторые виды аутизма), и предоставлять возможность не воспроизводить анимацию или видео.
Другой проблемой является размер шрифта и цветовой контраст, необходимые для людей с разными типами дальтонизма и тех, кому нужен более крупный текст.
Некоторые из моих ресурсов:
https://www.w3.org/WAI/standards-guidelines/aria/
https://www.a11yproject.com/checklist/#toc_Does-this-checklist-guarantee-my-site-is-accessible-
https://css-tricks.com/improving-accessibility-24-ways/
Ресурсы по удобному дизайну:
https://careerfoundry.com/en/blog/ui-design/8-sites-with-great-ui/
https://www.commonplaces.com/blog/10-tips-for-building-a-user-friendly-website/
Какие функции HTML5 мне нравятся больше всего и как вы реализовали их в моих проектах по разработке интерфейса?
Мне нравится использовать слайд-шоу, так как это динамичный и интерактивный способ демонстрации нескольких изображений, видео, текстовой информации и т. д. Но у него также есть хорошая документация, которая делает его доступным для клавиатуры и чтения с экрана. Он может оживить страницу, не перегружая пользователя, и может вписаться практически в любую тему или цветовую схему дизайна.
Я также работал над использованием переключателей ввода, скрытых за изображениями. Однако хитрость заключается в том, чтобы сохранить их родную доступность. Хитрость заключается в том, что вместо использования «position: hidden» вы меняете ширину, непрозрачность и высоту и размещаете их за изображением, тем самым изменяя стиль и НЕ скрывая его от программы чтения с экрана, сохраняя нативную навигацию с помощью клавиатуры. Затем вы совместно стилизуете кнопку и изображение для позиционирования и фокусировки.
Полное объяснение здесь: https://stackoverflow.com/questions/17541614/use-images-instead-of-radio-buttons/17541916
Как я структурирую ваши CSS и JavaScript, чтобы другим разработчикам было проще работать с ними
Я использую комментарии, чтобы упорядочить файлы CSS. Если это особенно длинный файл, я пытаюсь сделать оглавление для порядка стилей — я использую комментарии в качестве подразделов или оглавление, чтобы помочь разработчику понять, где что-то найти.
В JavaScript я работаю над созданием хороших привычек для именования функций. Если это кнопка onclick, то полезно иметь «Click» в конце функции. Это помогает быстро узнать, вызывается ли он нажатием кнопки или запускается сам по себе, а не на основе прослушивателя событий. Также полезно поместить какую-либо метку, если она загружается в окно.
Когда я работаю с файлами JavaScript и работаю с несколькими функциями, я буду закомментировать функции, которые не сработали, чтобы я мог проследить свою логику, и если я обнаружу, что мне нужна часть этого кода, то он тут же. Я всегда использую заголовки комментариев, чтобы отметить, что сработало или почему мое логическое мышление для приложения было правильным. Это полезно ТОЛЬКО для личных проектов или для задания на буткемпе, так как в профессиональных или групповых условиях эти комментарии могут раздражать другого разработчика, если они не используют редактор, такой как VS Code, где вы можете свести к минимуму многострочные комментарии. Мне также может быть сложнее читать репозиторий github, требующий от разработчика разветвления / клонирования репозитория, чтобы извлечь код.
Каков мой процесс решения проблем с отображением в браузере? Считаете ли вы, что с одним браузером работать сложнее, чем с другими?
Это, безусловно, большая часть моей «незавершенной работы»…
Когда я работаю над специфическими для браузера проблемами рендеринга, обычно требуется небольшое исследование, чтобы выяснить, нужно ли мне добавлять метатеги в ‹head› HTML, а также немало тестов и поиска в Google и StackOverflow.
Моя самая большая проблема — возможность тестирования в Safari. Для этого мне нужно позаимствовать продукты Apple, поскольку Apple не обновляет Safari для операционной системы Windows…
Кроме того, необходимо создать процедуру тестирования для проверки кросс-браузерной совместимости.
Я надеюсь, что эти небольшие советы/рекомендации помогут всем, кто учится программировать или готовится к захватывающему интервью!
Ваш друг в коде,
Рэйчел
