理解:let变量的作用域只能在当前函数中

js中const,let,var的区别及作用域_lianzhang861的博客-CSDN博客​blog.csdn.net

全局作用域中,用 const 和 let 声明的变量不在 window 上,那到底在哪里?如何去获取?​blog.csdn.net

早期的JavaScript中,声明变量只能使用var关键字定义变量,并没有定义常量的功能。通过var关键字定义的变量,其作用域只能函数级或是全局作用域,并没有块级作用域ES6(ECMAScript 2015)对这一问题做了改善,增加了用于定义块级变量的let关键字和用于定义常量的const关键字

JavaScript let 和 const

ECMAScript 2015(ECMAScript 6)

ES2015(ES6) 新增加了两个重要的 JavaScript 关键字: letconst

let 声明的变量只在 let 命令所在的代码块内有效。

const 声明一个只读的常量,一旦声明,常量的值就不能改变。

在 ES6 之前,JavaScript 只有两种作用域: 全局变量函数内的局部变量

  1. var定义变量
  • 1.1 语法及说明
  • 1.2 使用及特点
  1. let定义块级变量
  • 2.1 语法及说明
  • 2.2 与var的异同
  1. const定义常量

1. var定义变量

1.1 语法及说明

var关键字用于声明一个或多个变量,声明多个变量时使用逗号(,)分隔,声明变量的同时可以对其初始化。

语法法结构如下:

var varname1 [= value1 [, varname2 [, varname3 ... [, varnameN]]]];

  • varname1…varnameN - 变更名。可以是任何合法的标识符。
  • value1…valueN - 初始化值。可选。可以是任何合法的表达式。

使用var声明变量时,声明的变量作用域是在当前位置的上下文件中:函数的内部(声明在函数内)或者全局(声明在函数外)。

1.2 使用及特点

使用var定义的变量有以下特点:

变量声明提升

无论在代码的任何位置声明变量,执行引擎都会在任何代码执行之前处理。由于这个原因,所以在代码中的任意位置声明变量与在代码开头声明变量是等效的。

这意味着我们可以在定义变量之前使用,这个行为叫做'hoisting',也就是把所有的变量声明移动到函数或者全局代码的开头位置。

hoist = 'http://itbilu.com';
var hoist;// 可以理解为:
var hoist;
hoist = 'http://itbilu.com';

注意:虽然变量声明提升让我们可以先使用再定义变量,但建议总是先定义再使用变量,这样可以让变量的作用域更加清晰。

声明与未声名变量的区别

未声明的变量会被添加一个全局作用域,而声明变量作用域是当前上下文:

function x() {y = 1;   // 在严格模式下会抛出ReferenceErrorvar z = 2;
}
x();console.log(y); // '1'
console.log(z); // ReferenceError: z is not defined

声明变量在任何代码执行前创建,而未声明的变量只有在执行赋值操作的时候才会被创建:

console.log(a);  // 抛出ReferenceError。
console.log('still going...'); // 不会执行
var a;
console.log(a);  // "undefined"或""(不同执行引擎的实现不同)
console.log('still going...'); // 'still going...'

声明变量是不可配置属性,而未声明变量是可配置的:

var a = 1;
b = 2;delete this.a; // 在严格模式下抛出TypeError,非严格模式下执行失败且无任何提示
delete this.b;console.log(a, b); // 抛出ReferenceError,'b'属性已经被删除

以上三点是声明与未声明变量区别,但错误表现是不可预知的。而在严格模型下,使用未赋值的变量会抛出异常,推荐总是先定义(声明)再使用变量。

全局作用域与函数作用域

函数内部声明的变量只能在函数内部使用,函数外部声明的变量可以全局使用:

var x = 0;function f(){var x = 1, y = 1;
}
f();console.log(x); // 0
console.log(y); // ReferenceError: y is not defined

2. let定义块级变量

2.1 语法及说明

let用于定义块级变量,其语法结构类似于var

let varname1 [= value1 [, varname2 [, varname3 ... [, varnameN]]]];

var声明的变量是函数级的或者是全局的,而let用于声明块级作用域。

如,使用let声明一个块级变量:

if (x > y) {let gamma = 12.7 + y;i = gamma * x;
}

2.2 与var的异同

letvar的区别主要体现在作用域上,当在子代码块中使用中其声明的是块级变量,而var声明的是全局变量:

var a = 5;
var b = 10;if (a === 5) {let a = 4; // if 块级作用域var b = 1; // 函数级作用域console.log(a);  // 4console.log(b);  // 1
} console.log(a); // 5
console.log(b); // 1

在函数或程序顶层使用时,letvar没有什么区别:

var x = 'global';
let y = 'global';
console.log(this.x);  // 'global'
console.log(this.y);  // 'global'

3. const定义常量

const用于声明一个或多个常量,声明时必须进行初始化,且初始化后值不可再修改:

const name1 = value1 [, name2 = value2 [, ... [, nameN = valueN]]];

const定义常量与使用let定义变量十分相似:

  • 二者都是块级作用域
  • 都不能和它所在作用域内的其他变量或函数拥有相同的名称

两者还有以下两点区别:

  • const声明的常量必须初始化,而let声明的变量不用
  • 常量的值不能通过再赋值改变,也不能再次声明。而变量值可以修改

通过 const 定义的变量与 let 变量类似,但不能重新赋值:

实例

const PI = 3.141592653589793;
PI = 3.14;      // 会出错
PI = PI + 10;   // 也会出错

块作用域

块作用域内使用 const 声明的变量与 let 变量相似。

在本例中,x 在块中声明,不同于在块之外声明的 x:

实例

var x = 10;
// 此处,x 为 10
{ const x = 6;// 此处,x 为 6
}
// 此处,x 为 10

在声明时赋值
JavaScript const 变量必须在声明时赋值:

不正确
const PI; PI = 3.14159265359; 正确
const PI = 3.14159265359;

不是真正的常数
关键字 const 有一定的误导性。
它没有定义常量值。它定义了对值的常量引用。
因此,我们不能更改常量原始值,但我们可以更改常量对象的属性。

原始值
如果我们将一个原始值赋给常量,我们就不能改变原始值:

实例

const PI = 3.141592653589793; PI = 3.14;      // 会出错 PI = PI + 10;   // 也会出错

常量对象可以更改

您可以更改常量对象的属性:

实例

// 您可以创建 const 对象:
const car = {type:"porsche", model:"911", color:"Black"};// 您可以更改属性:
car.color = "White";// 您可以添加属性:
car.owner = "Bill";

但是您无法重新为常量对象赋值:

实例

const car = {type:"porsche", model:"911", color:"Black"};
car = {type:"Volvo", model:"XC60", color:"White"};    // ERROR

常量数组可以更改

您可以更改常量数组的元素:

实例

// 您可以创建常量数组:
const cars = ["Audi", "BMW", "porsche"];// 您可以更改元素:
cars[0] = "Honda";// 您可以添加元素:
cars.push("Volvo");

但是您无法重新为常量数组赋值:

实例

const cars = ["Audi", "BMW", "porsche"];
cars = ["Honda", "Toyota", "Volvo"];    // ERROR

重新声明

在程序中的任何位置都允许重新声明 JavaScript var 变量:

实例

var x = 2;    //  允许
var x = 3;    //  允许
x = 4;        //  允许

在同一作用域或块中,不允许将已有的var或let变量重新声明或重新赋值给const:

实例

var x = 2;         // 允许
const x = 2;       // 不允许
{let x = 2;     // 允许const x = 2;   // 不允许
}

在同一作用域或块中,为已有的 const 变量重新声明声明或赋值是不允许的:

实例

const x = 2;       // 允许
const x = 3;       // 不允许
x = 3;             // 不允许
var x = 3;         // 不允许
let x = 3;         // 不允许{const x = 2;   // 允许const x = 3;   // 不允许x = 3;         // 不允许var x = 3;     // 不允许let x = 3;     // 不允许
}

在另外的作用域或块中重新声明 const 是允许的:

实例

const x = 2;       // 允许{const x = 3;   // 允许
}{const x = 4;   // 允许
}

提升

通过 var 定义的变量会被提升到顶端。如果您不了解什么是提升(Hoisting),请学习提升这一章。

您可以在声明 var 变量之前就使用它:

实例

carName = "Volvo";    // 您可以在此处使用 carName
var carName;

通过 const 定义的变量不会被提升到顶端。

const 变量不能在声明之前使用:

实例

carName = "Volvo";    // 您不可以在此处使用 carName
const carName = "Volvo";

uniapp 获取到js文件var一个变量怎么获取到这个变量值_浅析Js中const,let,var的区别及作用域...相关推荐

  1. python变量存储 堆与栈内存内存_浅析JS中的堆内存与栈内存

    最近跟着组里的大佬面试碰到这么一个问题, Q:说说var.let.const的区别 A:balabalabalabla... Q:const定义的值能改么? A:你逗我?不能吧 不知道各位看官怎么想? ...

  2. 用final关键字修饰一个变量时,是引用不能变,还是引用的对象不能变

    使用final关键字修饰一个变量时,是引用不能变,还是引用的对象不能变 答: 使用final关键字修饰一个变量时,是指引用变量不能变,引用变量所指向的对象中的内容还是可以改变的. 代码 public ...

  3. 四种“不使用第三方变量就可以交换两个变量值”的方法

    问题引入: 遇到交换变量值的问题,通常我们的做法是:定义一个新的变量,借助它完成交换. 代码如下: t = a; a = b; b = t; 在这里插入代码片 但问题的重点是"不使用第三方变 ...

  4. Node.js用6行代码1个JS文件搭建一个HTTP静态服务器

    2019独角兽企业重金招聘Python工程师标准>>> Node.js宣言:Node.js is a platform built on Chrome's JavaScript ru ...

  5. 前端wxml取后台js变量值_这些鲜为人知的前端冷知识,你都GET了吗?

    背景 最近公司项目不多,比较清闲,划水摸鱼混迹于各大技术博客平台,瞬间又GET了好多前端技能,一些属于技巧,一些则是闻所未闻的冷知识,一时间还消化不过来,不由的发出一声感叹! 前端可真是博大精深 于是 ...

  6. 前端wxml取后台js变量值_微信小程序云开发教程WXML入门数据绑定

    同学们大家好,我是小伊同学,今天带领大家学习WXML部分一个重要的知识点,数据绑定. 简单来讲,数据绑定就是通过双重花括号将一个变量绑定到界面上. 首先,我们为什么要将变量绑定到页面上呢?因为在制作一 ...

  7. 环境变量 变量名 变量值_如何使用环境变量

    环境变量 变量名 变量值 Environment variables are a set of dynamic named values that can affect the way running ...

  8. java变量同名_浅析Java中局部变量与成员变量同名解决技巧

    要想区分这哥俩,首先,我们得知道它们分别是什么.先从成员变量下刀. 成员变量 我们来研究一个事物: 属性:外在特征:例如人的身高,体重 行为:能够做什么:例如人有说话,打球等行为. 而在Java语言中 ...

  9. js中const,var,let的区别

    1.const 定义的变量不可以被修改,而且必须初始化. const b = 2;//正确// const b;//错误,必须初始化 console.log('函数外const定义b:' + b);/ ...

最新文章

  1. 安全设置Windows组策略 有效阻止黑客
  2. NYOJ 721 纸牌游戏 简单题
  3. boost::mp11::mp_rotate_right相关用法的测试程序
  4. MOCTF-Web-一道水题
  5. python目标跟踪精度曲线图_Python+opencv3.4+Kalman滤波在视频中跟踪绘制运动目标,Pythonopencv34kalman,卡尔曼滤波,实现,物体,追踪,和,轨迹...
  6. Croppic – 免费开源的 jQuery 图片裁剪插件
  7. 行云管家堡垒机的使用方法之二——新增登录凭证
  8. python对比数据的原理_Python3 filecmp模块测试比较文件原理解析
  9. css如何让动作有先后,css3动作
  10. python编辑器使用技巧大全_markdown编辑器常用功能汇总
  11. 测试电池损耗的软件运行原理,鲁大师电池损耗检测准确?鲁大师电池损耗检测原理解析...
  12. python股票收益率计算_股票分析之——收益率(附完整代码和讲解)
  13. µC/OS-II Release Notes
  14. 常用网络测试命令——ping命令
  15. 远程桌面连接设置详细步骤
  16. Electron开发桌面应用(一) Helloworld
  17. cad渐开线齿轮轮廓绘制_CAD画齿轮的方法
  18. 全自动浅层过滤器的后期维护
  19. 陆游和唐婉,潇潇和沐月
  20. java旋转角度_java – 如何确定旋转图像的最终位置或角度

热门文章

  1. Redis的key和value大小限制
  2. solr7.4 安装与使用
  3. 梦回JavaScript--数据类型之undefined
  4. 解决 kindle 书籍字体颜色偏淡问题的方法
  5. Effective Java 英文 第二版 读书笔记 Item 14:In public classes,use accessor methods,not public fields...
  6. SlidingMenu的使用,结合Fragment(eclipse环境)
  7. javascript --- 函数的柯里化 Vue 2.x中柯里化的使用
  8. css --- [小结]让盒子水平垂直居中的解决方案
  9. css --- 选择器
  10. ES5-5 参数默认值、递归、预编译、暗示全局变量