ES6 let和const定义变量与常量的应用实例分析

本文实例讲述了ES6 let和const定义变量与常量的应用。分享给大家供大家参考,具体如下:

关于 let

  • let是小作用域的变量的声明
{
  var a = 12;
  let b = 15;
  {
   console.log(a); // 12
   console.log(b); // 15
  }
}
  • let 是块级作用域,不会被提升;var是函数级的变量,存在变量提升,外部可访问
console.log(a); // Uncaught ReferenceError: a is not defined,直接报错
let a = 12; // let定义的变量不能进行变量的提升
console.log(b); // undefined
var b = 12;
// 上面的过程存在变量提升过程如下:
/*
var b;
console.log(b);
b = 12;
*/
  • {} 块级作用域,子集可访问,外部不可访问
{
 var a = 12;
 let b = 15;
 console.log(b); // 15
}
console.log(a); // 12
console.log(b); // Uncaught ReferenceError: b is not defined
  • let 在for循环中有效, var 在for循环外仍有效
for(var i=0;i<5;i++) {}
console.log(i); // 5
for(let m=0;m<5;m++){}
console.log(m); // Uncaught ReferenceError: m is not defined
  • 变量在外部定义后,在内部输出,然后再次使用let关键词声明,那么之前输出会【失效】报错
var a = 18;
var b = 10;
fun();
function fun(){
 console.log(b); // 10
 console.log(a); // Uncaught ReferenceError: a is not defined
 let a;
}
  • 使用let声明的变量唯一, 不能重复声明
let a;
var a; // Uncaught SyntaxError: Identifier 'a' has already been declared
  • {} 块级作用域等效于立即执行函数
var config = (function () {
 var res = [];
 res.push(1);
 res.push(2);
 res.push(3);
 return res;
})();
console.log(config); // [1,2,3]
let config;
{
 config = [];
 config.push(1);
 config.push(2);
 config.push(3);
}
console.log(config); // [1,2,3]
  • 严格模式下的函数不会被提升
'use strict';
function a(){console.log(1);}
(function () {
 a(); // 去除'use strict' 之后 报错:a is not a function,加上'use strict'之后正常,输出1
 if(false) {
  function a(){console.log(2);} // 此处重新声明和赋值了一个a函数,上面输出1的时候表示没有被提升
 }
})();
  • 使用var在for循环中定义的变量保持最后一个值的状态
var arr = [];
for(var i=0;i<5;i++) {
 arr.push(function () {
  console.log(i);
 })
}
arr[1](); // 5
  • 使用var在for循环中定义的变量可使用自执行函数和闭包维持变量的状态
var arr = [];
for(var i=0;i<5;i++) {
 arr.push((function (i) {
  return function () {
   console.log(i);
  }
 })(i));
}
arr[1](); // 1
  • 使用let在for循环中定义的变量可自动维持变量的状态
var arr = [];
for(let i=0;i<5;i++) {
 arr.push(function () {
  console.log(i);
 })
}
arr[1](); // 1

关于 const

  • 所有属性同let
  • 使用const定义的是常量不可被修改,而指针对象的地址不可被修改,其属性可以被修改
const a = {
 name:'J'
};
a.name = 'Z';
a.age = 10;
console.log(a); // {name: "Z", age: 10}
a = {}; // 尝试修改引用的地址
console.log(a); // Uncaught TypeError: Assignment to constant variable.
  • 使用Object的freeze进行冻结对象, 严格模式下会报错,非严格模式下无法修改
const a = {
 name:'K'
}
a.age = 13;
console.log(a); // {name: "K", age: 13}
Object.freeze(a);
a.age = 14;
console.log(a); // Uncaught TypeError: Cannot assign to read only property 'age' of object '#<Object>'

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

(0)

相关推荐

  • JS变量中有var定义和无var定义的区别以及es6中let命令和const命令

    之前我们在写js代码的时候都知道可以用var定义全局变量和局部变量,也可以省略var,而且在非严格模式下不会报错,但是并不知道两者的区别... var x = 1; y = 4; console.log(x);//1 console.log(y);//4 console.log(window.x);//1 console.log(window.y);//4 简单测试下可以知道定义的x和y都被挂载在window对象上,变为window下的属性,这并不能说明什么... delete x; delet

  • 深入理解ES6中let和闭包

    本文介绍了深入理解ES6中let和闭包,分享给大家,具体如下: 在开始本文之前我们先来看一段代码 for(var i=0;i<10;i++){ arr[i]=function(){ return i; } } console.log(arr[3]());//10 显然这段代码输出10,并没有向我们期望的返回3,原因也很简单(js的变量提升)函数在调用时候访问的是一个全局作用域的i,此时for循环已经执行完毕,全局变量i=10: 在ES5标准中,我们要想返回期望的3,通常的做法也很简单,就是让数组

  • 深入浅出ES6之let和const命令

    let和const声明的变量只在代码块内有效 { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 不存在变量提升 变量一定要在声明后使用,否则报错 var tmp = 123; if (true) { tmp = 'abc'; // ReferenceError let tmp; } 不允许重复声明 // 报错 function () { let a = 10; var a = 1; } 块级作用域 f

  • JavaScript ES6中const、let与var的对比详解

    ECMAScript 6 新增 const 和 let 命令,用来声明变量. 声明方式 变量提升 作用域 初始值 重复定义 const 否 块级 需要 不允许 let 否 块级 不需要 不允许 var 是 函数级 不需要 允许 变量提升:const 和 let 必须先声明再使用,不支持变量提升 console.log(c1, l1, v1); // 报错 // Uncaught ReferenceError: c1 is not defined const c1 = 'c1'; let l1 =

  • ES6入门教程之let、const的使用方法

    一.前提 解决ES5中只有全局作用域和函数作用域,没有块级作用域而带来的不合理的场景. let 基本用法 用法和var 一样,只是let声明的变量只有在let命令所在的代码块有效 { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 可以看出var 声明的变量在代码块之外也是可以调用,而let声明的则调用报错.所以let 声明只在它声明的当前代码块中才能调用. 变量提升 在使用 var 的时候会出现 "变

  • 详解ES6中的let命令

    let是ES6里面新的复制命令,let赋值命令只可以在{}代码块中被调用.下面通过实例给大家讲解es6中的let命令,具体内容如下所示: 1.let命令的用法和var命令类似,但let命令声明的变量只在let所在的代码块内有效 { let a=10; var b=1; } console.log(a);//Uncaught ReferenceError: a is not defined console.log(b); 2.let命令不存"声明提前"现象,因此变量一定要先声明,后使用

  • ES6入门教程之let和const命令详解

    前言 在javascript中,我们都知道使用var来声明变量.javascript是函数级作用域,函数内可以访问函数外的变量,函数外不能访问函数内的变量. 函数级作用域会导致一些问题就是某些代码块内的变量会在全局范围内有效,这我们是非常熟悉的: for (var i = 0; i < 10; i++) { console.log(i); // 0,1,2...,9 } console.log(i); //10 if(true){ var s = 20; } console.log(s); //

  • ES6新特性一: let和const命令详解

    本文实例讲述了ES6新特性中的let和const命令.分享给大家供大家参考,具体如下: 1. let 命令 ① 在js中是没有块级作用域的,var 声明的变量作用域是整个函数体,而let可以起到这一作用 { let a = 1; var b = 2; } console.log(b); // 2 console.log(a); // a is not defind ② 而let可以起到这一作用啊在js中变量和函数的声明会提升到当前作用域最顶部执行.这样就会出现问题. var a = []; //

  • ES6深入理解之“let”能替代”var“吗?

    前言 我已经使用ES2015(ES6)的语法编写JavaScript程序很久了,并且喜欢上它提供的新特性带来的优雅和简洁.我最习惯的就是不再使用var,而是let/const.我想当然的以为let仅仅是var的替代者,而事实上let还为我们提供了更加精细的作用域. 我大多数时候使用的变量都是用const来声明,因为如果尝试对使用const声明的变量进行修改,将会报错.这可以避免不小心将一个不该修改的常量值修改.但是,我们还是需要可以声明可以被修改的变量,比如在循环里面的计数器,我们需要不断地对改

  • ES6中let 和 const 的新特性

    在javascript中,我们都知道使用var来声明变量.javascript是函数级作用域,函数内可以访问函数外的变量,函数外不能访问函数内的变量.本文给大家介绍ES6中let 和 const 的特性,具体内容如下所示: let的特性: 1.不存在变量提升现象:即声明前使用,报ReferenceError.适用于for循环计数器. 2.暂时性死区:即在块级作用域内使用let声明变量,该变量只能在该作用域内使用. 3.不允许重复声明:let声明过的变量不能再次声明,否则报错. const的特性:

随机推荐