Promise
function fn(){
return new Promise((resolve, reject)=>{
成功時調(diào)用 resolve(數(shù)據(jù))
失敗時調(diào)用 reject(錯誤)
})
}
fn().then(success, fail).then(success2, fail2)
Promise.all
Promise.all([promise1, promise2]).then(success1, fail1)
promise1和promise2都成功才會調(diào)用success1
Promise.race
Promise.race([promise1, promise2]).then(success1, fail1)
promise1和promise2只要有一個成功就會調(diào)用success1
手寫AJAX
完整版
var request = new XMLHttpRequest()
request.open('GET', '/a/b/c?name=ff', true);
request.onreadystatechange = function () {
if(request.readyState === 4 && request.status === 200) {
console.log(request.responseText);
}};
request.send();
簡化版
var request = new XMLHttpRequest()
request.open('GET', '/a/b/c?name=ff', true)
request.onload = ()=> console.log(request.responseText)
request.send()
this
fn()
this => window/global
obj.fn()
this => obj
fn.call(xx)
this => xx
fn.apply(xx)
this => xx
fn.bind(xx)
this => xx
new Fn()
this => 新的對象
fn = ()=> {}
this => 外面的 this
webpack
webpack是基于入口的。webpack會自動地遞歸解析入口所需要加載的所有資源文件操刀,然后用不同的Loader來處理不同的文件,用Plugin來擴展webpack功能宏多。
目前接觸的打包工具有兩個:webpack和parcel。
webpack不好上手但功能強大適用于大型復(fù)雜的項目構(gòu)架竿裂。
parcel易上手適用于簡單的項目达箍。
由于parcel在打包過程中給出的調(diào)試信息十分有限,所以一旦打包出錯難以調(diào)試链韭,所以不建議復(fù)雜的項目使用parcel
loader和plugin
- loader直譯為“加載器”。Webpack將一切文件視為模塊煮落,但是webpack原生是只能解析js文件敞峭,如果想將其他文件也打包的話,就會用到loader蝉仇。 所以Loader的作用是讓webpack擁有了加載和解析非JavaScript文件的能力旋讹。
loader在module.rules中配置。類型為數(shù)組轿衔,每一項都是一個Object沉迹,里面描述了對于什么類型的文件(test),使用什么加載(loader)和使用的參數(shù)(options)害驹。 - plugin直譯為"插件"鞭呕。Plugin可以擴展webpack的功能,讓webpack具有更多的靈活性宛官。 在 Webpack 運行的生命周期中會廣播出許多事件琅拌,Plugin 可以監(jiān)聽這些事件,在合適的時機通過 Webpack 提供的 API 改變輸出結(jié)果摘刑。
plugin在plugins中單獨配置。 類型為數(shù)組刻坊,每一項是一個plugin的實例枷恕,參數(shù)都通過構(gòu)造函數(shù)傳入。