ES6学习

1 变量声明

使用let声明变量不能重复，不存在变量提升，即不允许在变量声明之前使用变量；不影响作用域链

2 块级作用域（全局，函数，eval）

块级作用域：由{}包括

（1）ES5之前的if和for没有块级作用域的概念，需要借助function的作用域解决应用外面变量的问题

（2）ES6中加入了let，let有if和for 的块级作用域

注：
1、var定义的变量没有块的概念，可以跨块访问，不能跨函数访问
2、let定义的变量吗，只能在块作用域里访问，不能跨块访问，也不能跨函数访问
3、const定义常量，一定要赋初值，只能在块作用域访问，不能修改
当const定义的为对象时，指向的对象不能更改，但是可以改变对象内部的属性

3 解构赋值

ES6允许按照一定模式从数组和对象中提取值，对变量进行赋值

const F4=[1,2,3,4]
let [xiao,xia,xi,xixi]=F4

4 模板字符串

``  	%内容中可以出现换行符
%变量拼接
let lovest=`xiezihan`
let age=`${lovest}18`

5 箭头函数

不能作为构造函数实例化对象，不能使用arguments变量

const ccc=(参数列表)=>{}
const add=(num1,num2)=>{return num1+num2}

this指向

this是静态的，this始终指向函数声明时所在作用域下的this值

箭头函数中的this引用的是最近作用域中的this

const obj={
aaa(){
setTimeout(
	function(){
	console.log(this);	%this指向windows对象，因为call方法将window作为第一个参数传入
	})
setTimeout(()=>{
	console.log(this);	%为aaa函数的作用域，aaa在obj对象内定义，因此aaa的this指向对象
})
}
}

箭头函数的简写

（1）省略小括号
当形参有且只有一个时
（2）省略大括号
当代码体只有一条语句时，此时return必须省略

6 函数

（1）函数的参数可以赋予默认的初始值
（2）rest参数用于和获取函数的实参

function（...args）{}

扩展运算符（…）

[…]扩展运算符能将数组转换成逗号分隔的参数序列

7 Symbol

特性：
（1）值是唯一的，可以解决命名冲突
（2）不能与其他数据进行运算
（3）定义的对象属性不能使用for…in遍历，但可以使用Reflect.ownKeys获取对象的所有键名

let s=Symbol()
let s2=Symbol().for()

使用场景：给对象添加属性和方法

8 迭代器

for…in 和for …of区别
（1）in取出的是键名
（2）of取出的是键值

原理： 创建一个指针对象指向当前数据结构的起始位置，然后调用next方法指向数据结构中的第一个成员，不断调用next，直到指向最后一个成员

  <script>
    const s={
      name:'1',
      ss:[1,2,3],
      [Symbol.iterator](){
        let _this=this
        let index=0;
        return {
          next:function(){
            if (index<_this.ss.length)
            {
              const result={value: _this.ss[index],done:false}
              index++
              return result
            }else{
              return{value:undefined,done:true}
            }
          }
        }
      }
    }
    for (let v of s){
      console.log(v);
    }
  </script>

9 生成器（常用于异步编程）

    function one(){
      setTimeout(()=>{
        console.log(111);
        iterator.next()
      },1000)
    }

    function two(){
      setTimeout(()=>{
        console.log(222);
        iterator.next()
      },1000)
    }

    function three(){
      setTimeout(()=>{
        console.log(222);
        iterator.next()
      },1000)
    }

    function * gen(){
      yield one();
      yield two();
      yield three();
    }

    let iterator=gen()
    iterator.next()
    iterator.next()
    iterator.next()

10 Promise

（1）读取文件

const p=new Promise((resolve,reject)=>{
	fs.readfile("",(err,data)=>{
		if (err) reject(err);
		resolve(data);
})
})

p.then(function(res){console.log(res)},function(err){console.log('')})

（2）封装ajax

//1、创建对象
const xhr=new XMLHttprequest();
//2、初始化
xhr.open("get","")
//3、发送
xhr.send();
//4、绑定事件
xhr.onreadystatechange=function(){
	if(xhr.readyState===4)
	{
		if(xhr.statue>=200&&xhr.statue<300)
		{
			console.log(xhr.response)
		}
	}
}

封装成Promise:

const p=new Promise((resolve,reject)=>{
	//1、创建对象
	const xhr=new XMLHttprequest();
	//2、初始化
	xhr.open("get","")
	//3、发送
	xhr.send();
	//4、绑定事件
	xhr.onreadystatechange=function(){
		if(xhr.readyState===4)
		{
			if(xhr.statue>=200&&xhr.statue<300)
			{
				reslove(xhr.response)
			}
			else{
				reject(xhr.status)
			}
		}
}
})
})

注：
（1）then方法的返回结果是Promise对象，对象状态由回调函数的执行结果决定
（2）返回非promise类型的属性，状态为成功

11 Set

类似于数组，值是唯一的
包含属性：add、delete、has、clear

数组去重

let arr=[1,2,3,4,5,1]
let res=[...new Set(arr)]

交集

let arr=[1,2,3,4,3,3,2]
let arr2=[1,1,1,1,1]
let result=[...new Set(arr)].filter(item=>{
	let s2=[...new Set(arr2)]
	return (s2.has(item))
})

12 Map

let m=new Map()
m.set('name','')

13 类

//ES5
function phone(brand,price){
	this.brand=brand,
	this.price=price
}

Phone.probetype.call=function(){
	console.log(1)	
}
let huawei=new Phone()

//ES6
class Phone{
	constructor(){
	
}
}

static声明属性属于类而不属于实例化对象

类继承

      class Phone{
        constructor(brand,price){
          this.brand=brand
          this.price=price
        }
        call(){
          console.log(1);
        }

      }

      class SmartPhone extends Phone{
        constructor(brand,price,color,size){
          super(brand,price)
          this.color=color
          this.size=size
        }

        photo(){
          console.log(111);
        }
      }
      const iphone=new SmartPhone('apple',5999,'white','6.1')
      console.log(iphone.call);

getter和setter

注：setter必须要有一个参数
getter属性在获取对象属性时触发，setter属性在变更对象属性时触发

数值类型转换：parseInt、parseFloat

对象方法扩展

（1）Object.is：判断对象是否相等
（2）Object.assign：合并对象