Vue学习-ES6语法

块级作用域/三种方式对比

let/var（错误/不常用的方式）

可以将let看成更完美的var
块级作用域
: JS中使用var来声明一个变量时，变量的作用域主要和函数的定义有关
针对其他块来说是没有作用域的，比如if/for
变量作用域：变量在什么范围内可用。
没有块级作用域引起的问题：if块级 可以随意更改变量

for块级没有作用域：

var bts=document.getElementsByTagName("button");
for(i=0;i<bts.length;i++){
	bts[i].addEventListener('click',function(){
		console.log("第"+i+"个按钮被点击");
	})
}

闭包

可以通过闭包解决

var bts=document.getElementsByTagName("button");
for(i=0;i<bts.length;i++){
	(function(i){//相当于有五个函数
		bts[i].addEventListener('click',function(){
		console.log("第"+i+"个按钮被点击");
		})
	})(i)
}

为什么闭包可以解决问题呢？
因为函数是一个作用域，而JS中使用var来声明一个变量时，变量的作用域主要和函数的定义有关。所以在ES5中，很多时候需要借助函数来解决外部变量的问题。

ES6中的let

ES6中引入let，存在作用域

var bts=document.getElementsByTagName("button");
for(let i=0;i<bts.length;i++){
	bts[i].addEventListener('click',function(){
		console.log("第"+i+"个按钮被点击");
	})
}

每一个大括号里面的内容执行时，其中的被赋予的变量不会再被更改。

总结：ES5中的var是没有块级作用域的
ES6中的let是有块级作用域的

const的使用和注意点

主要作用：将某个变量修饰为常量，不可以再次赋值。
使用情况：修饰标识符不会再被赋值，使用const来保证数据安全性。在ES6开发中，优先使用const，只有需要改变某一个标识符的时候才使用let.

特点：1.一旦const修饰的标识符被赋值后，不能修改。
2.在使用const定义标识符，必须进行赋值。
3.常量的含义是指向的对象不能修改，但是可以改变对象内部的属性。
例如：

const obj={
		name:'why',
		age:18,
		height:1.88
	}
	console.log(obj);
	obj.name="bajs";
	obj.age=19;

因为变量内存保存的是变量地址，新的对象有新的内存单元，所以不能更改。但里面的属性更改内存地址没有变动。

ES6对象字面量增强写法

对象的字面量:也就是直接const app={}的写法

属性的增强写法

ES5基础写法；

const name="shj";
const age=18;
const height=1.98;
const obj={
   name:name,
   age:age,
   height:height
}

ES6增强写法：

const name="shj";
const age=18;
const height=1.98;
const obj={
	name,
	age,
	height
}
console.log(obj);

函数的增强写法

ES5的基础写法：

const obj={
	run:function(){
			},
    eat:function(){
			}
	   }

增强写法：

const obj={
	run(){
			},
    eat(){
			}
	   }

JavaScript问题：没有类型检测
选择使用TypeScript或者flow