ES6新语法(二)

昨天向人人引见了ES6的一部分新语法,本日我将把剩下我所晓得的新语法都写到这里

插值表达式

//之前
var name="jim"
var age=23

var say="name:"+name+"age:"+age

//es6
var say="name:${name}age:${age}"

多行字符串

let str="
<div>
      <h1>我是jim</h1>
</div>
"        //写多行字符串会语法报错

//es6
let str=`
<div>
      <h1>我是jim</h1>
</div>
`    //准确,并能按花样输出   

这个誊写体式格局很像python的三引号,不晓得小伙伴们想起来了没。

this

//一般函数
document.onclick=function fn(){
    console.log(this)
}    //点击页面涌现:#document    this指向调用者    

//对象
var obj={
    x:1,
    y:2,
    sum(){
        console.log(this)    //{x: 1, y: 2, sum: ƒ}
        return this.x+this.y    //不加this会找不到x,y,可见this和上面作用雷同
    }
}
console.log(obj.sum())

//箭头函数
document.onclick=()=>console.log(this)  //Window

为一般函数牢固this,如第一个例子
let obj={
    name:'jim'
}
fn=fn.bind(obj)
fn()    //{name: "jim"}    this指向了obj

this的指向关于一般函数指向了调用它的对象,关于箭头函数指向了所处大环境,关于对象指向其自身

Promise:同步操纵处置惩罚异步之痛

#关于之前我们一个页面要处置惩罚好几个ajax要求能够须要根据步骤一步步来操纵,而如今,我们有了Promise,看看详细怎样操纵吧
let p=new Promise({
    (resolve,reject)=>{
      $.ajax({
        url:request url,
        success(data){
          resolve(data)
        },
        error(err){
          reject(err)
        }
      })
    }
  })
  p.then((data)=>{},(err)=>{})    //then用来末了处置惩罚数据

Promise.all([
    $.ajax(),
    $.ajax(),
    $.ajax(),
]).then(data=>{},err=>{})    //批次处置惩罚,其data是一个数据数组,有需求能够经由过程解构然后处置惩罚

async/await

async function fn(){
    console.log('1')
    let v=await 2    //背面跟同步操纵是不守候的
    console.log(v)
}
fn()    //1\n2

async function fn(){
    console.log('1')
    let v=await $.ajax('a.txt')    //$.ajax就是一个Promise
    console.log(v)    //输出ajax猎取数据
}
fn()

我们能够经由过程async/await+Promise做异步处置惩罚,削减传统的开辟难度。

    原文作者:二十一
    原文地址: https://segmentfault.com/a/1190000017467273
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞