js变量提升深入理解


Posted in Javascript onSeptember 16, 2016

JavaScript的函数定义有个特点,它会先扫描整个函数体的语句,把所有申明的变量“提升”到函数顶部:

'use strict';

function foo() {
  var x = 'Hello, ' + y;
  alert(x);
  var y = 'Bob';
}
foo();

虽然是strict模式,但语句var x = 'Hello, ' + y;并不报错,原因是变量y在稍后申明了。但是alert显示Hello, undefined,说明变量y的值为undefined。这正是因为JavaScript引擎自动提升了变量y的声明,但不会提升变量y的赋值。

对于上述foo()函数,JavaScript引擎看到的代码相当于:

function foo() {
  var y; // 提升变量y的申明
  var x = 'Hello, ' + y;
  alert(x);
  y = 'Bob';
}

由于JavaScript的这一怪异的“特性”,我们在函数内部定义变量时,请严格遵守“在函数内部首先申明所有变量”这一规则。最常见的做法是用一个var申明函数内部用到的所有变量:

function foo() {
  var
    x = 1, // x初始化为1
    y = x + 1, // y初始化为2
    z, i; // z和i为undefined
  // 其他语句:
  for (i=0; i<100; i++) {
    ...
  }
}

以上这篇js变量提升深入理解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js批量设置样式的三种方法不推荐使用with
Feb 25 Javascript
如何使用jQuery来处理图片坏链具体实现步骤
May 02 Javascript
jQuery中after()方法用法实例
Dec 25 Javascript
JavaScript+html5 canvas实现本地截图教程
Apr 16 Javascript
Js实现简单的小球运动特效
Feb 18 Javascript
JS实现数字格式千分位相互转换方法
Aug 01 Javascript
JavaScript中apply方法的应用技巧小结
Sep 29 Javascript
浅谈Angular 中何时取消订阅
Nov 22 Javascript
详解如何在react中搭建d3力导向图
Jan 12 Javascript
JS实现table表格内针对某列内容进行即时搜索筛选功能
May 11 Javascript
浅谈Vue使用Cascader级联选择器数据回显中的坑
Oct 31 Javascript
MutationObserver在页面水印实现起到的作用详解
Jul 07 Javascript
再谈javascript常见错误及解决方法
Sep 16 #Javascript
使用JQuery中的trim()方法去掉前后空格
Sep 16 #Javascript
浅谈jQuery效果函数
Sep 16 #Javascript
jQuery插件easyUI实现通过JS显示Dialog的方法
Sep 16 #Javascript
jQuery实现的右下角广告窗体跟随效果示例
Sep 16 #Javascript
jQuery实现磁力图片跟随效果完整示例
Sep 16 #Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
Sep 16 #Javascript
You might like
PHP中数据类型转换的三种方式
2015/04/02 PHP
PHP版QQ互联OAuth示例代码分享
2015/07/05 PHP
PHP+ajax实现上传、删除、修改单张图片及后台处理逻辑操作详解
2020/02/12 PHP
JS IE和FF兼容性问题汇总
2009/02/09 Javascript
基于jQuery的投票系统显示结果插件
2011/08/12 Javascript
完美解决IE低版本不支持call与apply的问题
2013/12/05 Javascript
制作jquery遮罩层效果导航菜单代码分享
2013/12/25 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
2014/04/20 Javascript
基于Bootstrap的Java开发问题汇总(Spring MVC)
2017/01/15 Javascript
用jQuery实现可输入多选下拉组合框实例代码
2017/01/18 Javascript
jQuery实现链接的title快速出现的方法
2017/02/20 Javascript
微信小程序新增的拖动组件movable-view使用教程
2017/05/20 Javascript
JS实现的全选、全不选及反选功能【案例】
2019/02/19 Javascript
nodejs通过钉钉群机器人推送消息的实现代码
2019/05/05 NodeJs
小程序实现搜索框
2020/06/19 Javascript
Vue发布项目实例讲解
2019/07/17 Javascript
Echarts实现单条折线可拖拽效果
2019/12/19 Javascript
JavaScript遍历数组的方法代码实例
2020/01/14 Javascript
[02:31]2018年度DOTA2最具人气选手-完美盛典
2018/12/16 DOTA
Python设计模式中单例模式的实现及在Tornado中的应用
2016/03/02 Python
Python判断值是否在list或set中的性能对比分析
2016/04/16 Python
深入浅析Python的类
2018/06/22 Python
python实现DEM数据的阴影生成的方法
2019/07/23 Python
解析PyCharm Python运行权限问题
2020/01/08 Python
python两种获取剪贴板内容的方法
2020/11/06 Python
Scrapy+Selenium自动获取cookie爬取网易云音乐个人喜爱歌单
2021/02/01 Python
html5中audio支持音频格式的解决方法
2018/08/24 HTML / CSS
Vrbo英国:预订度假屋
2020/08/19 全球购物
经典促销广告词大全
2014/03/19 职场文书
2015年七夕爱情寄语
2015/03/24 职场文书
建国大业观后感
2015/06/01 职场文书
PHP实现rar解压读取扩展包小结
2021/06/03 PHP
Canvas绘制像素风图片的示例代码
2021/09/25 HTML / CSS
教你一步步实现一个简易promise
2021/11/02 Javascript
bootstrapv4轮播图去除两侧阴影及线框的方法
2022/02/15 HTML / CSS
Redis 限流器
2022/05/15 Redis