ES6学习笔记

目录：

　　变量

　　扩展运算符

　　for…of…

　　Set

　　Map

　　箭头函数

---

 babel：在线转换工具

打开node，输入node，进入学习吧。

之前我们声明变量用function和var，ES6了 一共有6种声明变量的方法，let和const加上import和class。var命令和function命令声明的全局变量，所以我们创建一个全局对象可以

var a="我爱代码"
//a可以看作是window的属性
console.log(window.a)

//node上我们就别window了，要报错的。全局是global
在浏览器中，顶层作用域就是全局作用域。var命令和function命令依旧是顶层对象的属性；另一方面规定，let命令、const命令、class命令声明的全局变量，不属于顶层对象的属性。也就是说，从ES6开始，全局变量将逐步与顶层对象的属性脱钩。

let，只在它所在的代码块中有效；
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
} a
[6](); // 6

let不存在变量提升：一句话解释，没声明别用，报错报错，那可不是未初始化

console.log(foo); // 输出undefined
console.log(bar); // 报错ReferenceError
var foo = 2;
let bar = 2;

暂时性死区：在这个let块级作用域内，未声明别用；

var tmp = 123;
if (true) {
tmp = 'abc'; // ReferenceError
let tmp;
}

不允许重复声明：相同的作用域别重复声明，以前会覆盖，现在是boom；

块级作用域外要用块级作用域内的值可以使用do表达式：

let x = do {
  let t = f();
  t * t + 1;
};

 const和let差不多，const声明一个只读的常量。一旦声明，常量的值就不能改变

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.

...：扩展运算符，功能非常强大；

函数调用中使用展开运算符
function test(a, b, c) { }
var args = [0, 1, 2];
test.apply(null, args);
//现在用es6的...
function test(a,b,c) { }
var args = [0,1,2];
test(...args);

 合并两个对象

let a={x:1,y:2};
let b={z:3};
let ab={...a,...b};
console.log(ab) //{x:1,y:2,z:3}

将一个对象插入另外一个对象当中

let z={a:3,b:4};
let n={x:1,y:2,...z};
console.log(n); //{x:1,y:2,a:3,b:4}

Symbol:第7中数据类型，表示独一无二的值。前六种是：Undefined、Null、布尔值（Boolean）、字符串（String）、数值（Number）、对象（Object）。

var s1 = Symbol('foo');//后面传个字符串好识别s1，s2
var s2 = Symbol('bar');

s1 // Symbol(foo)
s2 // Symbol(bar)
typeof s1　　//Symbol
s1.toString() // "Symbol(foo)"
s2.toString() // "Symbol(bar)"

for…of循环：和for in 感觉没啥区别，可以遍历对象和数组；

let words=[2,2,2,2]
var uniqueWords = new Set(words);
for (var word of uniqueWords) {
  console.log(word);//2
}
for (var word in uniqueWords) {
  console.log(word);//别开玩笑了，还是有点区别的，for in 咋遍历Set呢
}

 Set：它类似于数组，但是成员的值都是唯一的，没有重复的值。

• add(value)：添加某个值，返回Set结构本身。
• delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。
• has(value)：返回一个布尔值，表示该值是否为Set的成员。
• clear()：清除所有成员，没有返回值。

• keys()：返回键名的遍历器
• values()：返回键值的遍历器
• entries()：返回键值对的遍历器
• forEach()：使用回调函数遍历每个成员

var s=new Set([1,2,3,4,4]);
console.log(s);//1234

还可以去重：

var a=[1,3,4,5,6,3];
var b=[...new Set(a)]; //去重

 WeakSet

WeakSet结构与Set类似，也是不重复的值的集合。但是，它与Set有两个区别。

WeakSet的成员只能是对象，而不能是其他类型的值。

var a = [[1,2], [3,4]];
var ws = new WeakSet(a);
console.log(ws)

 Map

new Map([iterable])
//Iterable 可以是一个数组或者其他 iterable 对象，其元素或为键值对，或为两个元素的数组。 每个键值对都会添加到新的 Map。null 会被当做 undefined。

for...of 循环每次遍历都会返回一个 [key, value] 数组；

Map和Set有个共同点NaN是相等的，这和以往常见到的NaN不等于任何值甚至它自己有点不一样，剩下所有其它的值是根据 === 运算符的结果判断是否相等。
另外Map和Object有点不一样:

一个对象通常都有自己的原型,所以一个对象总有一个"prototype"键。不过，从 ES5 开始可以使用map = Object.create(null)来创建一个没有原型的对象。
一个对象的键只能是字符串或者 Symbols，但一个 Map 的键可以是任意值。//value=>value
实例化的Map对象通过size属性很容易地得到一个Map的键值对个数，而对象的键值对个数只能手动确认。

 箭头函数：箭头函数总是匿名的，不用绑定this，也不能够用作构造函数。

// 如果只有一个参数，圆括号是可选的:
(singleParam) => { statements }
singleParam => { statements }

// 无参数的函数需要使用圆括号:
() => { statements }

还有个很多人头疼的this，箭头函数也很好的解决了。

function Person() {
  // 构造函数 Person() 定义的 `this` 就是新实例对象自己
  this.age = 0;
  setInterval(function growUp() {
    // 在非严格模式下，growUp() 函数定义了其内部的 `this`
    // 为全局对象, 不同于构造函数Person()的定义的 `this`
    this.age++; //this是指window。把this在函数外面赋值给一个变量，可以让this指向Person
  }, 1000);
}

var p = new Person();

/*而箭头函数可以这样写*/
function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| 正确地指向了 person 对象
  }, 1000);
}

var p = new Person();

 

 

 

/*占位符*/