频道导航

JavaScript定义变量和变量优先级问题探讨

2018-12-31 JavaScript 前端之家

前端之家收集整理的这篇文章主要介绍了JavaScript定义变量和变量优先级问题探讨，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

@H_301_0@看下面的代码：

@H_301_0@<div class="codetitle"><a style="CURSOR: pointer" data="28487" class="copybut" id="copybut28487" onclick="doCopy('code28487')"> 代码如下:

<div class="codebody" id="code28487">
if (!("aa" in window)) {
alert('oh my god');
var aa = 1;
}
alert("aa" in window);
alert(aa);

@H_301_0@回答以下问题：

@H_301_0@会报错吗？会弹出几次？第2个alert是true还是false? 第3个alert弹出什么？为什么？思考下，然后测试下，如果你回答正确，那么后面的文章就不用看了。

@H_301_0@－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

@H_301_0@在JS里定义变量太简单了，直接一个var ，甚至不用var都可以：

代码如下:

这里a就是变量名，1就是变量值。唉，这个太基础了。看下面的代码：

代码如下:

以firebug测试，会弹出undefined，这个是大家很熟悉的一个字符串了，貌似表示变量未定义。但我觉得，我已经var了啊，这就是定义了嘛，只是没有附值而已。

@H_301_0@我们来个真正的没有定义的：

@H_301_0@

代码如下:

@H_301_0@没错，就是直接alert一个根本没有出现过的变量，这会如何？

@H_301_0@firebug直接报错了：a is not defined.意思是a没有定义。这个结合前面的代码来看，让人困惑。这个没有定义和前面的未定义有什么不同呢？

@H_301_0@其实前面的代码等价于这样的：

@H_301_0@

代码如下:

@H_301_0@也就是说，当声明变量而不赋值时，JS会给变量传一个undefined值，注意，这是个“值”，说明a已经有值了，这个值就叫“未定义”。

@H_301_0@而后面的直接alert，变量从没有出现过，也就是说这才是真正的未定义。

@H_301_0@简单的说：JS中不存在没有值的变量,变量声明的时候就赋值了。

@H_301_0@然后我们看下面的代码：

@H_301_0@

代码如下:

@H_301_0@这个代码会报错吗？因为在alert的时候变量a还没来得及出现呀。

@H_301_0@但是这样居然没有报错，而是弹出了undefined值。表明变量a已经存在了，只是值却不是我们想要的，而是undefined。这又是个什么问题呢？

@H_301_0@因为var 变量声明和函数声明一样，会提前，其实上面的代码是这样的：

@H_301_0@

代码如下:

@H_301_0@这么一来就懂了。

@H_301_0@所以，这个问题的关键在于：var 声明会提前到作用域顶端，但附值却不会———好纠结的设定，不知道为什么要这么搞。个人觉得这是JS的一个缺陷。

@H_301_0@现在有一种代码习惯，主张把变量声明一律放在作用域前方，大概就是考虑到这个——反正就算你不写在前方，JS也会提前到前方。

@H_301_0@现在放出文首问题的答案：

@H_301_0@只会弹出两个alert，而if里面的alert不会执行，因为var声明的提前性，导致真正的代码是这个样子：

@H_301_0@

代码如下:

@H_301_0@虽然aa为空，但用'aa' in window判断时会为真，因为a确实存在了，而值是undefined。所以if代码不会执行。后面两个alert我就不说了。

@H_301_0@个人感觉这是一个很无厘头的问题，我们应该了解他的原因，但鄙视他这种陷阱。

@H_301_0@上面这个问题也是我写这篇文章的缘由，这段代码是我从一篇网文里看到的，但他里面没有答案，我百撕不得骑姐，跑到stackoverflow上去问了才搞清楚。答案就是这篇文章。

@H_301_0@但这是很基础的问题啊其实！！！

@H_301_0@哈哈，原谅我，后面还有一个问题：

代码如下:

这也是一种声明变量的方式，那么，这段代码会报错吗？为什么？

JavaScript 变量优先级定义变量

上一篇：JavaScript中获取鼠标位置相关属性下一篇：JavaScript中实现PHP的打乱数组函数

猜你在找的JavaScript相关文章

Javascript中的事件冒泡与捕获

事件冒泡和事件捕获起因：今天在封装一个bind函数的时候，发现el.addEventListener函数支...

作者：前端之家时间：2021-02-22

搞懂js中小数运算精度问题原因及解决办法

js小数运算会出现精度问题 js number类型 JS 数字类型只有number类型，number类型相当于其...

作者：前端之家时间：2021-02-22

搞懂：前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理

什么是跨域跨域：广义的跨域包含一下内容： 1.资源跳转（链接跳转，重定向跳转，表单提...

作者：前端之家时间：2021-02-22

前端对base64编码的理解，原生js实现字符base64编码

@ "TOC" 常见对base64的认知(不完全正确) 首先对base64常见的认知，也是...

作者：前端之家时间：2021-02-22

搞懂：MVVM模型以及VUE中的数据绑定数据劫持发布订阅模式

搞懂：MVVM模式和Vue中的MVVM模式 MVVM MVVM ：的缩写，说都能直接说出来：模型，：视图...

作者：前端之家时间：2021-02-22

js判断浏览器是否支持webGL

起因是我之前开发的网页，用到了three.js制作了一个3d的旋转球体效果。在各种浏览器上运行...

作者：前端之家时间：2021-02-14

js判断undefined和null

js判断undefined js判断null js判断null和undefined

作者：前端之家时间：2021-02-14

将文字自动转为banner打印形式的工具

http://patorjk.com/software/taag/

作者：前端之家时间：2021-02-14

聊一聊 bootstrap 的轮播图插件

今天做工作的时候，轻车熟路的做完，又用到了bootstrap的轮播图，觉得有必要安利一下这个插...

作者：前端之家时间：2021-02-14

js实现图片无缝循环跑马灯

html 代码 css js代码 function mylsRunHorseLight() { if (mylsTimer != null) { clearIn...

作者：前端之家时间：2021-02-14

最新文章