javascript 显示全局变量与隐式全局变量的区别


Posted in Javascript onFebruary 09, 2017

在JavaScript中,全局变量有两种声明方式

  • 使用 var 显示声明的全局变量

  • 不使用 var 声明的隐式全局变量

两者的区别在于是否能通过 delete 操作符删除

先看一段代码

var a = 'a'; // 显式声明的全局变量
b = 'b'; // 隐式声明的全局变量
 
console.log(a); // a
console.log(b); // b
console.log(window.a); // a
console.log(window.b); // b

在 js 中全局变量其实是global对象(window)的属性,因此两种方式声明的全局变量都可以通过 window 拿到

尝试用 delete 删除

// 显式声明的全局变量不能被删除
delete a; // 返回 false 
 
// 隐式声明的全局变量可以被删除
delete b; // 返回 true 
 
// 删除情况
console.log(typeof a); // string
console.log(typeof b); // undefined

delete 操作符可以删除一个对象的属性,但如果属性是一个不可配置(non-configurable)属性,删除时则会返回 false(严格模式下会抛出异常)

这就表示使用 var 声明的变量是不可配置的,使用 getOwnPropertyDescriptor 来获取描述属性特性的对象来验证这一点

Object.getOwnPropertyDescriptor(window, a); // {value: "a", writable: true, enumerable: true, configurable: false}
Object.getOwnPropertyDescriptor(window, b); // {value: "b", writable: true, enumerable: true, configurable: true}

两者的根本区别在于显式声明的变量不可配置,不能通过 delete 操作符删除

需要注意的是 configurable 值一旦为 false,描述属性特性的对象就不能被修改,因此不能通过修改属性描述符使得显示声明的全局变量能被 delete 删除,但反过来,可以使隐式声明的全局变量也不能被 delete 删除

b = 'b';
var descriptor = Object.getOwnPropertyDescriptor(window, b);
descriptor.configurable = false;
Object.defineProperty(window, b, descriptor);
delete b; // 返回 false

以下是其他网友的补充

JavaScript之全局变量和隐式全局变量

隐式全局变量和明确定义的全局变量间有些小的差异,就是通过delete操作符让变量未定义的能力。

1、通过var创建的全局变量(任何函数之外的程序中创建)是不能被删除的。
2、无var创建的隐式全局变量(无视是否在函数中创建)是能被删除的。

这表明,在技术上,隐式全局变量并不是真正的全局变量,但它们是全局对象的属性。属性是可以通过delete操作符删除的,而变量是不能的:

// 定义三个全局变量
var global_var = 1;
global_novar = 2; // 反面教材
(function () {
  global_fromfunc = 3; // 反面教材
}());
 
// 试图删除
delete global_var; // false
delete global_novar; // true
delete global_fromfunc; // true
 
// 测试该删除
typeof global_var; // "number"
typeof global_novar; // "undefined"
typeof global_fromfunc; // "undefined"

在浏览器中,全局对象可以通过window属性在代码的任何位置访问(除非你做了些比较出格的事情,像是声明了一个名为window的局部变量)。但是在其他环境下,这个方便的属性可能被叫做其他什么东西(甚至在程序中不可用)。如果你需要在没有硬编码的window标识符下访问全局对象,你可以在任何层级的函数作用域中做如下操作:

var global = (function () {
  return this;
}());

这种方法可以随时获得全局对象,因为其在函数中被当做函数调用了(不是通过new构造),this总 是指向全局对象。实际上这个病不适用于ECMAScript 5严格模式,所以,在严格模式下时,你必须采取不同的形式。例如,你正在开发一个JavaScript库,你可以将你的代码包裹在一个即时函数中,然后从 全局作用域中,传递一个引用指向this作为你即时函数的参数。

以上就是javascript 显示全局变量与隐式全局变量的区别,两者的根本区别在于显式声明的变量不可配置,不能通过 delete 操作符删除,希望大家多关注三水点靠木的其他文章。

Javascript 相关文章推荐
使用Modello编写JavaScript类
Dec 22 Javascript
JS删除数组元素的函数介绍
Mar 27 Javascript
DOM 高级编程
May 06 Javascript
Jquery 全选反选实例代码
Nov 19 Javascript
jQuery插件开发精品教程让你的jQuery提升一个台阶
Jan 27 Javascript
JS输出空格的简单实现方法
Sep 08 Javascript
纯js实现手风琴效果代码
Apr 17 Javascript
vue 实现小程序或商品秒杀倒计时
Apr 14 Javascript
微信小程序登录态和检验注册过没的app.js写法
May 22 Javascript
npm qs模块使用详解
Feb 07 Javascript
jquery插件懒加载的示例
Oct 24 jQuery
Vue通过阿里云oss的url连接直接下载文件并修改文件名的方法
Dec 25 Vue.js
JS获取本周周一,周末及获取任意时间的周一周末功能示例
Feb 09 #Javascript
简单谈谈Javascript函数中的arguments
Feb 09 #Javascript
javascript 中设置window.location.href跳转无效问题解决办法
Feb 09 #Javascript
微信小程序之picker日期和时间选择器
Feb 09 #Javascript
BootStrap 弹出层代码
Feb 09 #Javascript
jQuery插件form-validation-engine正则表达式操作示例
Feb 09 #Javascript
javascript history对象详解
Feb 09 #Javascript
You might like
PHP下编码转换函数mb_convert_encoding与iconv的使用说明
2009/12/16 PHP
mysql,mysqli,PDO的各自不同介绍
2012/09/19 PHP
php session劫持和防范的方法
2013/11/12 PHP
php计划任务之ignore_user_abort函数实现方法
2015/01/08 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
PHP7扩展开发之基于函数方式使用lib库的方法详解
2018/01/15 PHP
常用js脚本
2006/12/03 Javascript
用JS操作FRAME中的IFRAME及其内容的实现代码
2008/07/26 Javascript
统计出现最多的字符次数的js代码
2010/12/03 Javascript
multiSteps 基于Jquery的多步骤滑动切换插件
2011/07/22 Javascript
javascript根据像素点取位置示例
2014/01/27 Javascript
判断某个字符在一个字符串中是否存在的js代码
2014/02/28 Javascript
js实现简洁大方的二级下拉菜单效果代码
2015/09/01 Javascript
JSON字符串和对象相互转换实例分析
2016/06/16 Javascript
Vue.js每天必学之数据双向绑定
2016/09/05 Javascript
详解jQuery插件开发方式
2016/11/22 Javascript
AngularJS表单验证功能分析
2017/05/26 Javascript
Python语言实现获取主机名根据端口杀死进程
2016/03/31 Python
Python爬虫DOTA排行榜爬取实例(分享)
2017/06/13 Python
python自动发邮件库yagmail的示例代码
2018/02/23 Python
异步任务队列Celery在Django中的使用方法
2018/06/07 Python
python将秒数转化为时间格式的实例
2018/09/16 Python
python3 自动识别usb连接状态,即对usb重连的判断方法
2019/07/03 Python
Python实现K折交叉验证法的方法步骤
2019/07/11 Python
Python3 执行Linux Bash命令的方法
2019/07/12 Python
解决Django中多条件查询的问题
2019/07/18 Python
python DataFrame转dict字典过程详解
2019/12/26 Python
美国在线艺术商店:HandmadePiece
2020/11/06 全球购物
旺仔牛奶广告词
2014/03/20 职场文书
新文化运动的口号
2014/06/21 职场文书
纪念九一八事变演讲稿:青少年应树立远大理想
2014/09/14 职场文书
代办社保委托书范文
2014/10/06 职场文书
党员贯彻十八大精神思想汇报范文
2014/10/25 职场文书
家属答谢词
2015/01/05 职场文书
心得体会该怎么写呢?
2019/06/27 职场文书
go goth封装第三方认证库示例详解
2022/08/14 Golang