Код маминой подруги


Kanal geosi va tili: Rossiya, Ruscha


Фишки, заметки, интересные методы и функции Javascript в одном канале
Сотрудничество @m4ff1n

Bog‘liq kanallar

Kanal geosi va tili
Rossiya, Ruscha
Statistika
Postlar filtri


Добрый день подписчики, я вас давно забросил) Стало интересно, есть ли среди вас живые. Лайкните, если да 🙂‍↕️


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

Если хотите подтянуть язык для работы в IT — попробуйте Яндекс Практикум. Они запустили курсы специально для разработчиков, аналитиков и продакт-менеджеров.

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

Записывайтесь на бесплатную консультацию к куратору. Он определит ваш уровень языка и расскажет о курсе.


Отключение действия, выполняемого по щелчку правой кнопки мыши

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

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

#теория #js #фишки


Переменные let и const

Ключевые слова let и const дают более предсказуемые переменные, чем те, что объявлены через var.

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

let используется для переменных, которые нужно переназначить после создания. Переменные, объявленные с помощью const, невозможно переназначить или изменить.

#теория #js


Разделитель разрядов

Знаете что выведет код выше?
Думаете, что произойдет конкатенация и в консоль выведется «1_2322_000»? Или же выведет ошибку? На самом деле ответом будет являться число 2232, но почему?

Всё просто, символ "_" является разделителем для улучшения читабельности. Согласитесь, гораздо быстрее понять, что написано «один миллион», когда он выглядит так: 1_000_000, а не так: 1000000

#теория #js


Примеси

В JavaScript можно наследовать только от одного объекта. Объект имеет единственный `Prototype`. И класс может расширить только один другой класс.
Иногда это может ограничивать нас. Например, у нас есть класс StreetSweeper и класс Bicycle, а мы хотим создать их смесь: StreetSweepingBicycle.

Для таких случаев существуют «примеси».

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

Простейший способ реализовать примесь в JavaScript – это создать объект с полезными методами, которые затем могут быть легко добавлены в прототип любого класса.
В приведенном коде примесь sayHiMixin имеет методы, которые придают объектам класса User возможность вести разговор.

#классы


concat

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

arr.concat(arg1, arg2...)

Он принимает любое количество аргументов, которые могут быть как массивами, так и простыми значениями.
В результате мы получаем новый массив, включающий в себя элементы из arr, а также arg1, arg2 и так далее…

#массивы


arr.аt

Допустим, нам нужен последний элемент массива.
В некоторых языках программирования для этого можно использовать отрицательные индексы, например: fruits[-1].
Но в "жиес" такая запись не работает. Результатом будет undefined, тк индекс в квадратных скобках понимается буквально.
Можно явно вычислить индекс последнего элемента, а затем получить к нему доступ вот так: fruits[fruits.length - 1].
Но это слишком громоздко, да и мама в детстве запретила мне так делать, и сказала, чтобы я использовал arr.аt.

#массивы


Array.from

Что делать, если у компуктерщика есть список элементов, и он хочет применить к ним методы массивов?

Есть универсальный метод Array.from, который принимает итерируемый объект или псевдомассив и делает из него «настоящий» Array. После этого уже можно использовать методы массивов.

#массивы


Метод arr.splice(str)

  С помощью специального метода arr.splice можно не только удалять элементы массива, но и добавлять их.
  В приведенном коде мамин симпотяга с помощью данного метода убрал 3 элемента начиная с нулёвого и вместо написания диплома пошел катать мм.

#методы #массивы


Метод arr.splice(str)

Что делать, если потребуется удалить элемент из массива? Да, можно попробовать сделать это с помощью delete.
Но таким способом можно удалить только значение элемента (arr.length не изменится), но не сам элемент.

Поэтому нужно использовать специальные методы, например arr.splice.

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

#методы #массивы


Оператор расширения (...)

Допустим, что у нас есть встроенная функция Math.max. Она возвращает наибольшее число из списка.
И допустим, у нас есть массив чисел
[3, 5, 1]. Как вызвать для него Math.max?
Просто так их не вставишь — Math.max ожидает получить список чисел, а не один массив.

Конечно, мы можем вводить числа вручную : Math.max(arr[0], arr[1], arr[2]). Но это непрофессиАНАЛьно, и аргументов может быть очень много.

И тут нам поможет оператор расширения (...).
Если остаточные параметры (...) делают из аргументов массив, то тут все в точности наоборот.

Когда ...arr используется при вызове функции, он «расширяет» перебираемый объект arr в список аргументов.
Таким образом мамкины программисты могут передать несколько итерируемых объектов и даже комбинировать оператор расширения с обычными значениями.

#функции #операторы


Остаточные параметры (...)

Остаточные параметры могут быть обозначены через три точки .... Буквально это значит: «собери оставшиеся параметры и положи их в массив».

Мы можем положить первые несколько параметров в переменные, а остальные – собрать в массив.
В приведенном коде первые два аргумента функции станут именем и фамилией (Илон Маск), а третий и последующие превратятся в массив titles

#функции


Map

Map – это коллекция ключ/значение, как и Object. Но основное отличие в том, что Map позволяет использовать ключи любого типа.
Например Map может использовать объекты в качестве ключей.

Использование объектов в качестве ключей – одна из наиболее важных функций Map. Это то что невозможно для Object. Строка в качестве ключа в Object – это нормально, но мы не можем использовать другой Object в качестве ключа в Object.

#theory


Set

Объект Set – это особый вид коллекции: «множество» значений (без ключей), где каждое значение может появляться только один раз.

Основная «изюминка» – это то, что при повторных вызовах set.add() с одним и тем же значением ничего не происходит, за счёт этого как раз и получается, что каждое значение появляется один раз.

Например, мы ожидаем посетителей, и нам необходимо составить их список. Но повторные визиты не должны приводить к дубликатам. Каждый посетитель должен появиться в списке только один раз.

Множество Set – как раз то, что нужно для этого

Identifier 'mary' has already been declared

Если вы внесете дважды одно и то же значение то получите ошибку

#set #типы_данных


Объекты

▪️Может хранить множество значений как свойства.

▪️Объявляется при помощи фигурных скобок {}, например: {name: "Юрий", age: 30}. В JavaScript есть и другие виды объектов: например, функции тоже являются объектами.

Одна из лучших особенностей объектов – это то, что мы можем хранить функцию как одно из свойств объекта.

#объекты


Object.entries()

Данный метод возвращает массив собственных перечисляемых свойств указанного объекта в формате [key, value], в том же порядке, что и в цикле for...in (разница в том, что for-in перечисляет свойства из цепочки прототипов).

Порядок элементов в массиве который возвращается Object.entries() не зависит от того как объект объявлен.
Если существует необходимость в определённом порядке, то массив должен быть отсортирован до вызова метода, например 
Object.entries(obj).sort((a, b) => a[0] - b[0]);.

#методы


Object.entries()

Если у нас уже есть обычный объект, и мы хотели бы создать Map из него, то поможет встроенный метод Object.entries(obj), который получает объект и возвращает массив пар ключ-значение для него, как раз в этом формате.
Так что мы можем создать Map из обычного объекта

В коде Object.entries возвращает массив пар ключ-значение: [ ["name","John"], ["age", 30] ].
Это именно то, что нужно для создания Map.

#map


Ключевое слово «this»

Как правило, методу объекта обычно требуется доступ к информации, хранящейся в объекте, для выполнения своей работы.
Например, коду внутри user.sayHi() может потребоваться имя пользователя, которое хранится в объекте user.

Для доступа к информации внутри объекта метод может использовать ключевое слово this.
Значение this – это объект «перед точкой», который используется для вызова метода.

В данном примере во время выполнения кода user.sayHi() значением this будет являться user (ссылка на объект user).

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

Но если мы решим скопировать ссылку на объект user в другую переменную, например, admin = user, и перезапишем переменную user чем-то другим, тогда будет осуществлён доступ к неправильному объекту при вызове метода из admin.

#методы


Object.preventExtensions()

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

#объекты

20 ta oxirgi post ko‘rsatilgan.