Этот блог дает представление о нескольких важных концепциях JavaScript с демонстрационными программами. Эти концепции полезны даже для взлома интервью.

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

1. let vs var vs const:

До появления ES6 только «var» помогала объявлять переменные в коде. После эры ES6 на сцену вышли два новых ключевых слова «let» и «const». Одно важное различие между var, let и const заключается в том, что «var имеет область видимости функции или глобальную, тогда как let и const являются блочными». Давайте четко разберемся, что такое объемы блоков и функций.

Здесь мы объявили функцию с именем «vars». Внутри мы инициализировали три переменные: одну с var, одну с let и другую с const. Поскольку «var» является областью действия функции, отображение «a» на консоли дает справочную ошибку, поскольку «a» неизвестно вне функции. Теперь давайте посмотрим на область видимости блока.

Это похоже на приведенный выше код, но единственное изменение состоит в том, что мы объявляем «блок if», а не функцию. Как упоминалось ранее, «var содержит функцию или глобальную область видимости», поэтому значение «a» известно за пределами блока if, и поэтому отображается 10, но как насчет let и const?

Они блочные. Блок - это тот, который заключен в фигурные скобки {}. Таким образом, вне блока компилятор не знает о переменных let и const, поэтому мы получаем «ошибку ссылки», говорящую, что переменная не определена.

Итак, это единственная разница между var, let и const? Нет!!

Другое отличие состоит в том, что переменные, объявленные с помощью «var» и «let», можно переназначить, но переменные, объявленные с помощью «const», переназначить нельзя.

Наконец, переменные let имеют область видимости блока и могут быть переназначены, переменные const имеют область видимости блока, но не могут быть переназначены. «Var» использовалось до эры ES6, но теперь большинство разработчиков перешли на «let и const». Так что следите за этими двумя ключевыми словами.

2. === vs == :

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

Здесь переменная «a» хранит строку 10, а b хранит целочисленное значение 10. Первый набор операторов console.log сравнивает одни и те же операнды и их типы. Таким образом, как абстрактные, так и строгие равенства дают на выходе «истину».

Во втором наборе сравнений console.log сравниваются строковый и целочисленный типы с одинаковым содержимым. Таким образом, прямое строгое сравнение (===) дает на выходе «false», потому что типы различны, но в случае абстрактного сравнения происходит преобразование типов, и, поскольку содержимое одинаково (10 == 10), оно возвращает true.

Поэтому настоятельно рекомендуется предпочесть «СТРОГОЕ СРАВНЕНИЕ».

3. Math.min () и Math.max ():

Математические функции в основном используются для решения математических задач. Итак, что особенного в функциях min и max?

давайте разберемся с напряжением.

что вы ожидали получить от Math.min () ??

а с Math.max ()?

Когда я был новичком в JavaScript, я ожидал, что результаты будут -Infinity для Math.min () и Infinity для Math.max (). Но я заметил обратный результат.

Вы тоже так думали?

Да!! Math.min () возвращает «Infinity», а Math.max () возвращает «-Infinity». Это потому, что функция min () по умолчанию считает максимальное значение. Когда мы даем входные данные для поиска минимального значения, такого как Math.min (2,1), он сначала сравнивает 2 с бесконечностью, предполагает, что 2 меньше, а затем 2 с 1 и предполагает, что 1 меньше, и, наконец, возвращает 1. Это похоже на случай Math.max (). По умолчанию предполагается минимальное значение, например «-Бесконечность».

4. прервать работу с forEach ():

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

Итак, что мы сделали в программе?

мы написали forEach для печати элементов в массиве «a» и задали условие, говорящее, что если есть какой-либо элемент массива «2», остановить процесс. Это обычная итерация с условием. Теперь в чем причина ошибки ссылки?

Нет другого способа остановить или прервать цикл forEach (), кроме как выбросить исключение. Если вам нужно такое поведение, метод forEach () - неподходящий инструмент. (SRC - MDN).

Итак, как мы видели, метод forEach () не останавливается, когда мы помещаем оператор break, но мы с силой пытаемся его сломать, что выходит за рамки языковых правил. Поэтому он вызывает ошибку ссылки, говоря о недопустимом операторе прерывания.

5. Подъем:

JavaScript демонстрирует странное поведение при работе с переменными и их объявлениями. Объявления переменных поднимаются в верхнюю часть кода. Это поведение JavaScript по умолчанию. Итак, где бы вы ни объявляли переменные во всей программе, этот подъем по умолчанию позволяет вам предполагать, что переменные объявлены сверху. Подъем в основном наблюдается в скриптах, где мы используем ключевое слово «var».

Здесь мы напечатали на консоли, а затем объявили его. Таким образом, без подъема должна быть ошибка, указывающая на то, что переменная неизвестна. Но когда на картинке появляется подъем, «строка № 2» поднимается вверх, а затем оператор console.log (..) выводит значение undefined. Поскольку подъем не работает с ключевыми словами let и const, они не поднимаются наверх, и возникает ошибка ссылки.

Здесь следует отметить, что «поднимаются только объявления переменных JavaScript, а не инициализации». Вот почему мы получили «undefined» на консоли, а не «10», когда мы попытались отобразить «var a». Поэтому при использовании ключевого слова var рекомендуется объявлять переменные в верхней части области видимости.

6. Оператор распространения (…):

Синтаксис оператора Spread - это три точки (…), за которыми следует массив или итерация. Синтаксис Spread представлен в ES6 в JavaScript. Давайте четко разберемся с использованием оператора спреда с несколькими вариантами использования.

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

7. Объявление функции и выражение функции:

В чем разница между объявлением функции и выражением?

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

Этот код изображает объявление функции. Функция объявляется с именем «func1» и имеет оператор console.log (). Есть вызовы функций заявленной функции. Теперь давайте посмотрим на выражение функции.

Приведенный выше пример касается выражения функции. Итак, что является ключевым, что отличает декларацию от выражения?

Объявление функции глобально видно в скрипте, где бы оно ни было создано. Но выражение функции создается только тогда, когда выполнение достигает этой строки и после этого становится видимым. Таким образом, во втором скрипте возникает ошибка, так как func2 вызывается перед созданием и поскольку элемент управления не знает func2.

Одна вещь, в которой выражения функций полезны, заключается в том, что в строгом режиме объявления функций видны повсюду только внутри блока. Если мы пытаемся вызвать ту же функцию вне блока, возникает ошибка ссылки. Поэтому, если мы создаем переменную в верхней части скрипта, мы можем использовать ее во всей программе, создавая выражения и заставляя ее работать и за пределами блока. Выражения функций позволяют нам назначать функцию и другой переменной. Теперь мы можем назначить func2 другой переменной и использовать ее для запуска этой функции, как показано
let dup = func2 ()
dup ()

8. Интерполяция строк:

В JavaScript литералы шаблона представлены с помощью обратных кавычек (``). Это позволяет использовать функцию интерполяции строк. Давайте разберемся, что на самом деле это за функция. Литералы шаблона поддерживают заполнители. Синтаксис заполнителей: $ {выражение}. Теперь замена этих заполнителей значениями его выражения называется строковой интерполяцией. Давайте разберемся с этим на примере.

В первом операторе консоли значение a заменяется на «Hello», а затем печатается «Hello World». Во втором случае значение n1 заменяется, а затем оно неявно преобразуется в строку и аналогично с n2, а затем вычисляется n1 + n2, результат преобразуется в строку, и окончательный результат «Сумма 2 и 3 равна 5 ”отображается на консоли. Точно так же и третий случай.

Интерполяция строк полезна, когда есть конкатенация строк для создания длинных строк в операторах console.log.

9. Поверните массив:

Вращение элементов массива может быть выполнено с использованием наиболее распространенных методов массива push (), pop (), shift (), unshift (). Методы push () и pop () используются для добавления и удаления элементов в конце массива, тогда как unshift () и shift () в начале. Массивы можно вращать в двух направлениях: по и против часовой стрелки. Приведенный ниже код показывает это. Давай посмотрим.

Здесь мы объявили массив «a» и дали значение «p», которое говорит, сколько элементов нужно повернуть. Во-первых, если мы посмотрим на вращение по часовой стрелке, мы должны удалить элементы в конце массива и добавить их в начало. Поэтому для этого мы можем выталкивать элементы, а затем отменять их сдвиг (добавлять в начале). Итак, мы проделали этот процесс «p» несколько раз. То же самое и в случае вращения против часовой стрелки - сдвиньте элементы, а затем толкните их.

Итак, если мы повернем массив [1,2,3,4,5] по часовой стрелке три раза, мы получим [3,4,5,1,2], и, повернув его два раза против часовой стрелки, мы получим [5, 1,2,3,4].

10. Переверните строку:

Переворачивание строки - наиболее часто используемый вариант использования при решении проблем, связанных со строкой. Как мы можем перевернуть строки в JavaScript? Давайте посмотрим на код.

Здесь в первом методе мы использовали три встроенных метода split (), reverse () и join (). Сначала мы разделяем строку на символы с помощью split (), затем меняем список символов с помощью функции reverse () и объединяем символы, чтобы снова сформировать строку с помощью join ().

Даже второй метод такой же, как и первый, но с той лишь разницей, что мы конвертируем строку в массив символов, используя синтаксис распространения ES6.

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

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

Спасибо !!