variable declarations : let, const,and block scope

why we redefine the way about declarations?

function scope

var price = 10;  //global declaration

function showPrice(){
var price = 12; //local declaration using var
console.log(price); //12
}
showPrice(); console.log(price); //10

The next we can use IIFE to check var variable;

var price = 10;
(function(){
var price = 12;
console.log(price); //12
})();
console.log(price); //10

IIFE: Immediately Invoked Function Expression,意为立即调用的函数表达式,也就是说,声明函数的同时立即调用这个函数。

How to change the scope of var variable?

var price = 10;
if(price){
price = 12;
console.log(price);
}
console.log(price);

The examples demonstrates _ of var.

The example make me confusing.

var price = 10;

function showPrice(){
var price = 12;
console.log('price',price);
} showPrice();
console.log('showPrice',showPrice());
console.log(price);

the resule is

price 12

price 12

showPrice undefined

10

why have two price?

we add block scope like let and const to solve the problems.

what is block scope?

block scoping means that new scope is created between a pair of { }.

let nbr = 12;
{
let nbr = 40;
}
console.log(nbr)

1.var is bound to function scope

2.let and const are block scope

How to install preview about markdown in sublime?

1.we can use package install to install our plugins

.first use keyboard open the package istall

command+shift+p

IIFE

var price = 12;
if(price){
var price = 10;
console.log(price);
}
console.log(price);

IIFE tell us that the var declarations are bound to the function scope and does not create block scope.

var is bound to function scope, let and const are block scope.

let value = 42;
{
let value = 1000;
}
console.log(value);

let varible only read in the block scope.

const

const declarations is a immutable varible.

const value  = 50;
console.log(value); value = 1000;
const value  = 50;
console.log(value); let value = 1000;

varible hoisting

console.log(host);
var host = 89;

In my heart,it may be console 89;Actualy it is undefiend;

beacuse it is become next code in our browser

var host;
console.log(host);
var host = 89;

If you use let to declate a varible,it is err:

console.log(host);
let host =100;

I'm confusing!

TDZ(Temporal Dead Zone)

You are accessing a varible that's been declared but not yet initialized.

let data = true;
if(true){
console.log(data);
let data;
}
console.log(data);

It's print the value

undefiend

true;

But in the book ,author told me that print

ReferenceError

true

let data = true;
if(true){ //Enter new scope,TDZ starts
//uninitialized bindling for data is created
console.log(data); //ReferenceError
let data;//TDZ ends,'data' is initialized with undefined
}
console.log(data); //true

TDZs helps us ensure that a variable in runtime always have correct value.

if(ture){
console.log(typeof anUndeclaredVariable);
console.log(typeof nrandom); let random;
}

It is a good practice to always make varible declarations at the top of your scope.

This check is also useful for conditionally creating global varibles using var.

You can check if a global variable exsits by doing something like this:

if(typeof globalVariable === 'undefined'){
var globalVariable = {...};
}

const in object

You can add a property to object of const declaration but you cannot assign

a different value to object.

const obj = {};
obj.key = 42;
console.log(obj.key); obj = {};

sure,if you really want to you could make the value itself immutable by freezing it.

const obj = Object.freeze({});
obj.key = 42;
console.log(obj);

Object.freeze() is shallow.

ES6 new syntax of let and const (one)的更多相关文章

  1. JavaScript学习系列5 ---ES6中的var, let 和const

    我们都知道JavaScript中的var,在本系列的 JavaScript学习系列2一JavaScript中的变量作用域 中,我们详细阐述了var声明的变量的作用域 文章中提到,JavaScript中 ...

  2. ES6中不得不说的关键字const

    上一节讲了let关键字,它是用来声明一个变量,只在块级作用域起作用.这一节我们来学习ES6新增的另一个关键字const. const 的作用 const是constant(常量)的缩写,const和 ...

  3. es6学习笔记1 --let以及const

    let语句的基本用法:  1.let声明的变量为块级作用域,只在最近的{}里面有效,如果在外部引用就会报错. { let a = 10; var b = "hello" } ale ...

  4. ES6新特性:let和const的使用

    (声明, 本文的所有代码均在node的最新稳定版本v4.4.3中执行的, 如果在浏览器中执行请把JS的运行环境提升为ES6) 以前一直用var定义变量, 现在有了两种新的定义变量的方式, 1: let ...

  5. es6重点笔记:let,const

    一,let 先看代码: var a = []; for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i) }; } a ...

  6. ES6系列之变量声明let const

    ES6也出来好久了,最近闲来无事就想着吧es6做一个系统的总结,巩固自己的知识,丰富一下博客. 为什么叫ES6 实际上是ECMA的一个打的标准,这个标准是在2015年6月发布的,正式的名字实际是es2 ...

  7. ES6中声明变量 let和const特点

    在ES6中我们有两种定义变量的方式:let    const let特点: 1.let定义时不会进行变量声明提升 2.变量不允许被重复定义 3.变量不可以被删除 4.在for循环当中用let定义i 循 ...

  8. es6 入坑笔记(一)---let,const,解构,字符串模板

    let  全面取代var 大概相似于C++的定义,一个变量必须得先定义后使用,没有预编译 注意let的作用域,一个{}就是一个作用域,上述规则须在一个作用于内 坑:for(let i =0;i < ...

  9. ES6基本语法之let和const

    1.var可以重复声明 var a = 12; var a = 5; alert(a) //5 2.var无法限制修改 如:PI = 3.1415: 3.var没有块级作用域 { } 像: if(){ ...

随机推荐

  1. java设计模式------建造者模式

    建造者模式(Builder),将一个复杂对象的构建与它的表示分离,使得同样的构建过程可以创建不同的表示. 类图 描述 Builder:定义一个建造者抽象类,以规范产品对象的各个组成部分的建造.这个接口 ...

  2. Matlab绘图基础——绘制等高线图

    % 等高线矩阵的获取 C = contourc(peaks(20),3);              % 获取3个等级的等高线矩阵 % 等高线图形的绘制 contour(peaks(20),10);c ...

  3. 测试驱动开发实践2————从testList开始

    内容指引 1.测试之前 2.改造dto层代码 3.改造dao层代码 4.改造service.impl层的list方法 5.通过testList驱动domain领域类的修改 一.测试之前 在" ...

  4. apache实现301永久性重定向代码

    301重定向(301 redirect)又叫301代表永久性转移(Permanently Moved),将各种网络请求重新定个方向转到其它位置,是网页更改地址后对搜索引擎友好的最好方法,只要不是暂时搬 ...

  5. 密码脱落 JAVA 蓝桥杯

    密码脱落 X星球的考古学家发现了一批古代留下来的密码.这些密码是由A.B.C.D 四种植物的种子串成的序列.仔细分析发现,这些密码串当初应该是前后对称的(也就是我们说的镜像串).由于年代久远,其中许多 ...

  6. WCF跨域解决方法及一些零碎的东西。

    之前发过一篇随笔,说的WCF配置文件配置问题.里面也配了跨域支持,但是jsoncollback只支持Get请求,Post请求是解决不了,所以这里把真正的WCF跨域问题贴出来. 话不多说,直接帖配置文件 ...

  7. 配置 CSV Data Set Config 来参数化新增客户信息操作

    1.首先根据新增客户信息的http请求,来确定需要参数化的变量,选取符合测试需求且经常变化或未来会变化的变量为需要参数化的变量,如本文中的客户端名称(sys_name).描述(description) ...

  8. Scrum 冲刺 第七日

    Scrum 冲刺 第七日 站立式会议 燃尽图 今日任务安排 项目发布说明 站立式会议 返回目录 燃尽图 返回目录 今日任务安排 返回目录 项目发布说明 本版本的新功能 不只是简单打地鼠,还有一些不能打 ...

  9. SpaceVim - 让你的vim变得更加高效和强大

    SpaceVim 中文手册 项 目 主 页: https://spacevim.org Github 地址 : https://github.com/SpaceVim/SpaceVim SpaceVi ...

  10. HTML5 canvas绘制雪花飘落

    Canvas是HTML5新增的组件,它就像一块幕布,可以用JavaScript在上面绘制各种图表.动画等. 没有Canvas的年代,绘图只能借助Flash插件实现,页面不得不用JavaScript和F ...