содержание
- предисловие
- концепция
- основы js
- Основы документа
- Интернет
- CSS
предисловие
Меня часто спрашивают, как стать начинающим, средним и продвинутым фронтендером. И я обнаружил, что знания большинства людей вокруг меня не очень систематизированы, и всегда будут различные лазейки в знаниях. Если вы все еще не знаете, как стать младшим инженером и есть ли лазейки в вашей системе знаний, вы можете обратиться к этому пункту знаний и соответствующему руководству, которое я составил.
Если в вашей системе знаний есть дыры, вам будет сложно интегрировать то, что вы узнали. У старшеклассников младших классов есть основная линия. Не сбивайтесь с пути.
пс: красным надо владеть, зеленым разбираться
1. Концепция
что такое джаваскрипт:zh.javascript.info/intro
Расширенные инструменты разработки: плагины иСинтаксис Эмметаwoohoo.brief.com/afraid/182ah67from32…
2. Базовые знания js
1. Данные
Переменнаяzh.javascript.info/variables
тип данныхzh.javascript.info/types
Тип номераzh.javascript.info/number
преобразование типовThis.JavaScript.info/type-co дочка…
Определение типаzh.javascript.info/instanceof
2. Операция
сравнение значенийzh.javascript.info/comparison
операторzh.javascript.info/operators
условный операторzh.javascript.info/ifelse
Логические операторыthis.JavaScript.info/logical-oh-quota…
Switch zh.javascript.info/switch
петля ES5zh.javascript.info/while-for
структура кодаzh.javascript.info/structure
3. Объект
объектzh.javascript.info/object
Преобразование примитивного значения объектаThis.JavaScript.info/object-top идет в…
Конструкторы и операторыThis.JavaScript.info/constructor…
Объектные клавиши, значения, элементыthis.JavaScript.info/arguably-values…
Object.prototype developer.Mozilla.org/this-cn/docs/…
4. Массив
множествоzh.javascript.info/array
метод массиваThis.JavaScript.info/array-met ho…
присваивание деструктуризацииURI структуры this.JavaScript.info/…
Array.prototype developer.Mozilla.org/this-cn/docs/…
5. JSON
6. Дата
Время и датаzh.javascript.info/date
7. функции
Введение в функциюThis.JavaScript.info/function-puts…
функциональный объектThis.JavaScript.info/function-OB…
new Function Woohoo.Yuque.com/Zhang Bao/Срочно…
рекурсия и стекzh.javascript.info/recursion
этот принципУууу. Руань Ифэн.com/blog/2018/0…
связывание функцийzh.javascript.info/bind
претензияzh.javascript.info/var
стрелочная функцияWoohoo.Yuque.com/Zhang Bao/Срочно…
Закрытиеzh.javascript.info/closure
расписаниеthis.JavaScript.info/set timeout-…
карриWoohoo.Yuque.com/Zhang Bao/Срочно…
8. Прототип
Введение в прототипыThis.JavaScript.info/prototype-no...
нативный прототипThis.JavaScript.info/native-pro T…
9. Наследование
наследоватьnuggets.capable/post/684490…
Наследование в ES3, 5, 6nuggets.capable/post/684490…
10. Класс
базовый синтаксис классаzh.javascript.info/class
наследование классовThis.JavaScript.info/class-in и R…
статические свойства и статические методыThis.JavaScript.info/static-prop…
11. Обработка ошибок
try catch zh.javascript.info/try-catch
12. Обещания, асинхронность/ожидание
Перезвонитеzh.javascript.info/callbacks
Promise Это .javascript.info / обещание- Барселона ...
Цепочка обещанийЗдесь.JavaScript.info/promise-check…
Обещание обработки ошибокthis.JavaScript.info/promise-duo…
PromiseAPI zh.javascript.info/promise-api
Async/await nuggets.capable/post/684490…
11. Модули
Профиль модуляThis.JavaScript.info/modules-int…
Импорт и экспортЭто.JavaScript.info/import-expo…
динамический импортздесь.JavaScript.info/modules - надеюсь вы...
12. Обычный
Регулярное использованиеThis.JavaScript.info/locals Тора Г…
3. Базовые знания документа
1. ДОМ
среда браузераThis.JavaScript.info/browser-Wicked Girl…
DOM-деревоzh.javascript.info/dom-nodes
DOM-узелThis.JavaScript.info/Дом-Тот В ИГА Т…
ДОМ получитьthis.JavaScript.info/searching-oh…
DOM-свойстваThis.JavaScript.info/BASIC-Dom-you…
DOM-методыЭто .javascript.info / изменение ...
стиль DOMthis.JavaScript.info/styles-stable-…
Размер элемента и прокруткаThis.JavaScript.info/Four-Principles-Stable-Generate…
This.JavaScript.info/Four-Principles-Stable-Generate…
2. События
события браузераThis.JavaScript.info/intro duct IO…
мобильное событиеnuggets.capable/post/684490…
прослушать событиеУ-у-у, беги, о, о, quilt.com/plus heat/met-oh…
всплывающее окно событиясегмент fault.com/ah/119000000…
делегация мероприятияThis.JavaScript.info/event-получил…
действие по умолчаниюThis.JavaScript.info/default-like о...
событие мышиThis.JavaScript.info/mouse-event…
мобильное событиеThis.JavaScript.info/mouse move-no...
событие перетаскиванияthis.JavaScript.info/mouse-drag-…
событие клавиатурыThis.JavaScript.info/keyboard-EV…
событие прокруткиzh.javascript.info/onscroll
Защита от тряски и дросселированияnuggets.capable/post/684490…(Не нужно смотреть третий выпуск)
4. Сеть
1. http
интернет-модельВууху. Руань Ифэн.com/blog/2012/0…
протокол ИнтернетаВууху. Руан Ифэн.com/blog/2016/0…
2. Хранение данных в браузере
Cookie zh.javascript.info/cookie
Локальное хранилище, хранилище сеансовThis.JavaScript.info/locals Тора Г…
3. запрос
XMLHttpRequest сегмент fault.com/ah/119000000…
Аксиос РейдерыПосмотрите на рантайм любви.GitHub.IO/2017/02/25/…
Официальные документы Axioswww.axios-js.com/zh-cn/docs/
5. CSS
1. Базовый CSS
Базовое руководство по CSSWoohoo. Я учусь в школе 3C. Talent/CSS/CSS-Totem…
css rgba Блог Woohoo.cn на.com/little-fat/afraid…
css единица измеренияblog.CSDN.net/geek Mubai/Ах…
2. Макет
концепция макетаву ву
практика компоновкисегмент fault.com/ah/119000001…
макет позиционирования呜呜 .cn Блог на .com / ry- Юань / Страх / 6 ...
гибкий макетУууу. Руан Ифэн.com/blog/2015/0…
запросы средств массовой информацииdeveloper.Mozilla.org/this-cn/docs/…
3. CSS-селектор
СелекторWoohoo. Я 3school.com. can/CSS ref/CSS_…
Псевдоклассы, псевдоэлементысегмент fault.com/ah/119000001…
4. Анимация
Transform Woohoo. Я 3school.com. can /CSS ref/ lie_he…
Transition nuggets.capable/post/684490…
Animation Woohoo.PHP.talent/CSS-репетитор IA…
5. css-переменные
css-переменнаяВууху. Руань Ифэн.com/blog/2017/0…
END
Это знание я использовал в Инкэ для программы обучения орлов. Я не буду публиковать соответствующие экзаменационные вопросы. Если кому-то это нужно, оставьте комментарий, а также. Конечно, вы также можете использовать его для внутреннего плана обучения вашей компании.Скоро будет выпущена система последующих промежуточных и продвинутых знаний.
Учебники, которые я обобщил, представляют собой несколько простых для понимания вариантов. Удобно всем учиться, а не официальный малопонятный документ.
следующий пост здесь