ES6语法学习（一）

ECMAScript 语法学习（一）

  在接下来的几篇博客中，我会把ES基础语法都讲解一下，ES是是JavaScript的基础标准部分，而ES6则是它的最新一代的标准。

---

---

前言

1. ES和JS之间的关系

  ES = ECMAScript 是一个动态脚本语言的‘标准’，JS = JavaScript是对ES的标准，默认，主流的‘实现’，由于商标权的问题，欧洲计算机协会制定的语言标准不能叫做JS，只能叫ES；
  ES6新标准的目的是：使得JS可以用来开发大型的Web应用，成为企业级开发语言。而企业级开发语言就是：适合模块化开发，拥有良好的依赖管理；

2. 为什么要学ES6？ES6的用处是什么？

  ES5不能满足目前前端越来越复杂，庞大的现状，可以说已经过时了，ES6是对ES5的增强和升级。
  1.主流的浏览器都已经全面支持ES6
  2.行业内较新的前端框架都已经全面使用ES6的语法
  3.微信小程序,uni-app等都是基于ES6的语法
  4.从就业出发，中小型公司，全栈，简历上多一个技能，试用期也能更快的上手。

---

一、let关键字与const关键字

let 和 const 是ES6新增的两个重要的JavaScript关键字。

1.1 let是什么？

  ES6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。

let a;
let b,c,d;
let e=100;
let f=111,g="abc",h=[];

1.2 let与var的区别

   1.let声明变量不能重复声明，但var可以,let这样可以防止变量被污染

   let aaa='一二三';
   let aaa='111';//报错
   var aaa='aaa';
   var aaa='bbb';

   2.块级作用域:let有块级作用域，而var没有块级作用域，因此会往全局的window的属性里面添加。

 {
      let abc='111';
  }
  console.log(abc); //报错

  {
      var abc='111';
  }
  console.log(abc);

   3.不存在变量提升

console.log(song); //undefined
var song="音乐达人";
//相当于：
	// var song;
	// console.log(song); //undefined
	// var song="音乐达人";
//如果是用let，则直接报错，不允许在变量声明之前，使用变量。
console.log(song); //undefined
let song="音乐达人";

  4.不影响作用域链,因为函数里面没有，因此会向上一层来找变量

 {
     let name='小明';
     function fn(){
         console.log(name);
     }
     fn();
 }

1.3 const基础

   const的意义是“只读”。它修饰的变量不允许被修改。const只是一个修饰符。

1.4 const特性

   1.一定要赋初值，不赋初值会报错

 const a;//报错

   2.const声明的常量不能修改

const school="清华大学"
school='北京大学';
console.log(school);//报错

   3.const有块级作用域，外层作用域无法获取到内层作用域，非常安全明了。即使外层和内层都使用相同变量名，也都互不干扰。

{
    const name='mgg';
    console.log(name);//mgg
}
console.log(name);//undefined

   4. 对于数组和对象的元素修改,不算做对常量的修改,不会报错

const team =['abc','aaa','bbb'];
team.push('ccc');

---

二、解构赋值

1.什么是解构赋值

ES6允许按照一定模式从数组和对象中提取值，对变量进行赋值，这被称为解构赋值。
他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。
在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。
   1.数组的结构

const F4 =['小沈阳','刘能','赵四','宋小宝'];
let [xiao,liu,zhao,song] = F4;
console.log(xiao);
console.log(liu);
console.log(zhao);
console.log(song);

   2.对象的解构

 const zao = {
           name:'马宝国',
           age:'69',
           zhiye:function(){
               console.log("浑元形意太极门掌门人");
           	}
       };
       let {name,age,zhiye}= zao;
       console.log(name);
       console.log(age);
       console.log(zhiye);
       zhiye();

   这样写的好处：如果不用解构赋值，每次调用zhiye函数都必须调用zao函数，会多写函数调用，造成重复调用

---

总结

   以上就是今天要说的内容，本文仅仅简单介绍了let关键字与const关键字，并且简单的解释了一下什么是解构赋值，因为本人也是学生，可能讲解的不到位，有些细节没有说，有什么问题可以私聊我或者在下方留言，我们一起学习，一起进步。
   最后给大家推荐几个可以参考的教程:

阮一峰的ECMAScript 6 入门

菜鸟教程