Javascript основные глобальные функции

Create Global Functions In JavaScript

Normally, a function defined would not be accessible to all places of a page. Say a function is mentioned using «function checkCookie()» on a external file loaded first on a page. This function cannot be called by the JavaScript file loaded last. So you have to make it a Global function that can be called from anywhere on a page.

The «window» is a Global Object that has a lot of functions.

This «window» object is accessible to all JavaScript code of a page, even if it’s an external file. So, if the «window» object is global, then the functions it contain will also be global. So, if we add a new function to the «window» object, it will be a global function. This is what we are going to do to make a Global function.

Here is a normal way that we use to define a function :

As you already understood, this function wouldn’t be accessible to all JS codes. The error that produce when a function can’t be accessible is :

ReferenceError: checkCookie is not defined

To make the «checkCookie» function global, we are going to add the function to the «window» object :

window.checkCookie=function()< // do whatever you want here >;

Note the semi colon («;») at the closing of the function. This semi colon is required when defining a function on a object. As normal you can add parameters to the function.

function makeString(string, position)< // do whatever you want here >

window.makeString=function(string, position)< // do whatever you want here >;

Now, you can call the function directly or call it with window :

checkCookie() window.checkCookie() makeString("subinsb.com", 5) window.makeString("subinsb.com", 5)

The output of the different ways to call functions will be the same. You should know that jQuery is also doing this to make «$» & «jQuery» functions global.

Источник

Глобальный объект

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

В браузере он называется window , в Node.js — global , в другой среде исполнения может называться иначе.

Недавно globalThis был добавлен в язык как стандартизированное имя для глобального объекта, которое должно поддерживаться в любом окружении. Он поддерживается во всех основных браузерах.

Далее мы будем использовать window , полагая, что наша среда – браузер. Если скрипт может выполняться и в другом окружении, лучше будет globalThis .

Ко всем свойствам глобального объекта можно обращаться напрямую:

alert("Привет"); // это то же самое, что и window.alert("Привет");

В браузере глобальные функции и переменные, объявленные с помощью var (не let/const !), становятся свойствами глобального объекта:

var gVar = 5; alert(window.gVar); // 5 (становится свойством глобального объекта)

То же самое касается функций, объявленных с помощью синтаксиса Function Declaration (выражения с ключевым словом function в основном потоке кода, не Function Expression)

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

Если бы мы объявили переменную при помощи let , то такого бы не произошло:

let gLet = 5; alert(window.gLet); // undefined (не становится свойством глобального объекта)

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

// сделать информацию о текущем пользователе глобальной, для предоставления доступа всем скриптам window.currentUser = < name: "John" >; // где угодно в коде alert(currentUser.name); // John // или, если у нас есть локальная переменная с именем "currentUser", // получим её из window явно (безопасно!) alert(window.currentUser.name); // John

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

Использование для полифилов

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

Например, проверить наличие встроенного объекта Promise (такая поддержка отсутствует в очень старых браузерах):

Если нет (скажем, используется старый браузер), мы можем создать полифил: добавить функции, которые не поддерживаются окружением, но существуют в современном стандарте.

Итого

• Глобальный объект хранит переменные, которые должны быть доступны в любом месте программы. Это включает в себя как встроенные объекты, например, Array , так и характерные для окружения свойства, например, window.innerHeight – высота окна браузера.
• Глобальный объект имеет универсальное имя – globalThis . …Но чаще на него ссылаются по-старому, используя имя, характерное для данного окружения, такое как window (браузер) и global (Node.js).
• Следует хранить значения в глобальном объекте, только если они действительно глобальны для нашего проекта. И стараться свести их количество к минимуму.
• В браузерах, если только мы не используем модули, глобальные функции и переменные, объявленные с помощью var , становятся свойствами глобального объекта.
• Для того, чтобы код был проще и в будущем его легче было поддерживать, следует обращаться к свойствам глобального объекта напрямую, как window.x .

Источник