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 相关文章推荐
ExtJS 2.0 实用简明教程之布局概述
Apr 29 Javascript
jquery中的$(document).ready()与window.onload的区别
Nov 18 Javascript
两款JS脚本判断手机浏览器类型跳转WAP手机网站
Oct 16 Javascript
Angularjs中UI Router全攻略
Jan 29 Javascript
seajs实现强制刷新本地缓存的方法分析
Oct 16 Javascript
使用vue实现简单键盘的示例(支持移动端和pc端)
Dec 25 Javascript
Node.js连接Sql Server 2008及数据层封装详解
Aug 27 Javascript
Vue数据绑定简析小结
May 07 Javascript
微信小程序点击view动态添加样式过程解析
Jan 21 Javascript
Vue如何实现验证码输入交互
Dec 07 Vue.js
最新最全的手机号验证正则表达式
Feb 24 Javascript
vue报错function () { [native code] },无法出现我们想要的内容 Unknown custom element
Apr 11 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分页类
2013/10/26 PHP
ThinkPHP3.1新特性之多层MVC的支持
2014/06/19 PHP
PHP面向对象程序设计实例分析
2016/01/26 PHP
PHP的反射机制实例详解
2017/03/29 PHP
PHP将英文数字转换为阿拉伯数字实例讲解
2019/01/28 PHP
php实现微信分享朋友链接功能
2019/02/18 PHP
用js实现的一个Flash滚动轮换显示图片代码生成器
2007/03/14 Javascript
30个最佳jQuery Lightbox效果插件分享
2011/04/11 Javascript
JavaScript事件委托实例分析
2015/05/26 Javascript
jquery实现九宫格大转盘抽奖
2015/11/13 Javascript
详解vue跨组件通信的几种方法
2017/06/15 Javascript
关于vue.extend和vue.component的区别浅析
2017/08/16 Javascript
学习RxJS之JavaScript框架Cycle.js
2019/06/17 Javascript
简述vue-cli中chainWebpack的使用方法
2019/07/30 Javascript
vue-cli2与vue-cli3在一台电脑共存的实现方法
2019/09/25 Javascript
JQuery常用选择器功能与用法实例分析
2019/12/23 jQuery
让你30分钟快速掌握vue3教程
2020/10/26 Javascript
[56:00]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第二场
2018/04/10 DOTA
CentOS安装pillow报错的解决方法
2016/01/27 Python
为何人工智能(AI)首选Python?读完这篇文章你就知道了(推荐)
2019/04/06 Python
python使用递归的方式建立二叉树
2019/07/03 Python
python 初始化一个定长的数组实例
2019/12/02 Python
Django之全局使用request.user.username的实例详解
2020/05/14 Python
Idea安装python显示无SDK问题解决方案
2020/08/12 Python
基于Python-turtle库绘制路飞的草帽骷髅旗、美国队长的盾牌、高达的源码
2021/02/18 Python
Otticanet澳大利亚:最顶尖的世界名牌眼镜, 能得到打折季的价格
2018/08/23 全球购物
Muziker英国:中欧最大的音乐家商店
2020/02/05 全球购物
澳大利亚在线购买葡萄酒:The Wine Collective
2020/02/20 全球购物
行政助理求职自荐信
2013/10/26 职场文书
会计毕业生自我鉴定
2013/11/04 职场文书
学前班教师的自我鉴定
2013/12/05 职场文书
自考生自我评价分享
2014/01/18 职场文书
祖国在我心中演讲稿300字
2014/05/04 职场文书
2015年七七事变78周年纪念活动方案
2015/05/06 职场文书
2015年基建工作总结范文
2015/05/23 职场文书
docker-compose部署Yapi的方法
2022/04/08 Servers