ES6
1.const
申明一个常量，不可被修改
在es6之前用以下方法定义常量
//es3
var PER_NAME="Jack";//默认将全部大写的变量看做是常量，但是可以改写
//es5
Object.defineProperty(window,"per_name",{
value : 'Jack',
writable : false //不可写入
})
需要在定义的时候赋值，不然不能赋值
只能用const定义一个同名常量（var 可以定义多个但是会被覆盖）
var定义的可以用window调用，即
var a="abc";
console.log(window.a);//abc
而const不可以用window调用，不属于顶层对象window，即
const a="abc";
console.log(window.a);//undefined
const不存在变量提升，即
//变量提升
console.log(str);//undefined
var str="abc";
//相当于
var str;
console.log(str);
str="abc";
//不存在变量提升
console.log(str);//报错
const str="abc";
const是块级作用域，即
//var 情况
if(true){
var str="abc";
}
console.log(str);//abc
//const 情况
if(true){
const str="abc";
}
console.log(str);//报错，显示str未定义
const定义的数字及对象等可以被改变，因为对象和数组存在栈内存里的是一个引用地址，只能保证引用地址不能被改变，如图
但是可以通过Object的冻结方法浅层次冻结来保证数组和对象不可被改变，但是对象中的对象或者数组不能被冻结，还是可以被更改，即
const obj={
name:'es6',
year:2015
}
obj.name='es2015';
console.log(obj.name);//es2015
Object.freeze(obj);
obj.name='es2015';
console.log(obj.name);//es6
//同样操作数组也一样
如果需要深层次冻结可以利用递归层层冻结，即
function freezeObj(obj){
Object.freeze(obj);
Object.keys(obj).forEach(function(key){
if(typeof obj[key]==='object'){
freezeObj(obj[key])
}
})
}
const obj={
name:'asd',
value:{
name:'dsa',
}
}
freezeObj(obj);
obj.value.name='aaa';
console.log(obj.value.name);//dsa
es6中let代替了var，let与const优先使用const，因为大部分都不需要改变，对代码也更加安全
2. 模板字符串
ES6中提供了模板字符串，用`（反引号标识），用${}将变量括起来
const person={
name:’jetty’,
age:18
}
//之前我们在使用JavaScript输出模版字符串，通常是下面这样的：
$("#result").append(
"He is "+person.name+""+"and we wish to know his"+person.age+".That is all"
);
//在使用了ES6中提供了模版字符串，用`（反引号）标识，用${}将变量括起来：
$("#result").append(
`He is ${person.name}and we wish to know his${person.age}.that is all`
);
3. 箭头函数
箭头函数箭头左边是参数，箭头右边是函数体
const sum=function(x,y){
return x+y;
}
//改为箭头函数
const sum=(x,y)=>{
return x+y;
}
//如果方法体只有一行代码
const sum=(x,y)=> x+y;
//如果只有一个参数
const sum= x => x+y;
箭头函数没有this
const obtn=document.querySelector('btn');
obtn.addEventListener('click',function(){
this.style.background='#f00';//this代表obtn
})
obtn.addEventListener('click',()=>
this.style.background='#f00';//this代表window,报错
)
在箭头函数中不能使用arguments
const sum=(x, y)=>{
console.log(arguments);//报错
return x+y;
}
不能使用箭头函数创建构造函数
const Course=(name,price)=>{
this.name=name;
this.price=price;
}
let c1=new Course('math',500);//报错Course不能是一个构造器
不能使用${this.}
function Course(name,price){
this.name=name;
this.price=price;
}
Course.prototype.study=()=>{
console.log(`我喜欢学习${this.name}，花了我${this.price}块钱`)
}
let c1=new Course('es',200);
c1.study();//我喜欢学习，花了我undefined块钱,name为空，price为undefined
4.解构赋值
以前对象取值
const course={
name:'es',
price:200;
}
const name=course.name;
const name=course.price;
console.log(name,price);//es,200
es6解构赋值
const course={
name:'es',
price:200;
teacher:{
name:'jack',
age:20
}
}
const {
name: courseName,//name重复，可以取个别名
price,
teacher:{
name,
age
}
}=course;
console.log(courseName,price,name,age);//es,200,jack,20
以前数组取值
const courseArr=['es6','es7','es8'];
const a=courseArr[0];
const b=courseArr[1];
const c=courseArr[2];
console.log(a,b,c);//es6,es7,es8
es6解构赋值
const courseArr=['es6','es7','es8'];
const [a,b,c]=courseArr;
console.log(a,b,c);//es6,es7,es8
json字符串解构
const json='{"name":"jack","age":"20"}'
const {name,age}=JSON.parse(json);
console.log(name,age);//jack,20
5. 模块
export:
一个模块相当于一个独立的文件，此文件内部的的所有变量，外部无法获取，如果想让外部能够读取内部的变量，就必须用export输出该变量。
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export {firstName, lastName, year};
import:
使用export命令定义了模块的对外接口以后，其他 JS 文件就可以通过import命令加载这个模块。
import {firstName, lastName, year} from './***.js';
6. Class类
ES6提供了更接近传统语言的写法，引入了Class（类）这个概念，作为对象的模板。通过class关键字，可以定义类。新的class写法让对象原型的写法更加清晰、更像面向对象编程的语法。
class Animal {
constructor(){
this.type = 'animal';
};
says(say){
console.log(this.type + ' says ' + say) ;
};
};
let animal = new Animal();
animal.says('hello');//animal says hello