es6至es8——js新语法第一篇

ES6(ES2015)

1.局域作用域

let , const 定义的变量局域作用域，局域作用域变量只能声明一次，不能重复声明。

let 定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问。

const 用来定义常量，使用时必须初始化(即必须赋值)，只能在块作用域里访问，而且不能修改。

let a = 1; const b = 1;
let a = 2; const b = 2;
以上声明了两次，第一次声明成功，第二次会报错
const c ；c = 1
如此也是错误，因为const声明的常量要在定义时就赋值
let a = 1
const b = 1
这样写才是正确的

 

2.箭头函数

fn( ) => { }  // 当只有一行代码时会自动return和可以不写{ }
如 fn( ) =>  a=1  // 会return a ，和普通的函数相比不用function声明，里面没有this，this是其父级作用域的this

 

3.promise 

解决回调地狱的问题
new Promise((resolve,reject)=>{
　　异步请求{
　　　　if(条件){
　　　　　　resolve(data)
　　　　}else{
　　　　　　reject(err)
　　　　}　　
　　}
}).then((data)=>{
　　resolve后的继续操作，
}).catch((err)=>{
　　 reject后的操作
})
resolve表示成功的，then是成功的操作，接收请求resolve返回的数据(then为异步所以不会出现接收数据不到问题)
reject为失败的，catch是错误的操作，接收reject返回的数据

Promise还有 Promise.all的用法
基本用法为Promise.all([基础Promise，基础Promise]).then().catch()
其它的就不再赘述了，有兴趣的朋友可以自己去了解

 

4.解构赋值 

let { foo, bar } = { foo: 'aaa', bar: 'bbb' }; // 自己解构成foo,bar
console.log(foo,bar) // foo = 'aaa' // bar = 'bbb' ；
let { baz : foo } = { baz : 'ddd' }; // 解构并且给其改名为foo
console.log(foo)  // foo = 'ddd'

 

5.扩展张运算符

 let a = {a: 2}; let b = {...a}  // 将数组变成对象的键值对

 

6.默认参数

( a, b=2 ) => { } // 如果b没有传入b默认为2

 

7.模板字符串

与单双引号对比的差别
1.可换行
`11
11`
2.可包含变量 
`1${变量}1`

 

ES7(ES2016)

1.includes()

变量.includes()，用来判断一个数组或者字符串是否包含一个指定的值
包含返回true，不包含返回false 
如：[1,2,3].includes(1) 返回true 
    "arg".includes('b') 返回false

 

ES8(ES2017)

1.object.values()

是一种对象的快速取值的方法,返回一个由值组成的数组。
如：
const obj = { a:1, b:'two' , c:[3] }
const values = Object.values(obj) // values:[1,'two',[3]]
目前的现代浏览器（除了IE、Opera Mini）和Node(Node.js 7.0+)本身都支持值此方法

 

2.object.entries()

对象返回数组。返回数组中的每个值都是一个子数组，由键值对组成
如：
const obj = { a:1, b:'two' , c:[3]}
const values = Object.entries(obj)

/*
[
  ['a',1],
  ['b',two],
  [c,[3]]
]
*/

目前的现代浏览器（除了IE、Opera Mini和iOS Safari）和Node(Node.js 7.0+)本身都支持值此方法

 

3.padStart()和padEnd()

字符的填充，padStart是在前面填充，padEnd是在后面填充
第一个参数表示字符的长度，在不到规定长度时用第二个参数补足，如果第二个参数不写默认为空格
如：

'abc'.padStart(5);         // '  abc'
'abc'.padStart(5,'-');     // '--abc'
'abc'.padStart(10, '123'); // '1231231abc'
'abc'.padStart(1);         // 'abc'

'abc'.padEnd(5);           // 'abc  '
'abc'.padEnd(5,'-');       // 'abc--'
'abc'.padEnd(10, '123');   // 'abc1231231'
'abc'.padEnd(1);           // 'abc'

目前的现代浏览器（除了IE）和Node本身都支持值此方法(Node.js 8.0+)

 

 

作者：博客园-DDjans，转载时请注明来源。

(请勿将文章用在任何商业用途，违者将承担相应法律责任)