JavaScript заметки
8.56K subscribers
2.75K photos
4 videos
1.27K links
Регулярные заметки по практическому JavaScript. Обучащию посты позволят прокачать навыки во Frontend-разработке.

Можно почитать пока компилируется проект :)

Сотрудничество: @noname_media

Канал на бирже: telega.in/channels/notesjs/card?r=Wj7h1mbl
Download Telegram
Примитивные типы данных

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

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

Когда мы сравниваем два значения, то у нас по сути произойдёт побайтовое сравнение этих величин.

#данные #const
Ссылочные типы данных

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

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

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

#данные #const
Мутации и неизменяемость

Изменение значений у полей объекта, добавление или удаление их отразится на всех, кто владеет ссылкой на этот объект. Такие операции называют мутациями. В современных веб-разработке мутаций стараются избегать, потому что мутирование объектов может приводить к ошибкам, которые очень трудно отследить. Однако если мы твердо уверены, что объект нигде более не используется или чётко контролируем ситуацию, то изменение объекта напрямую гораздо проще.

Если нужно безопасно модифицировать объект, то для начала придётся его скопировать. Скопировать объект можно двумя способами: через Object.assign() или используя спред-синтаксис .

#данные #const
👍3
Функция

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

Один из способов создания — просто объявить функцию в коде (по-английски Function Declaration).

#функции

Подробнее
Объявление функции

Объявление функции расшифровывается так:

1. В начале идёт ключевое слово function, чтобы заявить о наших намерениях объявить функцию;
2. Затем имя функции, чтобы можно было отличить одну функцию от другой (у нас лаконичное hello, но бывает лаконичное ничего...);
3. В круглых скобках мы указываем параметры (можно и без), которые передадим внутрь;
4. Наконец, тело функции — это код в фигурных скобках, который выполняется при её вызове.

#функции #alert

Подробнее
👍3
.findIndex()

Метод findIndex() возвращает индекс первого найденного в массиве элемента, который подходит под условие переданной функции. Если же ни одного подходящего элемента не найдётся, то метод вернёт -1.

Если вам нужно получить элемент, а не его индекс, то используйте метод find(). А если необходимо проверить наличие чего-либо в массиве, то сначала обратите внимание на метод includes().

#массив #findIndex

Подробнее
👍11
Параметры

При вызове функции можно передать данные, они будут использованы кодом внутри.

Например, функция showMessage принимает два параметра под названиями user и message, а потом соединяет их для целого сообщения. При вызове функции ей нужно передать аргументы. Функцию можно вызывать сколько угодно раз с любыми аргументами.

#функции #параметры
👍3
Параметры

При вызове функции можно передать данные, они будут использованы кодом внутри.

Например, функция showMessage принимает два параметра под названиями user и message, а потом соединяет их для целого сообщения. При вызове функции ей нужно передать аргументы. Функцию можно вызывать сколько угодно раз с любыми аргументами.

#функции #параметры
👍2
Функция и переменные

Переменные внутри функции существуют только внутри этой функции — этот эффект называется областью видимости.

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

#функции #переменные

Подробнее
👍2
Рекурсивные функции

Внутри функции можно вызывать её саму — это пример рекурсивной функции.

Если разложить пример, то получится следующая цепочка:

- fac(3) это 3 * fac(2);
- fac(2) это 2 * fac(1);
- fac(1) это 1.

Получается, что fac(3) это 3 * 2 * 1, то есть 6. Такой подход часто применяется в математических операциях, но не ограничивается ими.

#функции #рекурсия

Подробнее
👍5
Стрелочные функции

Стрелочная функция записывается намного короче, чем обычная. В самой простой записи ключевое слово function и фигурные скобки не требуются.

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

#функции #const

Подробнее
👍2
return

Функция возвращает результат, который будет передан в вызвавший её код. Для этого и используется ключевое слово return.

#функции #return

Подробнее
👍5
Рекурсия

Рекурсия — это что-то, что описывает само себя.

Представить рекурсию проще всего на примере зеркального коридора — когда напротив друг друга стоят два зеркала. Если посмотреть в одно, то в нём будет отражение второго, во втором — отражение первого и так далее.

#рекурсия

Подробнее
👍5
Массив

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

Массивы очень похожи на нумерованные списки.

#массив #const

Подробнее
👍3
.forEach()

Метод массива forEach() позволяет применить колбэк-функцию ко всем элементам массива. Можно использовать вместо классического цикла for. В отличие от него forEach() выглядит более читабельным и понятным.

#массив #forEach

Подробнее
👍4
.map()

Метод map() позволяет трансформировать один массив в другой при помощи функций-колбэка. Переданная функция будет вызвана для каждого элемента массива по порядку. Из результатов вызова функции будет собран новый массив.

#const #map #массив

Подробнее
👍9
.reduce()

Метод массива reduce() позволяет превратить массив в любое другое значение с помощью переданной функции-колбэка и начального значения. Функция-колбэк будет вызвана для каждого элемента массива, и всегда должна возвращать результат.

#массив #reduce

Подробнее
👍5
.filter()

Метод массива .filter() позволяет получить новый массив, отфильтровав элементы с помощью переданной колбэк-функции. Колбэк-функция будет вызвана для каждого элемента массива и по результату функции примет решение, включать этот элемент в новый массив или нет.

#массив #filter

Подробнее
👍1
.find()

Метод массива find() вернёт первый найденный в массиве элемент, который подходит под условие в переданной колбэк-функции. Если в массиве не найдётся ни одного подходящего элемента, то вернётся значение undefined.

#массив #find

Подробнее
👍7
.findIndex()

Метод findIndex() возвращает индекс первого найденного в массиве элемента, который подходит под условие переданной функции. Если же ни одного подходящего элемента не найдётся, то метод вернёт -1.

Если вам нужно получить элемент, а не его индекс, то используйте метод find(). А если необходимо проверить наличие чего-либо в массиве, то сначала обратите внимание на метод includes().

#массив #findIndex

Подробнее
👍62🔥1