浅析JavaScript中两种类型的全局对象/函数


Posted in Javascript onDecember 05, 2013

这里所说的JavaScript指浏览器环境中的包括宿主环境在内的。第一种是ECMAScript Global Object,第二种是宿主环境(Host)下的全局对象/函数。

一、核心JavaScript内置对象,即ECMAScript实现提供的不依赖于宿主环境的对象

这些对象在程序执行之前就已经(实例化)存在了。ECMAScript称为The Global Object,分为以下几种

1, 值属性的全局对象(Value Properties of the Global Object)。有NaN,Infinity,undefined。

2, 函数属性的全局对象(Function Properties of the Global Object)。有eval,parseInt,parseFloat,isNaN,isFinite,decodeURI,encodedURI,encodeURIComponent

3,构造器(类)属性的全局对象(Constructor Properties of the Global Object)。有Object,Function,Array,String,Boolean,Number,Date,RegExp,Error,EvalError,RangeError,ReferenceError,SyntaxError,TypeError,URIError。

4,其它属性的全局对象(Other Properties of the Global Object),可以看出成是Java中的静态类,可以直接用类名+点号+方法名使用。有Math,JSON。

ECMAScript规范提到这些全局对象(The Global Object)是具有Writable属性的,即Writable为true,枚举性(Enumerable)为false,即不能用for in枚举。ECMAScript有这么一段

Unless otherwise specified, the standard built-in properties of the global object have attributes {[[Writable]]: true, [[Enumerable]]: false, [[Configurable]]: true}.

虽然规范提到The Global Object是可以被重写的,但不会有谁去重写它们的。这里仅仅做个测试。

NaN    = 11; 
eval   = 22; 
Object = 33; 
Math   = 44; alert(NaN); 
alert(eval); 
alert(Object); 
alert(Math);<BR>

分别取值属性的全局对象, 函数属性的全局对象,构造器(类)属性的全局对象,其它属性的全局对象NaN,eval,Object,Math。结果如下浅析JavaScript中两种类型的全局对象/函数

结果可以看出除了NaN在IE9(pre3)/Safari不能被重写外,其它都被重写了。这里只是列举了四个,感兴趣的可以将以上所有的The Global Object一一测试下。这里想表达的是核心JavaScript内置对象一般是可以被重写的 ,虽然没人这么干。

下面测试下其可枚举性

for(var a in NaN){ 
    alert(a); 
} 
for(var a in eval){ 
    alert(a); 
} 
for(var a in Object){ 
    alert(a); 
} 
for(var a in Math){ 
    alert(a); 
}

所有浏览器都没有弹出,即属性不被枚举。感兴趣的可以将以上所有的The Global Object的枚举性一一测试下。当然对于有些浏览器如Firefox,某些Global Object被重写后又是可以被枚举的。

二、宿主环境提供的全局对象/函数

如window,alert,setTimeout,document,location等,多数浏览器都会限制其重写

window = 55; 
alert(window);

该句在IE下会出错提示非法复制,后面的弹出框没有执行。其它浏览器则当window=55不存在,仍然弹出了window。

再重写下alert

alert = 55; 
console.log(alert);

IE下提示报错,Firefox/Chrome/Safari/Opera竟然被重写了,从对应的控制台可以看到输出了55。可以看出对于宿主环境提供的全局对象/函数,有的浏览器不支持重写,有的则可以重写 。

以下是两种方式声明全局变量

a1 = 11; 
var a2 = 22; for(a in window){ 
    if(a=='a1'||a=='a2'){ 
        alert(a) 
    } 
}

上述代码在IE中不会弹出信息框,在IE中内部大概如下
//IE 
with(host_object){//window 
    with(global_object){//Global 
        a1 = 11; 
        var a2 = 22; 
    }    
}

即a1,a2是作为上面说的第一种,JS引擎提供的Global对象上的属性,而非第二种宿主环境提供的window对象上的属性。因此IE中for in window时a1,a2都不存在。如果IE中提供对象Global对象的引用,没准下面的代码可以弹出信息框。
for(a in Global){ 
    if(a=='a1'||a=='a2'){ 
        alert(a) 
    } 
}

Firefox/Safari/Chrome/Opera中内部大概是下面的样子
//Firefox/Safari/Chrome/Opera 
with(host_object){//window 
    a1 = 11; 
    var a2 = 22; 
    with(global_object){//Global 
    }    
}

即a1,a2是作为上面说的第二种,宿主环境提供的全局对象window上的属性。因此for in window时a1,a2都存在,弹出了信息框。

再看第三者方式声明全局变量window.a3 = 33,这样是显示的把a3挂在window上作为window的属性,因此在所有浏览器中for in window时都能获取到a3。

Javascript 相关文章推荐
表单验证的完整应用案例探讨
Mar 29 Javascript
用JS做的简单的可折叠的两级树形菜单
Sep 21 Javascript
jQuery实现Meizu魅族官方网站的导航菜单效果
Sep 14 Javascript
JS禁用页面上所有控件的实现方法(附demo源码下载)
Dec 17 Javascript
基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载
Jan 06 Javascript
jQuery实现可以编辑的表格实例详解【附demo源码下载】
Jul 09 Javascript
全面了解addEventListener和on的区别
Jul 14 Javascript
微信小程序 网络API Websocket详解
Nov 09 Javascript
原生和jQuery的ajax用法详解
Jan 23 Javascript
React操作真实DOM实现动态吸底部的示例
Oct 23 Javascript
js动态添加表格逐行添加、删除、遍历取值的实例代码
Jan 25 Javascript
vue2.0移动端滑动事件vue-touch的实例代码
Nov 27 Javascript
完美解决IE低版本不支持call与apply的问题
Dec 05 #Javascript
JavaScript子类用Object.getPrototypeOf去调用父类方法解析
Dec 05 #Javascript
jQuery表格插件ParamQuery简单使用方法示例
Dec 05 #Javascript
各浏览器对document.getElementById等方法的实现差异解析
Dec 05 #Javascript
给事件响应函数传参数的四种方式小结
Dec 05 #Javascript
弹出最简单的模式化遮罩层的js代码
Dec 04 #Javascript
js如何设置在iframe框架中指定div不显示
Dec 04 #Javascript
You might like
通过PHP的内置函数,通过DES算法对数据加密和解密
2012/06/21 PHP
PHP简单生成缩略图相册的方法
2015/07/29 PHP
php+mysql实现无限级分类
2015/11/11 PHP
php实现数字补零的方法总结
2018/09/12 PHP
PHP使用mongoclient简单操作mongodb数据库示例
2019/02/08 PHP
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
2014/06/11 Javascript
JavaScript中的ubound函数使用实例
2014/11/04 Javascript
javascript消除window.close()的提示窗口
2015/05/20 Javascript
JavaScript实现仿网易通行证表单验证
2015/05/25 Javascript
详解 javascript中offsetleft属性的用法
2015/11/11 Javascript
Bootstrap导航条的使用和理解3
2016/12/14 Javascript
vuejs开发组件分享之H5图片上传、压缩及拍照旋转的问题处理
2017/03/06 Javascript
JS+HTML5实现图片在线预览功能
2017/07/22 Javascript
微信上传视频文件提示(推荐)
2018/11/22 Javascript
详解小程序之简单登录注册表单验证
2019/05/13 Javascript
vue源码中的检测方法的实现
2019/09/26 Javascript
微信小程序转发事件实现解析
2019/10/22 Javascript
[43:47]完美世界DOTA2联赛PWL S3 LBZS vs Phoenix 第一场 12.09
2020/12/11 DOTA
Python遍历pandas数据方法总结
2018/02/09 Python
python实现遍历文件夹修改文件后缀
2018/08/28 Python
python3+opencv3识别图片中的物体并截取的方法
2018/12/05 Python
解决pyinstaller打包pyqt5的问题
2019/01/08 Python
python实现PID算法及测试的例子
2019/08/08 Python
Python缓存技术实现过程详解
2019/09/25 Python
Python利用全连接神经网络求解MNIST问题详解
2020/01/14 Python
vscode写python时的代码错误提醒和自动格式化的方法
2020/05/07 Python
Python监听剪切板实现方法代码实例
2020/11/11 Python
HTML5 Canvas中使用用路径描画圆弧
2015/01/01 HTML / CSS
Rossignol金鸡美国官网:始于1907年法国百年雪具品牌
2019/03/06 全球购物
Topshop美国官网:英国快速时尚品牌
2019/05/16 全球购物
计算s=f(f(-1.4))的值
2014/05/06 面试题
物业管理公司实习生自我鉴定
2013/09/19 职场文书
年度考核自我鉴定
2014/02/02 职场文书
乡镇总工会学雷锋活动总结
2014/03/01 职场文书
历史专业大学生职业生涯规划书
2014/03/13 职场文书
python基础之文件处理知识总结
2021/05/23 Python