Javascript window对象详解


Posted in Javascript onNovember 12, 2014

首先看我们的源代码。

<!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>

我们知道,通过浏览器打开这个页面,包含在<script> </script>标签中的 脚本会被执行,

那我们看一下 console.log(this); 这个this 到底指向的是谁呢?

在Google Chrome 中我们看到:

Javascript window对象详解

在Mozilla Firefox 中我们看到:

Javascript window对象详解

我们都看到输出的Window,那这个Window 与window是不是相等呢?

接着我们的测试

<script type="text/javascript" charset="utf-8">  

    console.log(this);  

    console.log('this == window ? ', this == window);   

</script> 

运行代码,输出this == window ?true ,这说明 Window== window,真的是这样吗?

为了搞清楚它们之间的关系,我们又接着测试

<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 :

Javascript window对象详解
Mozilla Firefox :

Javascript window对象详解

从输出结果我们可以推出,

this是指向Window对象;

this也等于window对象;

window也是指向Window对象;

Window是指向Window{},是浏览器提供的对象;

Window不等于window;

为什么会这样呢?

我们在浏览器控制台中查看Window对象的结构;

Javascript window对象详解

Javascript window对象详解

原来 Window对象包含的一些浏览器厂商实现的API,比如 html5中 的规范 sessionStorage;
它还有一个window的属性,这个属性的值就是指向Window对象;
我的理解:Window对象 是为浏览器厂商服务的,我们不能直接操作Window对象的属性,Window新增的API会反映到 window 对象中;
我们操作window 的属性 会反映到 Window 对象中。
比如 定义一个全局变量 window.a = 'aaa';

JavaScript的所有对象都存在于一个运行环境之中,这个运行环境本身也是对象,称为“顶层对象”。这就是说,JavaScript的所有对象,都是“顶层对象”的下属。不同的运行环境有不同的“顶层对象”,在浏览器环境中,这个顶层对象就是window对象。

所有浏览器环境的全局变量,都是window对象的属性。

可以把window理解成JavaScriptContext 上下文环境。

Javascript 相关文章推荐
让iframe子窗体取父窗体地址栏参数(querystring)
Oct 13 Javascript
javascript中String类的subString()方法和slice()方法
May 24 Javascript
一个页面元素appendchild追加到另一个页面元素的问题
Jan 27 Javascript
Javascript算符的优先级介绍
Mar 20 Javascript
jQuery Validate 验证,校验规则写在控件中的具体实例
Feb 27 Javascript
javaScript中with函数用法实例分析
Jun 08 Javascript
深入理解jquery自定义动画animate()
May 24 Javascript
jQuery根据ID、CLASS、等获取对象的实例
Dec 04 Javascript
详解JavaScript作用域和作用域链
Mar 19 Javascript
Vue 指令实现按钮级别权限管理功能
Apr 23 Javascript
js实现右键弹出自定义菜单
Sep 08 Javascript
微信小程序实现页面监听自定义组件的触发事件
Nov 01 Javascript
a标签的href与onclick事件的区别详解
Nov 12 #Javascript
完美兼容各大浏览器的jQuery仿新浪图文淡入淡出间歇滚动特效
Nov 12 #Javascript
JavaScript实现关键字高亮功能
Nov 12 #Javascript
javascript的函数作用域
Nov 12 #Javascript
浅析javascript的间隔调用和延时调用
Nov 12 #Javascript
jQuery的deferred对象详解
Nov 12 #Javascript
探寻Javascript执行效率问题
Nov 12 #Javascript
You might like
利用php来自动调用不同服务器上的flash
2006/10/09 PHP
Ajax+PHP 边学边练之四 表单
2009/11/27 PHP
PHP字符串中抽取子串操作实例分析
2019/06/22 PHP
IE8 兼容性问题(属性名区分大小写)
2009/06/04 Javascript
javascript下string.format函数补充
2010/08/24 Javascript
浅析js预加载/延迟加载
2014/09/25 Javascript
JS实现文字放大效果的方法
2015/03/03 Javascript
jquery获取所有选中的checkbox实现代码
2016/05/26 Javascript
一篇文章让你彻底弄懂JS的事件冒泡和事件捕获
2017/08/14 Javascript
javascript回调函数详解
2018/02/06 Javascript
Vue2.0实现简单分页及跳转效果
2019/07/29 Javascript
原生js实现3D轮播图
2020/03/21 Javascript
JS中准确判断变量类型的方法
2020/06/01 Javascript
vue实现几秒后跳转新页面代码
2020/09/09 Javascript
[13:21]DOTA2国际邀请赛采访专栏:RSnake战队国士无双,Fnatic.Fly
2013/08/06 DOTA
一个简单的python程序实例(通讯录)
2013/11/29 Python
python获得文件创建时间和修改时间的方法
2015/06/30 Python
浅谈Python的Django框架中的缓存控制
2015/07/24 Python
[机器视觉]使用python自动识别验证码详解
2019/05/16 Python
简单了解python单例模式的几种写法
2019/07/01 Python
Django继承自带user表并重写的例子
2019/11/18 Python
Python使用Excel将数据写入多个sheet
2020/05/16 Python
CSS3中box-shadow的用法介绍
2015/07/15 HTML / CSS
HTML5中判断用户是否正在浏览页面的方法
2014/05/03 HTML / CSS
HTML5适合的情人节礼物有纪念日期功能
2021/01/25 HTML / CSS
婴儿地球:Baby Earth
2018/12/25 全球购物
文秘专业个人求职信
2013/12/22 职场文书
新郎新娘婚礼答谢词
2014/01/11 职场文书
小学生感恩父母演讲稿
2014/08/28 职场文书
2014年镇党建工作汇报材料
2014/11/02 职场文书
运动会加油稿30字
2015/07/21 职场文书
2016党员学习作风建设心得体会
2016/01/21 职场文书
干货干货!2019最新优秀创业计划书
2019/03/21 职场文书
2019最新校园运动会广播稿!
2019/06/28 职场文书
一篇带你入门Java垃圾回收器
2021/06/16 Java/Android
mysql timestamp比较查询遇到的坑及解决
2021/11/27 MySQL