javascript变量提升
提升是一种将变量和函数的声明移到函数作用域(如果不在任何函数内的话就是全局作用域)最顶部的机制。
提升影响了变量的生命周期,一个变量的生命周期包含3个阶段:
声明——创建一个新变量,例如var myValue;
初始化——用一个值初始化变量,例如myValue=150;
使用——使用变量的值,例如alert(myValue)。
javascript并没有严格遵循这个顺序,因此提供了更多的灵活性。比如:函数的使用可以在声明之前。
这是因为javascript的函数声明会被提升到作用域顶部。
变量提升在不同方面的影响也不同:
变量声明:使用var ,let ,const关键字
函数声明:使用function(){......}语法
类声明:使用class关键字
函数声明在函数作用域内创建并初始化一个变量。默认情况下,声明但是未初始化的变量的值是undefined。
1.提升var:使用var声明的变量会被提升到所在函数作用域的顶部,如果在声明之前访问该变量,它的值会是undefined。虽然它的声明提升了,但是它的赋值没有提升到函数作用域顶部,依然留在原地。
function sum(a,b){
var myString; //提升到顶部
console.log(myString); //undefined
myString="HelloWorld"; //赋值不受影响
console.log(myStriing); //‘HelloWorld’
return a+b;
}
2.块级作用域变量:let
let声明在块级作用域内创建并初始化一个变量:默认情况下,声明但是未初始化的变量的值是undefined。
let是ECMAScript6引入的一个巨大的改进,它允许代码在代码块的级别上保持模块性和封装性;
使用let定义的变量会被提升到代码块的顶部。但是如果在声明前访问该变量,javascript会抛出异常ReferenceError:is not defined。
在声明语句一直到代码库的顶部,变量都好像在一个临时死亡区间中一样,不能被访问。
function isTruthy(value){
var myVariable='Value 1';
console.log(myVariable); //Value1
if(value){
console.log(myVariable); //ReferenceError:myVariable is not defined,临时死亡区
let myVariable='Value 2';
console.log(myVariable); //Value 2
return true;
}
}
以上代码可以确认let变量确实被提升了。
let在块级作用域内提升保护了变量不受外层作用域影响。先声明,后使用。
3.常量const
常量声明在块级作用域内创建并初始化一个常量:当声明一个变量时,必须在同一条语句中对该变量进行初始化。在声明与初始化之后,变量的值不能被修改。
使用const定义的常量会被提升到代码块的顶部。由于存在临时死亡区间,常量在声明之前不能被访问。常量提升效果与let声明变量的效果相同。
4.函数声明:函数声明使用提供的名称和参数创建一个函数
函数声明的提升允许你在所属作用域内任何地方使用该函数,即使在声明之前也可以。函数可以在当前作用域或子作用域内的任何地方访问。
注意:函数声明function(){....}和函数表达式var=function(){.....}之间的区别
5.类声明
类声明会被提升到块级作用域的顶部。但是如果你在声明前使用类,javascript会抛出异常。先声明类,然后创建实例。与let的提升效果类似。
javascript变量提升的更多相关文章
- 回归基础: JavaScript 变量提升
from me: javascript的变量声明具有hoisting机制,它是JavaScript一个基础的知识点,也是一个比较容易犯错的点,平时在开发中,大大小小的项目都会遇到. 它是JavaScr ...
- JavaScript变量提升 面试题
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- JavaScript变量提升和函数声明预解析
1.首先理解函数作用域 在JavaScript中,变量的定义并不是以代码块作为作用域的,而是以函数作用作用域的.也就是说,如果变量是在某个函数中定义的,那么它在函数以外的地方是不可见的.而如果该变量是 ...
- 最通俗易懂的javascript变量提升
a = 'ghostwu'; var a; console.log( a ); 在我没有讲什么是变量提升,以及变量提升的规则之前, 或者你没有学习过变量提升,如果按照现有的javascript理解, ...
- javascript变量提升详解
js变量提升 对于大多数js开发者来说,变量提升可以说是一个非常常见的问题,但是可能很多人对其不是特别的了解.所以在此,我想来讲一讲. 先从一个简单的例子来入门: a = 2; var a; cons ...
- JavaScript 变量提升
变量提升(Hoisting):在ES6之前,函数声明和变量声明总是被JavaScript解释器隐式地提升(hoist)到包含他们的作用域的最顶端. 注意: 1. JavaScript 仅提升声明,而不 ...
- 160622、详解JavaScript变量提升
变量在程序中随处可见.它们是一些始终在相互影响,相互作用的的数据和逻辑.正是这些互动使应用程序活了起来. 在JavaScript中使用变量很重要的一方面就是变量的提升 —— 它决定了一个变量何时可以被 ...
- 详解JavaScript变量提升
变量在程序中随处可见.它们是一些始终在相互影响,相互作用的的数据和逻辑.正是这些互动使应用程序活了起来. 在JavaScript中使用变量很重要的一方面就是变量的提升 —— 它决定了一个变量何时可以被 ...
- 对javascript变量提升跟函数提升的理解
在写javascript代码的时候,经常会碰到一些奇怪的问题,例如: console.log(typeof hello); var hello = 123;//变量 function hello(){ ...
随机推荐
- Reflector+Reflexil 相结合实现对DLL文件修改
在工作过程中,我们有可能遇到这样的问题:公司发给客户的软件包突然报错了,但是你知道哪里报错了,而这个代码已经编译成DLL文件了,源代码不在自己这里.怎么办呢?还好现在有Reflexil插件,这个插件只 ...
- BZOJ_1096_[ZJOI2007]_仓库建设_(斜率优化动态规划+单调队列+特殊的前缀和技巧)
描述 http://www.lydsy.com/JudgeOnline/problem.php?id=1096 有\(n\)个工厂,给出第\(i\)个工厂的到1号工厂的距离\(x[i]\),货物数量\ ...
- POJ_2566_Bound_Found_(尺取法+前缀和)
描述 http://poj.org/problem?id=2566 给出一个整数序列,并给出非负整数t,求数列中连续区间和的绝对值最接近k的区间左右端点以及这个区间和的绝对值. Bound Found ...
- Mac OS X 10.10(yosemite)更新后,cocoapods出错, 及cocoapods更新至0.34后, 错误情况整理
1:Mac升级10.10后,执行pod install出错如下 QTX-Will-mini:NewHishop willbin$ pod install [!] Unable to load a sp ...
- HDU-5414 CRB and String
http://acm.hdu.edu.cn/showproblem.php?pid=5414 题意:给定字符串s和t,可以在s里面选一个字符c,然后任选一个字符d(d!=c)将d插入到c的后面,问能不 ...
- Prism简介
Prism是由微软Patterns & Practices团队开发的项目,目的在于帮助开发人员构建松散耦合的.更灵活.更易于维护并且更易于测试的WPF应用或是Silverlight应用以及Wi ...
- 【VLFeat】使用matlab版本计算HOG
下载 vlfeat-0.9.18 http://www.vlfeat.org cd D:\program\vlfeat-0.9.18\toolbox
- SSDT – Error SQL70001 This statement is not recognized in this context-摘自网络
March 28, 2013 — arcanecode One of the most common errors I get asked about when using SQL Server Da ...
- 写入目录 /tmp/OraInstall2015-05-20_03-35-53PM 时出错
做足准备工作之后进行安装oracle,运行runInstall的时候别的时候输出如下错误 写入目录 /tmp/OraInstall2015-05-20_03-35-53PM 时出错.请确保此目录是可写 ...
- SweetAlert 使用
$(".delete").click(function(){ var work_name = $(this).data('name'); var item_id = $(this) ...