笔记：ES6/ES5

一、ES6增加let 和const 对变量的定义，更符合高级语言的特性

        ES5：

        var a=1 或 直接 a=1 , 定义的变量属全局变量，在所有的块级作用域内都启作用， 甚至在函数中也起作用，还可多次定义同一变量。 这些都与其它高级语言的变量定义不同。

var a=1;
	for(i=0;i<3;i++)
	{
		console.log(a); //1,5,5
		var a=4;
		a++; //每次循环，重新初始a 并++
	}
	 //a=5
	function someFuncton(){
		a++  //3
	    console.log(a); //6
	}
	var a=2
	someFuncton()
	console.log(a) //2

更奇葩的是，同一区域中，var 定义的变量会 提升作用域

    var a=1
	function someFuncton(){
	    console.log(a)  //undefined 
		var a=3
	}
	someFuncton()

ES6:

      const, let 定义的变量遵循先定义，后使用的规则，否则会报错。而且不允许重复定义一个变量。在作用域中使用一个变量，首先在本作用域查找这个变量，如果没找到，向上一级继续找，层层往上找，最后到window对象。所以window下的变量及对象都是全局的

二、ES6增加了箭头函数，箭头函数不仅仅是代替function，主要是影响函数中的this指针。

window.x=200; //或 var x=200
	const someObj1 = {
	    x: 1, 
	    print() {
			setTimeout(function(){
			 console.log(this.x);  //this指向了执行时的对象window
			},1)  
	    }
	}
	someObj1.print(); //打印 200
	
	const someObj2 = {
	    x: 1, 
	    print() {
			setTimeout(()=>{
			  console.log(this.x);  //this指向了定义时的someObj2 
			},1)  
	    }
	}
	someObj2.print(); //打印 1

三、ES6增加 函数参数的默认值

//ES6
	function(x = 1, y = 2) {  
	    // do someThing
	}
	
//ES5
	 function(x, y) {  
	   x =  x || 1;
	   y = y || 2;
	   // do someThing
	}

四、ES6增加对象或数组的析构赋值

//数组
	let data = ['first', 'second','three'];
	let [a,,b] = data; // 按数组序号赋值
	console.log(a, b); //first，three

    [ b, a ] = [ a, b ] // a，b值对换
	
//对象
	let obj = {name: "jon", age: 18,email:'q@com.cn'};
	let {name, age,num} = obj; // 按属性名
	console.log(name, age,num); //jon，18，undefined

//从函数返回多值
	const getData=()=>{
		//someThing
		return {name:'jonh',age:30}
	}
	
	const {name,age} =getData();
	console.log(name,age)

    // ES5
    var tmp = getNode();
    var a = tmp.op;
    var b = tmp.lhs.op;
    var c = tmp.rhs;

    //ES6

    let{ op: a, lhs: { op: b }, rhs: c } = getNode()

    var list = [ 7, 42 ]
    var [ a = 1, b = 2, c = 3, d ] = list
    a === 7 //有值，所以替换1
    b === 42 //有值，替换2
    c === 3   //无值，用默认值
    d === undefined  //无值，无默认

五、简化对象的定义

    let a='first',b='second',c='three'
	
	//ES6
	let obj1={a,b,c,d:123}
	console.log(obj1)

    let obj = {
    foo: "bar",
    [ "m" + f() ]: 22
    }

    function f()
    {
        rerurn 2
    }
	
	//ES5
	let obj2={a:a,b:b,c:c,d:123}
	console.log(obj2)

六、ES6 增加Promise 用于异步执行

//3秒后返回值
	const someFunction = function(flag=true) {
		return  new Promise((resolve, reject) => {
				if(flag)
				   setTimeout(()=>{resolve("ok!")},3000)
				else 
				    setTimeout(()=>{reject("error!")},3000)
			})
	}
	
	//执行 then
	someFunction().then(e=>{  
		console.log(e)  
	}).catch(e=>{
		console.log(e)  
	})
	
      //执行catch
	someFunction(false).then(e=>{
		console.log(e)  
	}).catch(e=>{   
		console.log(e)  
	})
	
	//同步执行
	const f1=async ()=>{
		let re1=await someFunction()
		console.log(re1);
		let re2=await someFunction(false)
		console.log(re2);
	}
	
	f1()

七、增加类

class User {   	
	   constructor(name, age) { 
	      this.name = name
	      this.age = age    
		  this.email=''
		  }
	//getter	  
	   get myName(){
	   			 return "my Name is"+this.name
	   		 }
	//setter
		set myEmail(email)
		{
			this.email=email;
		}	
	//function		 
	   getUser() {       
	     return (`My name is ${this.name}, my age is ${this.age}, my email is ${this.email}`) 
	   } 	 
	}

     
	 let obj = new User('John', 21);
	 obj.myEmail="w@www.com"
	 console.log(obj.myName) 
     console.log(obj.getUser()) 

八、增加 模块管理，可以在模块中使用 import 语句将变量、函数、类或任何其他组件导出到不同的文件和模块

	// moduleData.js  
	export const count = 200; 
	export function getName() {   
	   //someThing
	   return 'mark'
	};
	export class Person()
	{
		constructor()
		{
			this.name='simith'
		}
		//someMethod
	}
	
	//main function
	import {num, getName,Person} from 'moduleData';
	
	console.log(num); // 200
	console.log(getName()); // mark
	let obj=new Person()
	console.log(obj.name) //simith
	
    import * as my from 'moduleData'
    my.num ===num
    my.getName=== name
    my.Person===Person

九、ES6增加了文本的模板和多行书写，多行比较奇葩，第二行起，前面的空格也算在内。

	let name='jonh',age=30
    //模板
	let str = `My name is ${name}, age is ${age}`
	console.log(str)
	
  //多行书写
	let s=
	`first line,
	 sencond line,
	 three line`
	console.log(s)