1. var声明变量和变量提升(Hoisting)机制的问题

在JS中通过var关键字声明的变量,无论在函数作用域中亦或是全局作用域中,都会被当成当前作用域顶部的变量,和就是所谓的提升机制(Hoisting)。但是提升机制会带来一个问题就是,预编译阶段JS引擎会将变量提升至作用域顶部,但是初始化操作是在某个作用域中,进而导致了引用了该变量的其他作用域并没有被初始化,也就导致在浏览器看到undefined的结果。具体可看如下伪代码:

function printValue(condition) {
if (condition) {
var count = 10;
console.log('if ' + count);
} else {
// 此处如果访问count,则会在控制台打印undefined
console.log('else ' + count);
}
// 此处如果访问count,会在控制台打印10
console.log('Out side of Scope ' + count);
} printValue(true);
printValue(false);
function printValue(condition) {
var count = 10;
if (condition) {
console.log('if ' + count);
} else {
// 此处如果访问count,则会在控制台打印undefined
console.log('else ' + count);
}
// 此处如果访问count,会在控制台打印10
console.log('Out side of Scope ' + count);
} printValue(true);
printValue(false);

块级作用域的引入解决了上述问题,块级作用域存在于:

  • 函数内部;
  • { statements }之中;

那么如何声明块级作用域呢?ES6语法中引入了let声明,用法和var一致,但是可以把变量的作用域限制在当前的代码块中,也就顺带解决了Hoisting所带来的问题。

2. const声明

const声明的是常量,因此const声明常量的时候必须进行初始化。这里需要注意的是ES6语法中,如果使用const声明的是普通变量,那么是不可再被赋值修改的;但是如果定义的常量是对象,那么对象中的属性的值是可以修改的。

const company = {
companyName: 'ABC Ltd',
legalPerson: 'Nicholas'
}; // 可以修改对象属性的值
company.companyName = 'XYZ Ltd'; // 下面则会抛出语法错误,这里需要注意的一个区别是直接给对象的属性重新赋值是改变了绑定,就会抛出错误
company = {
companyName: 'XYZ Ltd',
legalPerson: 'Nicholas'
}

ES6学习笔记(1)- 块级作用域的更多相关文章

  1. ES6学习笔记之块级作用域

    ES6学习笔记:块级作用域 作用域分类 全局作用域 局部作用域 块级作用域 全局作用域示例 var i=2; for (var i = 0; i < 10; i++) { } console.l ...

  2. ES6入门一:块级作用域(let&const)、spread展开、rest收集

    let声明 const声明 块级作用域 spread/rest 一.let声明与块作用域 在ES6之前,JavaScript中的作用域基本单元就是function.现在有了let就可以创建任意块的声明 ...

  3. ES6 学习笔记之一 块作用域与let和const

    ---恢复内容开始--- 在学习ES6的块作用域和 let.const 之前,我们先来看看ES5以前的 var 关键字. var 关键字用于定义一个变量,通常我们会将其与变量的赋值合并为一条语句,就像 ...

  4. ES6系列之let/const及块级作用域

    本系列是在平时阅读.学习.实际项目中有关于es6中的新特性.用发的简单总结,目的是记录以备日后温习:本系列预计包含let/const.箭头函数.解构.常用新增方法.Symbol.Set&Map ...

  5. ES6——块级作用域

    前面的话 过去,javascript缺乏块级作用域,var声明时的声明提升.属性变量等行为让人困惑.ES6的新语法可以帮助我们更好地控制作用域.本文将详细介绍ES6新引入的块级作用域绑定机制.let和 ...

  6. ES6-let、const和块级作用域

    1.介绍 总的来说,ES6是在ES2015的基础上改变了一些书写方式,开放了更多API,这样做的目的最终还是为了贴合实际开发的需要.如果说一门编程语言的诞生是天才的构思和实现,那它的发展无疑就是不断填 ...

  7. ES6 学习笔记 - let和const

    let 和 const 命令 学习资料:ECMAScript 6 入门 let 所声明的变量,只在let命令所在的代码块内有效.用途:循环计数器. 如果使用var,只有一个全局变量i: var a = ...

  8. 《浏览器工作原理与实践》<09>块级作用域:var缺陷以及为什么要引入let和const?

    在前面我们已经讲解了 JavaScript 中变量提升的相关内容,正是由于 JavaScript 存在变量提升这种特性,从而导致了很多与直觉不符的代码,这也是 JavaScript 的一个重要设计缺陷 ...

  9. let/const及块级作用域

    本系列是在平时阅读.学习.实际项目中有关于es6中的新特性.用发的简单总结,目的是记录以备日后温习:本系列预计包含let/const.箭头函数.解构.常用新增方法.Symbol.Set&Map ...

  10. ES6学习笔记一

    块级作用域:在ES5中只有全局作用域与函数作用域,ES6中新增的块级作用域避免变量的覆盖与泄露.考虑到代码运行环境,在块级作用域中应避免声明函数,最好用函数表达式的方式声明. let与const:le ...

随机推荐

  1. Gym102361A Angle Beats(直角三角形 计算几何)题解

    题意: \(n\)个点,\(q\)个询问,每次问包含询问点的直角三角形有几个 思路: 代码: #include<bits/stdc++.h> using namespace std; co ...

  2. for-in循环等

    一.for-in循环 in表示从(字符串.序列等)中一次取值,又称为遍历 其便利对象必须是可迭代对象 语法结构: for 自定义的变量 in 可迭代对象: 循环体 for item in 'Pytho ...

  3. Subresource Integrity,SRI,Cross-Origin Resource Sharing (CORS),子资源的完整性检查,Subresource Integrity checking,CORS,Ajax

    SRI https://code.jquery.com/ SRI是一种新的W3C规范,它允许Web开发人员,以确保托管在第三方服务器上的资源是没有被篡改的.SRI的使用,建议作为最佳实践,每当库从第三 ...

  4. CSP & CORS

    CSP & CORS 内容安全策略 跨域资源共享 CSP https://developers.google.com/web/fundamentals/security/csp google ...

  5. Learn-JavaScript-with-MDN 系列文章: 01. var & let & const 对比

    Learn-JavaScript-with-MDN 系列文章: 01. var & let & const 对比 var & let & const 区别 https: ...

  6. c++ DWORD和uintptr_t

    x86模式 DWORD 是4字节 x86模式 uintptr_t 是4字节 x64模式 DWORD 是4字节 x64模式 uintptr_t 是8字节 std::cout << sizeo ...

  7. 科普NGK公链生态板块旗下的BGV、SPC、NGK、USDN四大币种

    众所周知,NGK公链所有数据上链.公开透明,NGK公链生态板块目前主要分为四个板块---BGV.SPC.NGK.USDN四大币种,笔者以时间上倒叙手法来一一科普. 首先,是2021新年刚推出的SPC侧 ...

  8. 「NGK每日快讯」2021.1.14日NGK公链第72期官方快讯!

  9. C++算法代码——质因数分解[NOIP2012普及组]

    题目来自:http://218.5.5.242:9018/JudgeOnline/problem.php?id=1102 题目描述 已知正整数 n 是两个不同的质数的乘积,试求出较大的那个质数. 输入 ...

  10. [Android搞机]修改build.prop解决类原生无法链接12、13信道wifi问题

    最近xda找包刷了个机,发现没法搜到12.13信道.所有未本地化的类原生都有此问题. root后打开/system/build.prop 可以用 在build.prop中加入以下几句,重启即可连接12 ...