js变量是除了this以外最让人恶心的东西了,还因为烂语法造成各种各样奇奇怪怪的事情发生,下面让我们来谈谈都有什么奇怪的事:

1.用var与不用var

function test(){
a = 123;
var b =456;
}
test();
console.log(a); //
console.log(b); //报错

容易看出,在函数内部,没有用var定义的变量变成了全局的了,究竟发生了什么事呢?那就是万恶的作用域链在作怪了~~

首先,变量 = 。。。这种赋值写法会先寻找当前作用域有没有这个这个变量,如果没有往父作用域寻找,这样的操作直到window作用域,如果window作用域都没有,就创建一个全局变量,并给其赋值。

在全局环境中,不用var和用var,其实也是有区别的:

a = 123;
var b =456;
delete window.a //true
a //ReferenceError: a is not defined [详细了解]
delete window.b //false
b //

就是说用var定义的全局变量是不能被delete的,不用var定义得到的全局变量都是可以被delete的(包括函数里面不用var定义的)

ps:但是最新版的chrome已经都可以delete了

2.变量提升

//平常直接调用一个没定义的变量
aaa; //报错,aaa is not defined

但是,直接调用后,再定义,就不报错了

aaa; //undefined
var aaa = 123;
aaa;//

这就是所谓的变量提升了,js中所有变量和函数都是会先被提到它的作用域的最上方先定义的,就是说上面的代码可以等价成下面的:

var aaa;
aaa; //undefined
aaa = 123;
aaa;//

经常面试的时候,会考到相关的问题:

var aaa = 456;
function test(){
aaa;
var aaa; = 123;
aaa;
}
test();

问test中第一个aaa和第二个aaa的值分别是什么?

答案是第一个是undefined,第二个是123,为什么第一个不是456,而是undefined呢,明显就是变量提升的效果了

但是es6的let出现后,这种写发法不允许了,这就是所谓的暂时性死区:

var aaa = 456;
function test(){
aaa; //Uncaught ReferenceError: aaa is not defined
let aaa; = 123;
aaa;
}
test();

函数的变量提升比var变量的提升优先级更高:

b() // call b second

function b() {
console.log('call b fist')
}
function b() {
console.log('call b second')
}
var b = 'Hello world'

js变量浅谈的更多相关文章

  1. Js之浅谈dom操作

    JavaScript之浅谈dom操作 1.理解dom: DOM(Document Object Model ,文档对象模型)一种独立于语言,用于操作xml,html文档的应用编程接口. 怎么说,我从两 ...

  2. js原型浅谈理解

    之前在学习原型(prototype)的时候,一直对原型的理解不是很清晰,只是知道每个对象都有一个原型,然后在js中万物又皆对象.在这里谈一下自己对于js原型的简单理解吧. 原型可以实现属性和方法的共享 ...

  3. js中浅谈this对象(未补充完整)

    什么是this? 1.javascript语言中,一切皆为对象(除了 undefined 和 null 之外),运行环境也是对象,所以函数都是在某个对象之中运行,this就是这个对象(环境). 2.t ...

  4. [转]SQL注入漏洞及绑定变量浅谈

    1.一个问题引发的思考 大家在群里讨论了一个问题,奉文帅之命写篇作文,且看: String user_web = "user_web" String sql = "upd ...

  5. JS基础——浅谈前端页面渲染和性能优化

    加载html中的静态资源 其中,加载静态资源的过程,一般为浏览器根据DNS服务器得到域名的IP地址,然后向这个IP的机器发送http请求,服务器收到.处理并返回http请求,浏览器得到返回http请求 ...

  6. 浅谈JS中 var let const 变量声明

    浅谈JS中 var let const 变量声明 用var来声明变量会出现的问题: 1. 允许重复的变量声明:导致数据被覆盖 2. 变量提升:怪异的数据访问.闭包问题 3. 全局变量挂载到全局对象:全 ...

  7. 浅谈JS中的闭包

    浅谈JS中的闭包 在介绍闭包之前,我先介绍点JS的基础知识,下面的基础知识会充分的帮助你理解闭包.那么接下来先看下变量的作用域. 变量的作用域 变量共有两种,一种为全局变量,一种为局部变量.那么全局变 ...

  8. 浅谈 PHP 变量可用字符

    原文:浅谈 PHP 变量可用字符 先来说说php变量的命名规则,百度下一抓一大把:(1) PHP的变量名区分大小写;(2) 变量名必须以美元符号$开始;(3) 变量名开头可以以下划线开始;(4) 变量 ...

  9. 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理

    [微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...

随机推荐

  1. 读<架构漫谈>系列有感

    读了这一系列博文,我对架构也有了大致的了解.在简单的阅读之后,我解决了几个问题. 第一个问题,什么是架构? 要学习架构,首先要知道架构.那么,什么是架构呢?引用<架构漫谈(一)>里的话就是 ...

  2. Proxy 示例

    package cn.proxy03; import java.lang.reflect.InvocationHandler; import java.lang.reflect.Method; imp ...

  3. Resolved validation conflict with readonly

    /** * Bug绕过去方案WorkAround * Bug描述: * JQuery的Validation的和form的input元素设为readonly,一对不可调和的矛盾: * 一个设置为requ ...

  4. TestNG—学习笔记2

    关于TestNG,也是一边学一边总结,对于TestNG和Junit的比较其实也没有什么意义,都是一种测试框架,都是为了应用而生的东西,没有必要说谁好谁不好了.用的熟练用的好就是真的好啊. 下面简单的总 ...

  5. pandas.Series

    1.系列(Series)是能够保存任何类型的数据(整数,字符串,浮点数,Python对象等)的一维标记数组.轴标签统称为索引. Pandas系列可以使用以下构造函数创建 - pandas.Series ...

  6. Kivy crash 中文教程 实例入门 1. 第1个应用 Kivy App (Making a simple App)

    1.  空白窗口 在 PyCharm 中创建一个名为 TutorialApp 的项目,然后在该项目中新建了个名为 tutorial_app.py 的 Python 源文件,在 PyCharm 的代码编 ...

  7. delphi 的 LockType 锁类型

    LockType     锁类型       常数                                         值                           说明     ...

  8. 关于Spring MVC跨域

    1.Sping MVC 3.X跨域 关于跨域问题,主要用的比较多的是cros跨域. 详细介绍请看https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Ac ...

  9. 在Python中调用C++模块

    一.一般调用流程 http://www.cnblogs.com/huangshujia/p/4394276.html 二.Python读取图像并传入C++函数,再从C++返回结果图像给Python h ...

  10. MT【42】抛物线不常见性质1.

    评:特别的,当$PP'$为切线时,$\angle PSK=90^0$ 注:S为抛物线焦点.