Работа this

this является ключевым словом, что является ссылкой на контекст вызова функции, который определяется прямо во время исполнения, а потому значение this зависит исключительно от его места в коде. Для определения this к месту вызова функции применяются следующие правила:

1. Связывание с new. При вызове функции с new this будет указывать на создаваемый функцией объект.
2. Явное связывание. При вызове с call, bind или apply, this укажет на переданный в качестве аргумента объект.
3. Неявное связывание. При вызове с контекстным объектом this укажет на него.
4. Связывание по умолчанию. Если ни одно из других правил не вступает в силу, this станет ссылкой на глобальный объект, или примет значение undefined в строгом режиме.

Распространенной проблемой является т.н. "потеря this", что является следствием вызова функции без её контекстного объекта, а потому срабатывает связывание по умолчанию. Для предотвращения этой проблемы используется явное связывание.

Полезные ссылки:
learnjs

#концепция #this

Функции

Все функции в JS являются вызываемыми объектами - блоками кода, что можно вызывать сколько-угодно раз. Функции обладают параметрами, которым при вызове можно присвоить значения (аргументы), значением return и контекстом вызова (значение this).
Поскольку функции являются объектами им можно присваивать свойства и методы, присваивать их переменным и передавать другим функциям в качестве аргументов.
Помимо обычных функций выделяют несколько разновидностей функций:

1. Функции-конструкторы - используются для инициализации объектов
2. Стрелочные функции - обладают коротким синтаксисом и наследуют this
3. Анонимные функции - не имеют имени-идентификатора (но могут его получить при присвоении переменной)
4. Генераторы - итерируемые функции, выполнение которых можно произвольно останавливать и возобновлять

Полезные ссылки:
learnjs

#концепция #функции

Классы и подклассы

Класс в JS это набор объектов, с одинаковым прототипом, потому работа с классами сводится к работе с прототипами: ручное указаное прототипа Object.create(), создание функции-конструктора или класса с помощью class. Три способа мало отличаются, а потому взаимозаменяемы.
Предпочтительно использование class из-за его большей наглядности и своих особенностей:
- Всё в теле class выполняется в строгом режиме
- Объявленние класса не подымается (в отличии от функций-конструкторов)
- static перед функцией в классе создаст функцию, что будет методом самого класса, а не его прототипа
- Блок constructor является аналогом функции-конструктора для инициализации объекта

Подклассом является набор объектов, протип которого в качестве прототипа имеет другой прототип и наследует методы и свойства другого класса.
- Для создания подкласса с class используется extends
- super позволяет использовать constructor класса в подклассе

Полезные ссылки:
learnjs

#концепция #классы

"Блокировка" объектов JS

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

Метод Object.seal() запечатывает объект, предотвращая добавление новых свойств к объекту и делая все существующие свойства не настраиваемыми. Значения представленных свойств всё ещё могут изменяться, поскольку они остаются записываемыми.

Метод Object.preventExtensions() предотвращает добавление новых свойств к объекту (то есть, предотвращает расширение этого объекта в будущем).

Метод Object.freeze() замораживает объект: это значит, что он предотвращает добавление новых свойств к объекту, удаление старых свойств из объекта и изменение существующих свойств или значения их атрибутов перечисляемости, настраиваемости и записываемости. В сущности, объект становится эффективно неизменным. Метод возвращает замороженный объект.

Полезная ссылка

#концепция #объект

var имеет область видимости, ограниченную функцией, и поднимается в начало области видимости с инициализацией undefined, позволяя повторное объявление и изменение.

let ограничен блоком {...} и поднимается без инициализации, создавая временную мертвую зону до его объявления; можно изменять, но не объявлять повторно в одной области видимости.

const работает как let по области видимости и поднятию, но запрещает изменение и повторное объявление; содержимое объектов и массивов, объявленных через const , можно изменять. Использование var в современном JavaScript считается устаревшим из-за его менее строгих ограничений по области видимости и поднятию переменных. let и const предпочтительнее за счет более четкой и предсказуемой области видимости и поведения.

Learnjs - старая ссылка - по моему мнению тут классная задача про Армию функций, по началу может сломать мозг но рекомендую разобраться
Learnjs - новая ссылка

ищи по #scope предыдущий пост про области видимости

Переменные

Что будет выведено в консоль?
Задача выше, ответ тыкайте в опросе ниже👇

#задача #переменные

if/else и switch в JS - основные средства ветвления логики. if/else применяется для выполнения кода в зависимости от условия: проверяется условие в if, выполняется код внутри блока, либо код в блоке else. Он подходит для простых и сложных условных цепочек с else if.

switch удобен для сравнения одной переменной с множеством значений. Он последовательно проверяет case-блоки: если значение переменной совпадает, выполняется соответствующий код. Часто используется для замены множества if/else, улучшая читаемость и отладку кода.

Важно помнить, что switch использует строгое сравнение (===) и требует break для предотвращения последующих блоков.

Выбор между ними зависит от сложности условий: if/else - для более сложных логических условий, switch - для проверки одной переменной на равенство с разными значениями. Оба способа улучшают читаемость и эффективность кода при правильном использовании.

Задача: Выбор правильного условного оператора

У вас есть функция, которая получает в качестве аргумента целое число. В зависимости от значения числа, функция должна возвращать разные строки. Вот условия:

Если число делится на 3, функция возвращает "Fizz".
Если число делится на 5, функция возвращает "Buzz".
Если число делится и на 3, и на 5, функция возвращает "FizzBuzz".
Во всех остальных случаях функция возвращает само число в виде строки.
Какую структуру условного ветвления вы бы использовали для реализации этой функции?
Ответить можно в опросе ниже 👇

Тернарный оператор в JS - это удобный инструмент для выполнения условных операций в одну строку. Его структура
условие ? выражение1 : выражение2
позволяет с легкостью заменить простые конструкции if/else.
Однако, при его использовании важно помнить о читаемости кода. В сложных условиях или при использовании вложенных тернарных операторов код может стать трудночитаемым. Поэтому важно уметь оценивать, когда его применение уместно, а когда лучше прибегнуть к более традиционным конструкциям if/else.

Каковы будут последствия выполнения этого кода?
Варианты ответов в опросе ниже 👇

Рассмотрим четыре основных оператора: ??, &&, ||, !.

Оператор ?? (Nullish Coalescing) возвращает правый операнд, если левый равен null или undefined; полезен для установки значений по умолчанию и избегания проблем с ложно-отрицательными значениями.

Оператор && (Логическое И) возвращает первое "ложное" значение или последнее "истинное"; применяется для проверки условий перед выполнением блока кода и сокращения условных выражений.

Оператор || (Логическое ИЛИ) возвращает первое "истинное" значение, идеален для задания значений по умолчанию, избегая ошибок с неопределенными или нулевыми значениями.

Оператор ! (Логическое НЕ) инвертирует булево значение операнда, применяется для инвертирования логических условий в условных конструкциях и проверках.

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

Задача

Этот код использует комбинацию операторов ?., ||, && и ??. Вам нужно определить, что будет выведено в консоль.

Отвечай в опросе ниже 👇

Операторы присваивания в JavaScript играют важную роль в управлении данными и значительно облегчают разработку кода. Основной оператор присваивания - =, который используется для назначения значений переменным. Кроме этого, существуют сочетания операторов присваивания с другими операциями, такими как +=, -=, *=, /=, и %=, которые упрощают математические операции.

+= добавляет и присваивает значение, например, a += 5 эквивалентно a = a + 5.

=, =, и /= работают аналогично для вычитания, умножения и деления соответственно.

%= выполняет операцию деления по модулю и присваивает остаток, например, a %= 3 это то же самое, что a = a % 3.

Также есть операторы <<=, >>=, и >>>= для битовых операций сдвига и &=, |=, и ^= для битовых операций И, ИЛИ и исключающее ИЛИ.

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

Задача: Использование операторов присваивания
Что будет выведено в консоль?
Ответ в опросник ниже 👇