es学习记录2

一：ES6简介

变动的内容：

变量
函数
数组
字符串
面向对象
promise
generator 异步操作（其实是对promise的封装）
模块化

来源：正式发布于2015年6月份。 ES6 = javascript2015。
兼容性： IE10+，稳定版本的chrome、fireFox、移动端、node环境兼容良好。
兼容性处理：
1.在线转换：
页面中引入babel.js或browser.js，在script标签中声明type="text/babel"。在其中书写ES6语法，页面加载运行后会生成ES5的语法。

  <script type="text/babel">
  		let a=1;
  		const b=2;
  </script>

页面加载转换成es5代码

<script> 
"use strict"
  var a =1;
  var b =2;
</script>

2、提前编译
node、webpack

二：变量

var变量存在的问题：
1.可重复声明

var a = 12;
var a = 14;

2.无法限制修改。（无常量的概念）
3.无块级作用域（存在全局作用域与函数作用域）

let用于声明一个变量
const用于声明一个常量
皆不可重复声明，皆有块级作用域 最简单的一个块{}

三：箭头函数

函数的简写形式
() => { }
1.当只有一个参数时，可省略()；
2.当只有一个return时，可省略{}和return关键字

四：`...`运算符（参数的收集和数组的展开）和函数的默认参数值

1.剩余参数的收集。常用于函数多余传参的收集

let k = (a,...args)=>{
  alert(a)      // 1
  alert(args) // 2,3,4,5
}
k(1,2,3,4,5)

2.数组的展开

let arr1= [1,2,3]
let arr2= [4,5,6]
let arr3 = [...arr1,...arr2]   // [1,2,3,4,5,6]

3.函数的默认参数值，在声明函数的时候给参数一个默认的初始值

let k = (a=1,b=2)=>{
  alert(a+b)  //  3
}
k(4,5) // 9

五：数组新增的4个方法

1.map 映射

一个对一个，进去多少出来多少,要有一个返回值　return

let arr = [1,2,3]
let result = arr.map(item = > item*2)
console.log(result)  //2,4,6

2.reduce 汇总

一堆出来一个。算总数，求均值等。

let arr = [4,5,6]
let result = arr.reduce((tmp,item,index)=>{　　// tmp 这一次的中间结果
	return tmp + item
})

3.filter 过滤器

剩余一部分，消失一部分
返回符合条件的部分

4.forEach 循环（迭代）

六：解构赋值

１．两边的结构必须相同，必须是同一个东西。
２．右边必须符合ｊｓ的语法。
３．声明和赋值必须在一句话里完成，不能分开。

let [{a,b},[n1,n2,n3],p,str]=[{a:12,b:5},[12,5,8],9,"hello"]

let [json,arr,p,str]=[{a:12,b:5},[12,5,8],9,"hello"]

七：字符串的`startsWith`，`endsWith`和模板字符串``

startsWith('str') ,判对某个东西是否以给定条件的字符串开头，返回布尔值。

let addressUrl="http://"
alert(addressUrl.startsWith("http")) //  true

endsWith('str'),判对某个字符串是否以什么结尾。返回布尔值。

let docType = "canglaoshi.avi"
alert(docType.endsWith("avi"))  // true

模板字符串用``, 其中的变量用${}包裹

let content = "hello"
let page = `<div>${content}</div>`