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中的值类型和引用类型小结 文字说明与实例
Dec 12 Javascript
js判断屏幕分辨率的代码
Jul 16 Javascript
Jquery获得控件值的三种方法总结
Feb 13 Javascript
jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析
Jun 09 Javascript
JS中mouseover和mouseout多次触发问题如何解决
Jun 06 Javascript
Javascript中apply、call、bind的巧妙使用
Aug 18 Javascript
vue2组件实现懒加载浅析
Mar 29 Javascript
在Vue组件上动态添加和删除属性方法
Feb 23 Javascript
Webpack打包字体font-awesome的方法示例
Apr 26 Javascript
jQuery中将json数据显示到页面表格的方法
May 27 jQuery
20多个小事例带你重温ES10新特性(小结)
Sep 29 Javascript
jQuery实现简单三级联动效果
Sep 05 jQuery
再谈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 代码优化之经典示例
2011/03/24 PHP
Thinkphp框架中D方法与M方法的区别
2016/12/23 PHP
BOOM vs RR BO5 第一场 2.14
2021/03/10 DOTA
javascript 进阶篇1 正则表达式,cookie管理,userData
2012/03/14 Javascript
jquery zTree异步加载简单实例分享
2013/02/05 Javascript
display和visibility的区别示例介绍
2014/02/26 Javascript
JavaScript常用的返回,自动跳转,刷新,关闭语句汇总
2015/01/13 Javascript
浅谈javascript实现八大排序
2015/04/27 Javascript
判断访客终端类型集锦
2015/06/05 Javascript
js实现简单折叠、展开菜单的方法
2015/08/28 Javascript
详解Node.js模块间共享数据库连接的方法
2016/05/24 Javascript
JavaScript定时器实现的原理分析
2016/12/06 Javascript
js canvas实现放大镜查看图片功能
2017/06/08 Javascript
详细分析jsonp的原理和实现方式
2017/11/20 Javascript
Node.js Express安装与使用教程
2018/05/11 Javascript
jquery实现购物车基本功能
2019/10/25 jQuery
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
2020/07/09 Javascript
[01:28]2014DOTA2国际邀请赛中国区预选赛四大豪门直升机抵达会场
2014/05/24 DOTA
Python实现比较两个列表(list)范围
2015/06/12 Python
python使用itchat库实现微信机器人(好友聊天、群聊天)
2018/01/04 Python
Python机器学习logistic回归代码解析
2018/01/17 Python
在pycharm 中添加运行参数的操作方法
2019/01/19 Python
pyqt5 禁止窗口最大化和禁止窗口拉伸的方法
2019/06/18 Python
Python实现中英文全文搜索的示例
2020/12/04 Python
英国美发和美容产品商城:HQhair
2019/02/08 全球购物
教学质量评估实施方案
2014/03/17 职场文书
行政人事岗位职责
2014/03/17 职场文书
申论倡议书范文
2014/05/13 职场文书
创优争先心得体会
2014/09/11 职场文书
2015年行政人事工作总结
2015/05/21 职场文书
2015中学政教处工作总结
2015/07/22 职场文书
2015年机关作风和效能建设工作总结
2015/07/23 职场文书
七年级作文之《我和我的祖国》观后感作文
2019/10/18 职场文书
Python机器学习之PCA降维算法详解
2021/05/19 Python
一定要知道的 25 个 Vue 技巧
2021/11/02 Vue.js
Golang 对es的操作实例
2022/04/20 Golang