1、const 不允许重复声明 不属于顶层对象window 不存在变量提升 暂时性死区 块级作用域
const 不属于顶层对象window const str='es6'; console.log(window.str); // undefined //变量提升 console.log(str); var str = 'es6'; //相当于 var str； console.log(str); str = 'es6'; //不存在变量提升(1、需先定义后使用；2、块级作用域) console.log(str); const str = 'es6';2、const声明的常量能被改变吗？ 变量如何存储 js中分为基本数据类型和引用数据类型 基本数据类型（栈内存）：number、boolean、string、NUN、undefined 引用数据类型（堆内存）：对象、数组 freeze浅冻结 深层次冻结：需要将每一层对象都冻结
const esObj = { name:'es6', year:2015 } esObj.name = 'es2015'; console.log(esObj); // es2015 const arr = ['es6','es7','es8']; arr[0] = 'es2015'; console.log(arr[0]);//es2015 const arr = ['es6','es7','es8']; Object.freeze(arr); arr[0] = 'es2015'; console.log(arr[0]);//es6 const esObj = { name:'es6', year:2015, extension:['es7','es8','es9'] } Object.freeze(esObj ); esObj.extension[0]= 'es2015'; console.log(esObj.extension[0]); // es7 Object.myFreeze(esObj ); esObj.extension[0]= 'es2016'; console.log(esObj.extension[0]); // es7 function myFreeze(obj){ Object.freeze(obj); Object.keys(obj).forEach(function(key){ if(typeof obj[key] === 'object'){ myFreeze(obj[key]); } }) }3、箭头函数 箭头函数左边：指函数参数 箭头函数右边：指方法体 箭头左边如果只有一个参数，则不需要写括号 箭头右边如果只有一行代码，则不需要大括号
使用箭头函数我们应注意： 1、事件的回调函数用箭头写的时候，因为this指向与之前是不同的，箭头函数里面没有this,它会沿着它的 作用域链向上查找，找到谁就指向谁 2、通过箭头函数去定义对象里面的方法，因为this指向与之前是不同的，我们需要注意 3、箭头函数里面arguments不能使用 4、箭头函数不能作为构造函数 5、箭头函数不能定义原型下面的方法
const res = (x,y) => x+y; const fn = x => { //业务逻辑代码 } const oBtn = document.querySelector('#btn'); oBtn.addEventListener('click',()=>{ console.log(this); // this只向window this.style.backgroundColor = '#f0f'; }) const obj = { name :'zj', showName: () => { console.log(this);//this指向window console.log('my name' + this.name) }, showAge(){ //es6对象 简写的形式 console.log(this);this指向obj } } obj.showName(); function sum2(x, y){ console.log(arguments);//arguments可以取到该方法里面形参的值 } sum2(2,3); const sum =(x,y)=>{ console.log(arguments);//会报错 return x+y; } sum2(22,33); //类 function Course(name,price){ this.name = name; this.price = price; } const Course = (name,price) => { this.name = name; this.price = price; } Course.prototype.study = function(){ console.log(`名字${this.name},价格${this.price}`); } Course.prototype.study = () => { console.log(`名字${this.name},价格${this.price}`); } const c1 = new Course('es',500); console.log(c1);4、es6优雅取值 js:数组取值（下标取值），对象取值（属性取值） es6:解构赋值
//解构赋值 const course = { name: 'es6', price:500, student:{ name:'xioahong', age:16 } }; //const name = course.name; //const price = course.price; const { name: courseName, price, student:{ name, age } } = course; console.log(courseName,price,name,age); const courseArr = ['es6', 'es7', 'es8' ]; //const a = courseArr [0]; //const b = courseArr [1]; //const c = courseArr [2]; const [ a, b, c ] = courseArr; //项目中使用解构赋值 1、函数参数 2、函数返回值 3、变量互换 4、JSON应用 5、Ajax请求应用 const sum = arr => { let result = 0; for(let i=0; i< arr.length; i++) { result += arr[i]; } console.log(result); } const sum = ([a,b,c])=> { console.log(a+b+c); } sum([1,2,3]); const foo = ({name,age,course:'语文'}) => { console.log(name,age,course); }; foo({ name:'张三'， age:20, course:'数学' }) const foo = () => { return { name:'张三'， age:20 } }; const {name, age} = foo(); console.log(name,age); let a = 1; let b = 2; [b, a] = [a, b]; const json = '{"name":"es","price":"500"}'; const obj = JSON.parse(json); console.log(obj); const {name,price} = JSON.parse(json); console.log(name,price); axios.get('./data.json').then(res => { console.log(res); }) axios.get('./data.json').then( ({data}) => { console.log(data); }) axios.get('./data.json').then( ({data:{name,age}}) => { console.log(name,age); })5、es6不能被所有的浏览器识别 建议使用最新版的chrome,或可使用babel工具将es6转换为es5
安装 1、安装node.js环境 2、进入项目初始化package.json（npm init -y） 3、安装babel：npm install --save-dev babel-preset-env babel-cli 4、创建文件并配置：.babelrc {"presets":["env"]} 文件转化 文件：babel src/index.js -o dist/index.js 文件夹：babel src -d dist 实时监控： babel src -w -d dist [es官网]：http://www.ecma-international.org/ecma-262/6.0/ 参考：http://es.xiecheng.live/