Javascript window對(duì)象詳解
首先看我們的源代碼。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>深入理解Javascript</title>
<script type="text/javascript" charset="utf-8">
console.log(this);
</script>
</head>
<body>
<h1>深入理解Javascript</h1>
</body>
</html>
我們知道,通過(guò)瀏覽器打開(kāi)這個(gè)頁(yè)面,包含在<script> </script>標(biāo)簽中的 腳本會(huì)被執(zhí)行,
那我們看一下 console.log(this); 這個(gè)this 到底指向的是誰(shuí)呢?
在Google Chrome 中我們看到:
在Mozilla Firefox 中我們看到:
我們都看到輸出的Window,那這個(gè)Window 與window是不是相等呢?
接著我們的測(cè)試
<script type="text/javascript" charset="utf-8">
console.log(this);
console.log('this == window ? ', this == window);
</script>
運(yùn)行代碼,輸出this == window ?true ,這說(shuō)明 Window== window,真的是這樣嗎?
為了搞清楚它們之間的關(guān)系,我們又接著測(cè)試
<script type="text/javascript" charset="utf-8">
console.log('this = ', this);
console.log('this == window ?', this == window);
console.log('window = ', window);
console.log('Window = ', Window)
console.log('Window == window ?', Window == window)
</script>
看瀏覽器輸出:
Google Chrome :
Mozilla Firefox :
從輸出結(jié)果我們可以推出,
this是指向Window對(duì)象;
this也等于window對(duì)象;
window也是指向Window對(duì)象;
Window是指向Window{},是瀏覽器提供的對(duì)象;
Window不等于window;
為什么會(huì)這樣呢?
我們?cè)跒g覽器控制臺(tái)中查看Window對(duì)象的結(jié)構(gòu);
原來(lái) Window對(duì)象包含的一些瀏覽器廠商實(shí)現(xiàn)的API,比如 html5中 的規(guī)范 sessionStorage;
它還有一個(gè)window的屬性,這個(gè)屬性的值就是指向Window對(duì)象;
我的理解:Window對(duì)象 是為瀏覽器廠商服務(wù)的,我們不能直接操作Window對(duì)象的屬性,Window新增的API會(huì)反映到 window 對(duì)象中;
我們操作window 的屬性 會(huì)反映到 Window 對(duì)象中。
比如 定義一個(gè)全局變量 window.a = 'aaa';
JavaScript的所有對(duì)象都存在于一個(gè)運(yùn)行環(huán)境之中,這個(gè)運(yùn)行環(huán)境本身也是對(duì)象,稱(chēng)為“頂層對(duì)象”。這就是說(shuō),JavaScript的所有對(duì)象,都是“頂層對(duì)象”的下屬。不同的運(yùn)行環(huán)境有不同的“頂層對(duì)象”,在瀏覽器環(huán)境中,這個(gè)頂層對(duì)象就是window對(duì)象。
所有瀏覽器環(huán)境的全局變量,都是window對(duì)象的屬性。
可以把window理解成JavaScriptContext 上下文環(huán)境。
- JS window對(duì)象的top、parent、opener含義介紹
- js window對(duì)象屬性和方法相關(guān)資料整理
- javascript window對(duì)象屬性整理
- JavaScript中Window對(duì)象的屬性及事件
- JavaScript的document對(duì)象和window對(duì)象詳解
- JS 使用 window對(duì)象的print方法實(shí)現(xiàn)分頁(yè)打印功能
- JavaScript瀏覽器對(duì)象之一Window對(duì)象詳解
- Javascript之BOM(window對(duì)象)詳解
- javascript入門(mén)之window對(duì)象【新手必看】
- javascript類(lèi)型系統(tǒng) Window對(duì)象學(xué)習(xí)筆記
- JS window對(duì)象簡(jiǎn)單操作完整示例
相關(guān)文章
Javascript 入門(mén)基礎(chǔ)學(xué)習(xí)
習(xí).net已經(jīng)近2年了,最近學(xué)習(xí)Ajax時(shí)發(fā)現(xiàn)自己的很多技術(shù)功底很是欠缺,比如JavaScript。今后我會(huì)將我正在學(xué)習(xí)的也寫(xiě)成筆記,有時(shí)間的話將以前的東西整理整理也傳上來(lái)。2010-03-03Javascript獲取窗口(容器)的大小及位置參數(shù)列舉及簡(jiǎn)要說(shuō)明
Javascript獲取窗口(容器)的大小及位置一系列的東西比較多,容易混淆,在這里列舉及簡(jiǎn)要說(shuō)明下,需要的朋友可以參考下2012-12-12在javascript中創(chuàng)建對(duì)象的各種模式解析
下面小編就為大家?guī)?lái)一篇在javascript中創(chuàng)建對(duì)象的各種模式解析。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考,一起跟隨小編過(guò)來(lái)看看吧2016-05-05JavaScript 頁(yè)面坐標(biāo)相關(guān)知識(shí)整理
對(duì)于頁(yè)面的一些坐標(biāo)與位置分析,一般需要控制層的位置的朋友有幫助。需要的朋友可以參考下。2010-01-01淺談Web頁(yè)面向后臺(tái)提交數(shù)據(jù)的方式和選擇
下面小編就為大家?guī)?lái)一篇淺談Web頁(yè)面向后臺(tái)提交數(shù)據(jù)的方式和選擇。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09