ES6新语法

let const

//let
//有块作用域
//不能重复声明
//不存在变量提升 只能先声明再使用	
//暂时性死区
let num = 10
    if(true){
        console.log(num)
        let num = 20    //内部没有定义num则会用外部的num，内部定义了，则num会和此块作用域绑定，先使用后声明出错
    }
//const 定义一个常量，声明时候必须赋值 其他特性与let相同

解构赋值

//从对象或数组中提取数据，并赋值给多个变量
//========对象==============
let obj = {name:'kobe', age:39}
let {name,age,xxx} = obj
//如果是对象中没有的，会赋值为undefined
//函数解构赋值
function foo({name,age}){
	console.log(name,age)
}
foo(obj)
//========数组==============
let arr = [1,2,34,'add']
let [a,b,c,d,e] = arr
//过多的undefined e=undefined
let [,,c,d] = arr	//c=34 d='add'

模板字符串

//简化字符串的拼接
let obj = {name:'kobe', age:39}
let str = `名字：${obj.name},年龄：${obj.age}`	
//${}为解析变量 也可以调用函数${say()}
//模板字符串中可以换行

对象简写方式

let name='kobe',age=39
let obj = {
	name,	//同名的属性可以省略不写
	age,
	getName(){	//可以省略函数的function
		return this.name
	}
}

箭头函数

//没有形参的时候 () 不能省略
let fun1 = () => console.log('箭头函数')
fun1()
//一个形参 () 可以省略
let fun2 = a => console.log('箭头函数')
fun2()
//多个形参 () 不能省略
let fun3 = (x,y) => console.log('箭头函数')
fun3()
//函数体只有一条语句或者表达式的时候{}可以省略
//会自动返回语句执行的结果或者表达式的结果,相当于自动加了个 return
//如果加了 {} 必须加上return
let fun4 = (x,y) => x + y
console.log(fun4(10,20))

//箭头函数的this不是调用的时候决定的，指向的是函数定义位置的上下文this
//在定义的时候处在的对象就是它的this
//主要看外层有没有函数 若外层有函数则为该函数的this
//若外层没有函数，则为window
let obj = {	//对象类型没有自己的块作用域
	name:'arrow'
	getName:() => {
		btn.onclick = () => {
			console.log(this)
		}
	}
}
obj.getName()	//window 因为箭头函数没有自己的this

let obj = {
	name:'arrow'
	getName:function() {
		btn.onclick = () => {
			console.log(this)
		}
	}
}
obj.getName()	//obj 函数声明有自己的this

三点运算符

//arguments和...运算符的区别：arguments返回的是伪数组，不能用forEach遍历，
//...运算符返回的是数组可以用forEach遍历
//但是...运算符只能放在最后面，前面可以有形参，但后面不能有形参
function foo(...value) {
	value.forEach(function(item,index){
		console.log(index,item)
	})
}
foo(1,3,6,8,9)

let arr = [1,5]
let arr1 = [2,3,4]
arr = [1,...arr1,5]	//...把目标中的值全部取出
arr.push(...arr1)
console.log(...arr)	//循环遍历

形参默认值

//当不传入参数的时候默认使用形参里的默认值
function Point(x=1,y=2){
	this.x=x
	this.y=y
}
let point = new Point()
console.log(point)
let point1 = new Point(3,4)
console.log(point1)

promise

//promise代表未来某个将要发生的事件（通常是个异步操作）
//可以将异步操作以同步的流程表达出来，避免层层嵌套的回调（俗称 回调地狱）

//promise三个状态
//pending 初始化状态
//fullfilled 成功状态
//rejected 失败状态

//创建promise对象 初始化promise状态 pending
let promise = new Promise((resolve,reject) => {
 //执行异步操作，通常是发送ajax请求，开起定时器
 setTimeout(() => {
   //根据异步任务的返回结果修改promise状态
   //resolve('成功数据') //修改promise状态为 fullfilled
   reject('失败数据')  //修改promise状态为 rejected

},1000)
})
promise //data和error分别传 resolve和reject中的数据
 .then((data) => {
   console.log('成功了')  //成功的回调
 },(error) => {
   console.log('失败了')  //失败的回调
 })

symbol

//symbol属性值对应的值是唯一的，解决命名冲突问题
//symbol值不能与其他数据进行计算，包括同字符串拼接
//for in, for of 遍历时不会遍历symbol属性

//调用Symbol函数得到symbol值
let symbol = Symbol()
let obj = {}
obj[symbol] = 'hello'	//不能用obj.symbol = 'w ' 添加

let symbol2 = Symbol('one')
let symbol3 = Symbol('two')
console.log(symbol2 == symbol3)	//false

//可以定义常量
const person =  Symbol('person_key') 

iterator/for in/for of

let arr = [1,4,34,6]
//for in 循环返回 键值名/下标
for (let i in arr) console.log(i)
//for of 返回对应的 值
for (let i of arr) console.log(i)
//for in可以遍历数组 for of不能 除非加上iterator
//将iterator接口部署到指定数据类型上，可以用for of遍历 
//这类有 数组 字符串 arguments（伪数组） set容器 map容器
//...运算符和解构赋值其实也是调用iterator遍历器

let str = 'qaeaad'
for(let i of str) console.log(i)

function fun(){
	for(let i of arguments){
		console.log(i)
	}
}

generator

//是ES6提供的解决异步编程的方案之一
//generator函数是一个状态机，内部封装了不同状态的数据
//用来生成遍历对象
//可暂停函数（惰性求值），yield可暂停，next方法可启动，每次返回的是yield后的表达式结果

//generator函数返回指针对象，而不会执行函数内部逻辑
//调用next方法函数内部逻辑开始执行，遇到yield停止
//再次调用next方法会从上一次停止的yield处开始，直到最后
//yield语句返回结果通常为undefined，当调用next方法时传参内容会作为启动时yield语句的返回值
function* myGenerator(){
	console.log('开始执行')
	yield 'hello'
	console.log('暂停后再次执行')
	yield 'generator'
	console.log('遍历完毕')
	return '返回的结果'	
	//指定最后返回结果，如果没有则是上一个yield返回的结果
}
let mg = myGenerator();	//返回的是指针对象
console.log(mg.next())	 
console.log(mg.next())	 
console.log(mg.next())	 

字符串扩展

//简化字符串的拼接
let obj = {name:'kobe', age:39}
let str = `名字：${obj.name},年龄：${obj.age}`	//模板字符串
//${}为解析变量 也可以调用函数${say()}
//模板字符串中可以换行
let str='adafa'
console.log(str.includes('a'))	//true
console.log(str.includes('da'))	//true
console.log(str.startsWith('a'))	//true
console.log(str.startsWith('ad'))	//true
console.log(str.endsWith('a'))	//true
console.log(str.endsWith('fa'))	//true
console.log(str.repeat(5))	//重复五次

数字扩展

console.log(0b1010)	//二进制
console.log(0o78)	//八进制
console.log(0x78)	//十六进制
//判断是否是有限大的数
console.log(Number.isFinite(Infinity))//false
//判断是否是NaN
console.log(Number.isNaN(NaN))	//true
//判断是否是整数
console.log(Number.isInteger(12.3))//false
console.log(Number.parseInt('12a'))//12
console.log(Number.parseInt('a12'))//NaN
//去除小数部分
console.log(Math.trunc(123.12))//123

数组扩展

//展开语法 将数组转为用逗号分隔的参数序列。
 let ary = [1, 2, 3];
 ...ary  // 1, 2, 3
 console.log(...ary);    // 1 2 3
 //合并数组
 // 方法一 
 let ary1 = [1, 2, 3]; let ary2 = [3, 4, 5];
 let ary3 = [...ary1, ...ary2];
 // 方法二 
 ary1.push(...ary2);
 //将类数组转换为真正的数组
let btn = document.getElementsByTagName('button');
console.log([...btn])//真正的数组
//将伪数组对象或可遍历对象转换为真数组
Array.from(btns).forEach(function(item,index){
	console.log(index,' ',item)
}
//将一系列值转换成数组
let arr = Array.of(1,4,'ab',true)
arr.forEach(function(item,index){
	console.log(index,' ',item)
}
//找出第一个满足条件返回true的元素
let arr2 = [24,4,6,8753,45]
let ans = arr2.find(function(item,index){
	return item > 4	// index>2 8753
})
console.log(ans)
//找出第一个满足条件返回true的元素下标
let ans1 = arr2.findIndex(function(item,index){
	return item > 4	// index>2 8753
})
console.log(ans1)
//表示某个数组是否包含给定的值，返回布尔值。
[1, 2, 3].includes(2) // true

对象扩展

// Object.is
console.log(0 == -0)	//true
console.log(NaN == NaN)	//false
console.log(Object.is(0,-0))//false 判断的时候按照字符串判断
console.log(Object.is(NaN,NaN))	//true

// Object.assign 将源对象属性复制到目标对象上
let obj = {}
let obj1 = {name:'ans',age:34}
let obj2 = {sex:'male'}
Object.assign(obj, obj1, obj2)//obj为目标对象

//直接操作 __proto__ 属性
obj.__proto__ = obj1
console.log(obj)
console.log(obj.name)

set map

// set存放无序不重复的值 重复的值会自动删除
let set = new Set([1,2,44,5,5,2,])
console.log(set,set.size)	//[1,2,44,5] 4
set.add(7)
set.delete(44)
console.log(set.has(2)) //true
set.clear()	//清空set
console.log(set.size)
//map 存放不重复的key-value
//每个[]存放一对key-value 多余的忽略 注意是两个[[]]
let map = new Map([['aa','bb',78],[22,33]])
map.set(78,'a')	//添加
console.log(map.get(22))
map.delete('aa')
map.has('aa')	//true
map.clear()
console.log(map.size)