Traditionally, the way variable declarations work has been one tricky part of programming in javascript. In most C-based languages, variables(more formally known as bindings, as a name is bound to a value inside a scope) are created at the spot where the declaration occurs. In JavaScript, however, this is not the case. Where your variables are actually created depends on how you declare them, and ECMAScript 6 offers options to make controlling scope easier. This chapter demonstrates why classic var declarations can be confusing, introduces block-level bindings in ECMAScript 6 and then offers some best practices for using them.

var Declarations and Hoisting 

  Variable declarations using var are treated as if they are at the top of the function(or in the global scope, if decalred outside of a function ) regardless of where the actual declartion occurs; this is called hoisting. For a demonstration of what hoisting does, consider the following function definition.

function getValue(condition){

	if(condition){
		var value = "blue";
		return value;
	}else {
		return null;
	}
}

    If you are unfamiliar with Javascript, you might expect the variable value to be created only if condition evaluates to true. In fact, the variable value is created regardless. Behind the scenes, the JavaScript engine changes the getValue function to look like this:

function getValue(condition){
  var value;   if(condition){
     value = "blue"; return value;   }else { return null;   } }

  

  The declaration of value is hoisted to the top and the initialization remains in the same spot. That means the variable  value is still accessilble from the else clause. If accessed from the else clause, the variable would just have a value of undefined because it has not been initialized in the else block.

  It often takes new JavaScript developers some time to get used to declaration hoistiong, and misunderstanding this unique behavior can end up causing bugs. For this reason, ECMAScript 6 introduces block-level scoping options to give developers more control overra variable's life cycle.

   在JS 编程中,变量声明起作用的方式一直是难处理的一部分。在大部分类C语言中,我们在哪里声明变量,变量就会在哪里创建。然而,在JS中,情况确不一样。

    

understanding ECMAscript 6 ---- block bindings的更多相关文章

  1. [译]Understanding ECMAScript 6 说明

    说明 JavaScript核心语言功能定义在ECMA-262中,此标准定义的语言是ECMAScript,浏览器中的JavaScript和Node.js环境是它的超级.当浏览器与Node.js想要通过额 ...

  2. [译]Understanding ECMAScript 6 内容目录

    说明 浏览器与Node.js兼容 这本书是写给谁的 概述 帮助与支持 基本知识 更好的Unicode支持 其他字符串变化 其他正则表达式变化 Object.is() 块绑定 解构赋值 数字 总结 函数 ...

  3. Understanding ECMAScript 6 阅读问题小记

    拖了一年说要看这本书,一直都没坚持下来,开个 bo 记录下觉得疑惑的问题,也算鞭策一下自己. 第一章 块级绑定 1. 第一章“块级绑定”下,说 const 变量如果绑定的是对象 Object,那么修改 ...

  4. My ECMAScript 7 wishlist

    With ECMAScript 6 now feature complete, any further changes to the core of JavaScript will happen in ...

  5. 《理解 ES6》阅读整理:块绑定(Block Binding)

    变量声明一直是JavaScript中一个需要技巧的部分.在大多数基于C的编程语言中,变量(更正式地说是绑定)在声明的时候创建,然而在JavaScript中并不是这样.在JavaScript中,变量在何 ...

  6. ECMAScript 6十大特性

    ES6入门 http://es6.ruanyifeng.com/ ES6排名前十的最佳特性列表 Default Parameters(默认参数) in ES6 Template Literals (模 ...

  7. ESLint 规则

    ESLint由 JavaScript 红宝书 作者 Nicholas C.Zakas 编写, 2013 年发布第一个版本. ESLint是一个以可扩展.每条规则独立的,被设计为完全可配置的lint工具 ...

  8. 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理

    [微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...

  9. JS模块

    本文主要内容翻译自<Exploring ES6-upgrade to the next version of javascript> 模块系统 定义模块接口,通过接口 隐藏模块的内部实现, ...

随机推荐

  1. 漫谈java重载与重写

    重载(Overloading):为了让方法名相同而形参不同的构造方法同时存在,让类以统一的方式处理不同类型数据的一种手段 重写(Overriding):导出类对继承自基类的方法做出一定的修改,又称方法 ...

  2. VS2010中汉字拷贝到Word出现乱码问题解决

    VS2010中的汉字拷贝到Word时出现乱码,有三种解决方法: 一.粘贴时,选择“仅保留文本”.如图: 二.先拷贝粘贴到记事本文件内,此时会自动过滤格式信息,再从记事本拷贝到Word. 三.使用转换软 ...

  3. 指令的Link函数和Scope

    指令生成出的模板其实没有太多意义,除非它在特定的scope下编译.默认情况下,指令并不会创建新的子scope.更多的,它使用父scope.也就是说,如果指令存在于一个controller下,它就会使用 ...

  4. windows registry => control pannel

    User Variables HKEY_CURRENT_USER\Environment System Variables HKEY_LOCAL_MACHINE\SYSTEM\CurrentContr ...

  5. QT QML目录导航列表视图

    [功能] /目录.文件 /文件过滤 /递归 /事件 /高亮当前行 /当前选项 /目录切换动画 /限制根目录 [下载]:http://download.csdn.net/detail/surfsky/8 ...

  6. rails再体验(第一个程序)

    掌握redmine plugin开发的目标在2016年未实现,2017年继续. 选择<Ruby on Rails Tutorial>教程,windows安装railsinstaller,该 ...

  7. JDBC的简单使用

    JDBC的英文全称是:  java Data Base Connectivity JDBC的主要作用:  (是java数据库连接技术的简称)JDBC是由一系列连接(Conneation).SQL语句( ...

  8. 移动APP的开发需求分析

    一.项目概况 项目名称为上海地铁游.本项目是以上海地铁为线索,开发的一个移动APP.主要目的是帮助用户实现根据当前位置选择最方便的地铁旅游点和旅游推荐,方便出行,让更多人可以借助地铁的便利去认识和体验 ...

  9. [JAVA] java class 基本定义 Note

    java class 基本定义 Note 1 package abeen.note; 2 import java.util.*; 3 4 5 /* 6 java calss 基本 7 */ 8 pub ...

  10. web api authentication

    最近在学习web api authentication,以Jwt为例, 可以这样理解,token是身份证,用户名和密码是户口本, 身份证是有有效期的(jwt 有过期时间),且携带方便(自己带有所有信息 ...