Сам код JavaScript должен содержаться внутри объекта. Например, при создании кода JavaScript для среды веб-браузера JavaScript содержится и выполняется в объекте window
. Этот window
объект считается «головным объектом», или его иногда называют «глобальным объектом». Все реализации JavaScript требуют использования одного объекта head.
Объект head устанавливается JavaScript за кулисами для инкапсуляции пользовательского кода и для размещения нативного кода, с которым поставляется JavaScript. Пользовательский код размещается JavaScript внутри объекта head для выполнения. Давайте проверим это, поскольку это относится к веб-браузеру.
В следующем примере я создаю некоторые значения JavaScript и проверяю их значения в объекте head head.
Образец: sample64.html
01
02
03
04
05
06
07
08
09
10
11
12
13
|
<!DOCTYPE html><html lang=»en»><body><script>
var myStringVar = ‘myString’;
var myFunctionVar = function () { };
myString = ‘myString’;
myFunction = function () { };
console.log(‘myStringVar’ in window);
console.log(‘myFunctionVar’ in window);
console.log(‘myString’ in window);
console.log(‘myFunction’ in window);
</script></body></html>
|
Вы всегда должны знать, что когда вы пишете JavaScript, он будет написан в контексте объекта head. В оставшемся материале этой главы предполагается, что вы знаете, что термин «головной объект» является синонимом «глобального объекта».
Головной объект — это самый большой контекст / контекст, доступный в среде JavaScript.
Глобальные функции, содержащиеся в головном объекте
JavaScript поставляется с некоторыми предопределенными функциями. Следующие встроенные функции считаются методами головного объекта (например, в веб-браузере window.parseInt('500')
). Вы можете думать о них как о готовых к использованию функциях и методах (объекта head), предоставляемых JavaScript.
-
decodeURI()
-
decodeURIComponent()
-
encodeURI()
-
encodeURIComponent()
-
eval()
-
isFinite()
-
isNaN()
-
parseFloat()
-
parseInt()
Головной объект против глобальных свойств и глобальных переменных
Не путайте объект head с глобальными свойствами или глобальными переменными, содержащимися в глобальной области видимости. Головной объект — это объект, который содержит все объекты. Термин «глобальные свойства» или «глобальные переменные» используется для обозначения значений, непосредственно содержащихся в головном объекте и не предназначенных специально для других объектов. Эти значения считаются глобальными, потому что независимо от того, где код выполняется в настоящее время, с точки зрения области действия, весь код имеет доступ (через цепочку областей действия) к этим глобальным свойствам и переменным.
В следующем примере я foo
свойство foo
в глобальную область, затем получаю доступ к этому свойству из другой области.
Образец: sample65.html
01
02
03
04
05
06
07
08
09
10
11
12
13
14
|
<!DOCTYPE html><html lang=»en»><body><script>
var foo = ‘bar’;
var myApp = function () { // Remember functions create scope.
var run = function () {
// Logs bar, foo’s value is found via the scope chain in the head object.
console.log(foo);
} ();
}
myApp();
</script></body></html>
|
Если бы я поместил свойство foo
за пределы глобальной области видимости, функция console.log
вернула бы undefined
. Это продемонстрировано в следующем примере кода.
Образец: sample66.html
01
02
03
04
05
06
07
08
09
10
11
12
13
|
<!DOCTYPE html><html lang=»en»><body><script>
var myFunction = function () { var foo = ‘bar’ };
var myApp = function () {
var run = function () {
console.log(foo);
} ();
}
myApp();
</script></body></html>
|
Именно поэтому в среде браузера методы глобального свойства (например, window.alert()
) могут вызываться из любой области. От этого нужно отказаться, потому что все в глобальной области доступно для любой области и, таким образом, получает заголовок «глобальная переменная» или «глобальное свойство».
Существует небольшая разница между использованием var
и не использованием var
в глобальной области видимости (глобальные свойства и глобальные переменные). Посмотрите на этот обмен переполнения стека для деталей: Разница между использованием var и не использованием var в JavaScript .
Ссылаясь на объект Head
Обычно существует два способа ссылки на головной объект. Первый способ — просто указать имя, данное объекту head (например, в веб-браузере это будет window
). Второй способ — использовать ключевое слово this
в глобальной области видимости. Каждый из них подробно описан в следующем примере.
Образец: sample67.html
01
02
03
04
05
06
07
08
09
10
11
12
|
<!DOCTYPE html><html lang=»en»><body><script>
var foo = ‘bar’;
windowRef1 = window;
windowRef2 = this;
console.log(windowRef1, windowRef2);
console.log(windowRef1.foo, windowRef2.foo);
</script></body></html>
|
В этом примере мы явно храним ссылку на объект head в двух переменных, которые затем используются для получения доступа к глобальной переменной foo
.
Головной объект подразумевается и обычно не имеет явной ссылки
Обычно ссылка на объект head не используется, поскольку она подразумевается. Например, в среде браузера window.alert
и alert()
по сути являются одним и тем же оператором. JavaScript заполняет пробелы здесь. Поскольку объект window
(головной объект) является последним объектом, проверенным в цепочке областей действия для значения, объект window
по существу всегда подразумевается. В следующем примере мы используем функцию alert()
которая содержится в глобальной области видимости.
Образец: sample68.html
01
02
03
04
05
06
07
08
09
10
11
12
|
<!DOCTYPE html><html lang=»en»><body><script>
var foo = { // window is implied here, window.foo
fooMethod: function () {
alert(‘foo’ + ‘bar’);
window.alert(‘foo’ + ‘bar’);
}
}
foo.fooMethod();
</script></body></html>
|
Вывод
Убедитесь, что вы понимаете, что объект head подразумевается, даже если вы явно не включаете его, потому что объект head является последней остановкой в цепочке областей действия.
Быть явным (например, window.alert()
и alert()
) стоит немного дороже в отношении производительности (насколько быстро работает код). Это быстрее, если вы полагаетесь только на цепочку областей действия и избегаете явной ссылки на объект head, даже если знаете, что требуемое свойство содержится в глобальной области действия.