ES6 經常使用詳解(二)

一、面向對象(基礎)
①class關鍵字、構造器和類分開了
②class裏面直接加方法ajax

傳統的面向對象老版本是這樣的:異步

function User(name,pass){
    this.name = name;
    this.pass = pass
}

User.prototype.showName = function(){
    alert(this.name)
}
User.prototype.showPass = function(){
    alert(this.pass)
}

var u1=new User('blue','123456')
u1.showName();
u1.showPass();

問題:
1.在原來的JavaScript裏面,是否是類和構造函數是一個東西。User是否是構造函數?是,User是構造函數,User是否是類,也是,也是類,這就很奇怪。
2.類散開了。函數

新版本寫法:this

class User{
    //構造器
    constructor(name){
        this.name=name;
        this.pass=pass;
    }
    
    showName(){
        alert(this.name);
    }
    showPass(){
        alert(this.pass);
    }
}

繼承:url

老版本繼承:prototype

function VipUser(name,pass,leavel){
    User.call(this,name,pass);
    this.level=level;
}
VipUser.prototype=new User();
VipUser.prototype.constructor=VipUser;

VipUser.prototype.showLeavel=function(){
    alert(this.level)
}
var v1=new VipUser('tom','123456',3)
v1.showName()
v1.showPass();
v1.showLeavel();

新版本繼承:
class VipUser extends User{code

constructor(name,pass,level){
    // 超類/父類
    super(name,pass);
    this.level=level;
}

showLevel(){
    alert(this.level)
}

}對象

二、Promise繼承

解決回調地獄,用同步同樣的方式,來書寫異步代碼。
Promise.all([$.ajax(),$.ajax()]).then(result=>{
    //對了
},err=>{
    //錯了
})

Promise.race 競速
假設:
如下的請求表明同時發出多個請求,哪一個先得到數據就用哪一個。ip

Promise.race([
    $.ajax({url:'http://a2.taobao.com/data/users'}),
    $.ajax({url:'http://a5.taobao.com/data/users'}),
    $.ajax({url:'http://a3.taobao.com/data/users'}),
])
相關文章
相關標籤/搜索