В чем разница между глобальными и локальными переменными в JavaScript?

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

Введение

Краткий обзор темы

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

Объяснение важности понимания разницы между глобальными и локальными переменными в JavaScript

Очень важно понимать разницу между глобальными и локальными переменными в JavaScript. Поскольку вы, как программист, должны решить, где ваши переменные могут быть доступны, а где нет, в игру вступают локальные и глобальные переменные.

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

Определение глобальных переменных

Объяснение того, что такое глобальная переменная

Глобальная переменная в JavaScript — это переменная, к которой можно получить доступ из любой точки нашей программы. Это означает, что у них нет никаких ограничений по сравнению с локальными переменными. Или переменные, которые объявлены вне каких-либо блоков, таких как циклы if-else, for-while, функции и т. д., известные как глобальные переменные.

Как глобальные переменные определяются и доступны в JavaScript

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

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

const variableGlobal = "Amol Shelke";
console.log(variableGlobal);
Code language: JavaScript (javascript)

Примеры глобальных переменных и варианты их использования

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

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

const name = "AMOL SHLEKE";
const userAge = 19;
if (userAge < 18) {
  console.log(`Hey There ${name} I hope you are doing well`);
} else if (userAge === 18) {
  console.log(`Hey there ${name} congratulations on being 18`);
} else {
  console.log(`${name} you are not teen anymore🥲`);
}
Code language: JavaScript (javascript)

Определение локальных переменных

Объяснение того, что такое локальная переменная

Локальная переменная в JavaScript — это переменная, которая ограничена блоком, в котором она была объявлена, что означает, что мы не можем получить доступ к этой переменной за пределами блока, в котором она была инициализирована. Примером локальной переменной является переменная, объявленная внутри функции, блока if-else, цикла while/for-loop и т. д.

Как локальные переменные определяются и доступны в JavaScript

Чтобы определить локальную переменную в JavaScript, мы можем использовать ключевые слова var, let и const. Локальная переменная в JavaScript может быть определена в блоке, таком как функция и если-иначе. Ниже приведен пример локальной переменной, созданной внутри функции в JavaScript.

const localVarExample = () => {
  var nameLocal = "Amol Shelke"; // nameLocal is the local variable here
}
Code language: JavaScript (javascript)

Примеры локальных переменных и варианты их использования

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

Пример с вариантами использования.

function makePizza() {
 const foodIngredients = "Cheeze, meonies, vegies and flour";
 return `Your pizza is ready with ${foodIngredients} `;
}
console.log(makePizza());
Code language: JavaScript (javascript)

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

Различия между глобальными и локальными переменными

Сравнение объема, доступности и продолжительности жизни глобальных и локальных переменных

VariablesScopeAccessibilityLifespanГлобальные переменные. Область действия глобальных переменных имеет глобальную область действия, поскольку к ним можно получить доступ в любом месте программы. По сравнению с локальными переменными. Доступ к глобальным переменным можно получить в любом месте программы, в которой они были определены. Можно использовать var, let и const для объявления глобальных переменных. Срок жизни глобальных переменных - до завершения выполнения программы, что означает, что до тех пор, пока веб-приложение не будет открыто в браузере, глобальные переменные не будут работать. Локальные переменные. Область действия локальных переменных имеет локальную область действия, поскольку доступ к ним невозможен в любом месте программы. По сравнению с глобальными переменными. К локальным переменным нельзя получить доступ где бы то ни было в программе, к ним можно получить доступ только внутри функции/блока, в котором они были определены. Можно использовать var, let и const для объявления глобальных переменных. Срок жизни локальных переменных - до выполнения функции, как только выполнение функции будет выполнено, локальная переменная исчезнет. Сравнение локальных и глобальных переменных.

Объяснение того, как эти различия влияют на то, как переменные используются в JavaScript.

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

Советы по выбору подходящего типа переменной для данной ситуации

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

Предложения по избежанию распространенных ошибок и ловушек при использовании глобальных и локальных переменных

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

Заключение

Краткое изложение основных моментов, освещенных в блоге

Вот и все, что касается этой статьи, мы рассмотрели все о локальных и глобальных переменных JavaScript, начиная с определения и заканчивая советами по их использованию в программе. Я надеюсь, что вы нашли эту статью полезной. Локальные и глобальные переменные JavaScript — это действительно важные темы, которые многие новые разработчики не смогли изучить. Ниже приведены некоторые из моих любимых ресурсов, которые я использовал для изучения JavaScript с нуля. Я надеюсь, что это поможет и вам.

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

Чтобы узнать больше о глобальных и локальных переменных JavaScript, вы всегда можете обратиться к MDN, где вся документация написана человеком. И если вы любите обучать, то просмотр Namaste JavaScript может быть лучшим выбором, который вы можете сделать.

Часто задаваемые вопросы

Каковы рекомендации по использованию глобальных и локальных переменных в JavaScript?

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

Как объем, доступность и срок жизни глобальных и локальных переменных влияют на их использование в JavaScript?

Ответ на этот вопрос уже написан выше в блоге.

Существуют ли какие-либо конкретные варианты использования глобальных или локальных переменных в JavaScript?

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

Каких распространенных ошибок следует избегать при использовании глобальных и локальных переменных в JavaScript?