17+ тем, 5+ шпаргалок, 3+ часа работы

Чтобы начать использовать JavaScript, вам нужен только этот блог.

Что такое JavaScript

JavaScript — мультипарадигмальный, динамичный, высокоуровневый язык со свободной типизацией.

Мы используем JavaScript для создания:

  • Веб-сайты
  • Мобильные приложения
  • Веб-приложения
  • Серверные приложения, использующие Node.js
  • Приложения для умных часов

Давайте теперь рассмотрим все важные концепции JavaScript, одну за другой.

1. Переменная

Переменная — это значение, присвоенное идентификатору, поэтому вы можете ссылаться на него и использовать его позже в программе.

Мы используем следующие ключевые слова для объявления переменных:

let

const

var

2. Типы

Тип определяет тип данных конкретной переменной или метода.

Два основных типа типов в JavaScript:

• Примитивные типы

• типы объектов

Примитивные типы — это числа, строки или логические значения.

Типы объектов — это либо числа, либо строки, либо логические значения (если они определены с помощью нового ключевого слова).

3. Операторы

В JavaScript оператор — это специальный символ, используемый для выполнения операций над операндами (значениями и переменными).

Операторы, присутствующие в JavaScript:

• Дополнение +

• Вычитание -

• Умножение *

• Разделение /

• модуль %

• Экспоненциальный **

Операторы сравнения

<, >, <=, >=, ==, ===, !==

4. Условные операторы

Условные операторы управляют поведением в JavaScript и определяют, могут ли выполняться фрагменты кода.

if(true){ condition}

Петли

While loop: while(true){}
For Loop: for(s1,s2,s3){//statements}
Do while: do{}while(true)

5. Полная шпаргалка цикла

6. Массивы

Массив — это набор похожих элементов данных, хранящихся в смежных ячейках памяти.

const array=[1,2,3]

Операции с массивами

push() : Add to array
pop() : remove from array
concat() : join 2 arrays

7. Подъем

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

8. Функции

строки кода для выполнения конкретной задачи.

Функция в JavaScript похожа на процедуру — набор операторов, которые выполняют задачу или вычисляют значение, — но для того, чтобы процедуру можно было квалифицировать как функцию, она должна принимать некоторые входные данные и возвращать выходные данные, где существует некоторая очевидная связь между ввод и вывод (согласно документам MDN).

9. Стрелочные функции

Они позволяют вам писать функции с более коротким синтаксисом.

10. Полная шпаргалка по функциям

11. Объем

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

В JavaScript у нас есть 3 типа областей видимости:

Глобальная область. На переменные и выражения можно ссылаться в любом месте глобальной области. Это область действия по умолчанию.

Локальная область: на переменные и выражения можно ссылаться только в пределах границ.

12. Объекты

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

13. Классы

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

Классы — это шаблон для создания объектов.

14. Обратные вызовы

Обратный вызов — это функция, которая передается в качестве аргумента другой функции, и ее выполнение откладывается до тех пор, пока не будет выполнена та функция, которой она передана.

15. Обещания

Обещание — это объект, который потенциально может выдать только одно значение в будущем: либо разрешенное значение, либо объяснение, почему оно не может быть разрешено (например, сетевая ошибка).

У обещания есть три возможных состояния: выполнено, отклонено или ожидает выполнения.

16. Асинхронный JavaScript

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

17. Закрытие

Это функция JavaScript, при которой внутренняя функция имеет доступ к переменным внешней функции.

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

function grandparent() {
    let car="BMW"
    var parent = function () {
        let house="4BHK"
        var child = function () {
            return ("The child gets " + car + " and " + house);
        };
        return child;
    };
    return parent;
}

console.log( grandparent()()()) //The Child gets BMW and 4BHK house

Завершение

Это странный язык, JavaScript. Но когда вы присматриваетесь, вы обычно понимаете, почему все работает именно так.

Я искренне надеюсь, что этот список поможет вам понять некоторые важные концепции JavaScript, которые вы должны знать, и если вы знаете какие-либо дополнительные концепции, заслуживающие внимания, пожалуйста, укажите их в разделе комментариев :)

Ознакомьтесь с этой электронной книгой, чтобы получить полное Руководство по CSS Flexbox.

На создание этого руководства ушло несколько часов, при этом использовались ссылки на несколько ресурсов. Если вы найдете это руководство полезным, поделитесь и распространите информацию

Следуйте за мной, Adarsh ​​gupta на Medium, а также в Twitter (@Adarsh____gupta).

Если хочешь, можешь поддержать меня, купив мне чай.

Станьте компонуемым: создавайте приложения быстрее, как Lego

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

Подробнее

Создавайте приложения, страницы, пользовательский опыт и пользовательские интерфейсы как автономные компоненты. Используйте их, чтобы быстрее создавать новые приложения и возможности. Используйте любой фреймворк и инструмент в своем рабочем процессе. Делитесь, повторно используйте и сотрудничайте, чтобы строить вместе.

Помогите своей команде:

Микроинтерфейсы

Дизайн-системы

Совместное использование кода и повторное использование

Монорепо

Узнать больше