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 相关文章推荐
IE6下拉框图层问题探讨及解决
Jan 03 Javascript
招聘网站基于jQuery实现自动刷新简历
May 10 Javascript
Boostrap栅格系统与自己额外定义的媒体查询的冲突问题
Feb 19 Javascript
js获取浏览器的各种属性
Apr 27 Javascript
浅谈Angular2 模块懒加载的方法
Oct 04 Javascript
微信小程序实现点击按钮修改字体颜色功能【附demo源码下载】
Dec 05 Javascript
基于vue 实现token验证的实例代码
Dec 14 Javascript
使用vue-cli编写vue插件的方法
Feb 26 Javascript
vue.js前后端数据交互之提交数据操作详解
Apr 24 Javascript
微信小程序制作表格的方法
Feb 14 Javascript
前端插件之Bootstrap Dual Listbox使用教程
Jul 23 Javascript
JavaScript实现下拉列表
Jan 20 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中对xml读取的相关函数的介绍一
2008/06/05 PHP
搭建基于Docker的PHP开发环境的详细教程
2015/07/01 PHP
提高php编程效率技巧
2015/08/13 PHP
Laravel框架实现的记录SQL日志功能示例
2018/06/19 PHP
thinkphp5框架前后端分离项目实现分页功能的方法分析
2019/10/08 PHP
php使用Swoole实现毫秒级定时任务的方法
2020/09/04 PHP
如何在Laravel之外使用illuminate组件详解
2020/09/20 PHP
Ajax一统天下之Dojo整合篇
2007/03/24 Javascript
Jquery插件之多图片异步上传
2010/10/20 Javascript
框架页面高度自动刷新的Javascript脚本
2013/11/01 Javascript
详解JavaScript中void语句的使用
2015/06/04 Javascript
javascript中的正则表达式使用详解
2015/08/30 Javascript
jQuery解决$符号命名冲突
2016/06/18 Javascript
原生ajax处理json格式数据的实例代码
2016/12/25 Javascript
原生JS中slice()方法和splice()区别
2017/03/06 Javascript
解决vue中axios设置超时(超过5分钟)没反应的问题
2020/09/04 Javascript
Antd的Table组件嵌套Table以及选择框联动操作
2020/10/24 Javascript
在vant 中使用cell组件 定义图标该图片和位置操作
2020/11/02 Javascript
在树莓派2或树莓派B+上安装Python和OpenCV的教程
2015/03/30 Python
彻底理解Python list切片原理
2017/10/27 Python
django 删除数据库表后重新同步的方法
2018/05/27 Python
对python:print打印时加u的含义详解
2018/12/15 Python
python 并发编程 非阻塞IO模型原理解析
2019/08/20 Python
Python读取二进制文件代码方法解析
2020/06/22 Python
Python预测2020高考分数和录取情况
2020/07/08 Python
详解HTML5如何使用可选样式表为网站或应用添加黑暗模式
2020/04/07 HTML / CSS
荷兰鞋子在线:Nelson Schoenen
2017/12/25 全球购物
大学生职业生涯规划书
2014/03/14 职场文书
八月迷情观后感
2015/06/11 职场文书
2015年征兵工作总结
2015/07/23 职场文书
跟班学习心得体会(共6篇)
2016/01/23 职场文书
创业计划书之少年玩具店
2019/09/05 职场文书
Python中threading库实现线程锁与释放锁
2021/05/17 Python
利用Python+OpenCV三步去除水印
2021/05/28 Python
使用vuex-persistedstate本地存储vuex
2022/04/29 Vue.js
MySQL的表级锁,行级锁,排它锁和共享锁
2022/07/15 MySQL