-----书接上文，前文中我们总结了关于JS的组成部分以及如何快速开展学习JS，相信已经有很多朋友掌握到这些方法。接下来就从更深的ECMAScript开始说起。
1.什么是ES6?
ECMAScript(European Computer Manufacturers Association) 6: 是JavaScript语言的下一代标准，已经在2015年6月正式发布了。Mozilla公司将在这个标准的基础上，推出JavaScript 2.0。
简单来说ES6在JS中的作用就是语言的标准。它里面定义了如何去定义变量，如何写函数，如何写数组....
相对于ES5来讲ES6中多出来几点新特性，而且普及速度相对于ES5来讲要快很多，现在主流版本的浏览器如Chrome 和 Firefox 浏览器可以支持ES6中绝大多数特性。
接下来围绕ES6的新特性开始说起。
2.ES6特性---量的声明（let and const）
（1）使用Let声明变量
前面说到，JS中声明变量是通过 var 来声明 var 是variable的简写。 variabel是变化的意思。
而在ES6中推荐使用let声明局部变量，相比于之前的var声明的全局变量，
使用Let声明变量不会使变量提升:
console.log(b);
let b = 666; // b is not defined
复制代码使用Let不能重复声明：
let a =1;
let a =1; //Identifier 'a' has already been declared
复制代码Let可以形成一个块级作用域：
if (true){
var a = 100;
}
console.log(a);// a = 100
复制代码if (true){
let a = 100;
}
console.log(a);// a is not defined
复制代码（2）使用Const声明常量
使用Const声明常量不会使常量提升:
console.log(PI);
const PI = 3.14;// PI is not defined
复制代码使用Const不能重复声明：
const PI = 3.14;
PI = 666;//Assignment to constant variable
复制代码Const可以形成一个块级作用域：
{
const PI = 3.14;
}
console.log(PI);//PI is not defined
复制代码总结一下：
相同点：Let与Const不会使量提升，不能重复声明，都能形成块级作用域。
不同点：Let声明变量，Const声明常量。
3.ES6特性---箭头函数(Arrow Functions)
箭头函数是函数的简写，是ES6中非常强大的简写形式。不需要 function 关键字来创建函数。省略 return 关键字。继承当前上下文的 this 关键字（没有自己的this）。
var f = function(a){
console.log(a);
}
//?
var f = (a)=>{
console.log(a);
}
//?
var f = a =>{
console.log(a);
}// 当参数只有一个的时候，（）是可以省略的
复制代码箭头函数没有自己的this，所以使用的时候要格外小心。
var obj = {
name: 'wsq',
getName() {
console.log(this.name);
}
}
obj.getName(); // wsq
var obj = {
name: 'wsq',
getName: () => {
console.log(this.name);
}
}
obj.getName(); // undefined
复制代码4.ES6特性---模板字符串(Template Literals)
允许嵌入表达式的字符串字面量，可以使用多行字符串和字符串插值功能。
1.用${}来将表达式嵌入字符串中进行拼接。
2.使用(``)进行包裹。
var name = 'wsq';
var aa = `test ${name} `;
console.log(aa); // test wsq
复制代码5.ES6特性---函数的参数默认值
在ES6中，函数的参数默认值定义要更加简单：
function print(key = 'hello') {
console.log(key);
}
print('f'); // f
print();// hello
复制代码这说明了，在ES6中，JS的形参是可以有默认值的。
6.ES6特性---For...of
新的循环方式，代替之前的 for...in 和 forEach 方法。 可在可迭代对象（包括 Array，Map，Set，String，arguments 对象等等）进行迭代循环
for...of 遍历数组：
let root = ['a', 'b', 'c'];
for (let x of root) {
console.log(x);
} //a,b,c
复制代码7.ES6特性---ES6中的类
前面我们都是创建构造器，然后去new构造器，构造器就相当于一个类，在ES6中，就可以使用Class来创建对象了。
不使用Class，去创建一个类，如下：
function man (name,age,height){
this.name = name;
this.age = age;
this.height = height;
}
man.prototype.say = function(){
console.log(`我是${this.name}`)
}
var p = new man("wsq","22","180");
console.log(p);
复制代码使用Class，去创建一个类，如下：
class Man{
constructor(name,age,height){
this.name = name;
this.age = age;
this.height = height;
}
say(){
console.log(`我是${this.name}`)
}
}
var p1 = new Man("wsq","22","180");
console.log(p1.say());
复制代码8.ES6特性---对象超类与继承
ES6 允许在对象中使用 super 方法并使用Extends来实现继承：
class Man{
constructor(name,age,height){
this.name = name;
this.age = age;
this.height = height;
}
say(){
console.log(`我是${this.name}`)
}
}
class MVP extends Man{
constructor(name,age,height,year){
super(name,age,height)
this.year = year;
}
showMVP(){
console.log(`我是${this.name},我是${this.year}年的MVP`)
}
}
var mvp1 = new MVP("wsq","22","180",2016);
mvp1.say();
mvp1.showMVP();
复制代码9.ES6特性---对象扩展
(1)Obect.getOwnProertyDescriptor();
获取一个对象中某个属性的详细信息。
var a =1;
console.log(Object.getOwnPropertyDescriptor(window,"a"));//{value: 1, writable: true, enumerable: true, configurable: false}
复制代码(2)Object.defineProperty();
精细化设置一个对象的属性。
(3)Object.defineProperties() ;
直接在一个对象上定义新的属性或修改现有属性,并返回该对象。
var obj = {}
Object.defineProperties(obj,{
"name":{
configurable:false,
Writable:false,
enumerable:false,
value:"wsq"
},
"age":{
configurable:false,
Writable:false,
enumerable:false,
value:"66"
}
});
console.log(obj.name,obj.age);//wsq 66
复制代码(4)getOwnPropertyNames();
获取自的属性，以数组的格式返回。
var obj = {
name : "wsq",
age : 88
};
console.log(Object.getOwnPropertyNames(obj));//["name", "age"]
复制代码(5)Object.keys();
使用Object.getOwnPropertyNames()和Object.keys()都可以得到一个对象的属性名，属性名是放在一个数组中的。
var obj = {
name : "wsq",
age : 88
};
console.log(Object.keys(obj));//["name", "age"]
复制代码(6)Object.values();
获取对象的值，放到数组中。
var obj = {
name : "wsq",
age : 88
};
console.log(Object.values(obj));//["wsq", 88]
复制代码10.ES6特性---其他补充
（1）Set与Map
set和数据差不多，也是一种集合，区别在于：它里面的值都是唯一的，没有重复的。
const s = new Set();
arrSet.add(1); // Set(1) {1}
arrSet.add(2); // Set(2) {1, 2}
arrSet.add(2); // Set(2) {1, 2}
复制代码map类似于对象，里面存放也是键值对，区别在于：对象中的键名只能是字符串，如果使用map，它里面的键可以是任意值。
var m = new Map([
["a","hello"],
[1,"123"]
]);
m.set(false,"abc")
m.set([1,2,3]),{name:"wsq"}
console.log(m);//Map(4){"a" => "hello", 1 => "123", false => "abc", Array(3) => undefined}
复制代码（2）Trim
除去字符串空格的。
trim 左右空格去掉
trimLeft 左空格去掉
trimRight 右空格去掉
var str = " a abn abc "
str.trim();
/* "a abn abc"
str.trimLeft();
"a abn abc "
str.trimRight();
" a abn abc" */
复制代码（3）Repeat
构造并返回一个新字符串,该字符串包含被连接在一起的指定数量的字符串的副本。
var str = "12345"
console.log(str.repeat(5));//1234512345123451234512345
复制代码（4）Includes
用来判断一个字符串是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。
/* var str = "abc dde";
str.includes("a")
true
str.includes("z")
false
str.includes("c d")
true
*/
复制代码（5）StrartsWith
用来判断一个字符串是否是以指定内容开头，根据情况,如果包含则返回 true,否则返回false。
/*
var str = "abc dde";
str.strartsWith("abc")
true
str.strartsWith("abdc")
false
*/
复制代码（6）EndsWidth
用来判断一个字符串是否是以指定内容结尾，根据情况,如果包含则返回 true,否则返回false。
/*
var str = "abc dde";
str.endsWith("dde")
true
str.endsWith("abdc")
false
*/
复制代码（7）PadStart
如果这个字符串不够指定长度,会在头部补全。
/*
var str = "abc def"
str.padStart(15,"*")
"********abc def"
*/
复制代码（8）PadEnd
如果这个字符串不够指定长度,会在尾部补全。
/*
var str = "abc def"
str.padStart(15,"*")
"abc def********"
*/
复制代码关于ES6中的特性还有很多，本文仅仅是列举出较为有特点的一部分来说，有不足之处欢迎大家在评论里留言讨论，仅 此以为谢。
扫一扫
1405
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
