1.簡述創(chuàng)建函數(shù)的幾種方式
第一種(函數(shù)聲明):
function sum1(num1,num2){
return num1+num2;
}
第二種(函數(shù)表達(dá)式)
var sum2 = function(num1,num2){
return num1+num2;
}
第三種(函數(shù)對象方式)
var sum3 = new Function("num1","num2","return num1+num2");
2.js 延遲加載的方式有哪些?
1. defer 和 async(異步加載)
當(dāng)瀏覽器碰到 script 腳本的時候:
1. <script src="script.js"></script>
沒有 defer 或 async原探,瀏覽器會立即加載并執(zhí)行指定的腳本巡莹,“立即”指的是在渲染該 script 標(biāo)簽之下的文檔元素之前攻人,也就是說不等待后續(xù)
載入的文檔元素脏毯,讀到就加載并執(zhí)行。
2. <script async src="script.js"></script>
有 async署恍,加載和渲染后續(xù)文檔元素的過程將和 script.js 的加載與執(zhí)行并行進(jìn)行(異步)兴溜。
3.<script defer src="myscript.js"></script>
有 defer,加載后續(xù)文檔元素的過程將和 script.js 的加載并行進(jìn)行(異步)哑梳,但是 script.js 的執(zhí)行要在所有元素解析完成之后DOMContentLoaded 事件觸發(fā)之前完成劲阎。
從實(shí)用角度來說,首先把所有腳本都丟到 </body> 之前是最佳實(shí)踐涧衙,因?yàn)閷τ谂f瀏覽器來說這是唯一的優(yōu)化選擇哪工,此法可保證非腳本的其他一切元素能夠以最快的速度得到加載和解析
解析奥此。
此圖告訴我們以下幾個要點(diǎn):
1. defer 和 async 在網(wǎng)絡(luò)讀取(下載)這塊兒是一樣的雁比,都是異步的(相較于 HTML 解析)
2. 它倆的差別在于腳本下載完之后何時執(zhí)行稚虎,顯然 defer 是最接近我們對于應(yīng)用腳本加載和執(zhí)行的要求的
3. 關(guān)于 defer,此圖未盡之處在于它是按照加載順序執(zhí)行腳本的偎捎,這一點(diǎn)要善加利用
4. async 則是一個亂序執(zhí)行的主蠢终,反正對它來說腳本的加載和執(zhí)行是緊緊挨著的,所以不管你聲明的順序如何茴她,只要它加載完了就會立刻執(zhí)行
5. 仔細(xì)想想寻拂,async 對于應(yīng)用腳本的用處不大,因?yàn)樗耆豢紤]依賴(哪怕是最低級的順序執(zhí)行)丈牢,不過它對于那些可以不依賴任何腳本或不被任何腳本依賴的腳本來說卻是非常合適的祭钉,最典型的例子:Google
Analytics
2. 動態(tài)創(chuàng)建 DOM 方式(創(chuàng)建 script,插入到 DOM 中己沛,加載完畢后 callBack)
創(chuàng)建 script慌核,插入到 DOM 中,加載完畢后 callBack申尼,見代碼
代碼如下:(有兼容性封裝)
3. 按需異步載入 js
默認(rèn)情況 javascript 是同步加載的垮卓,也就是 javascript 的加載時阻塞的,后面的元素要等
待 javascript 加載完畢后才能進(jìn)行再加載师幕,對于一些意義不是很大的 javascript粟按,如果放
在頁頭會導(dǎo)致加載很慢的話,是會嚴(yán)重影響用戶體驗(yàn)的霹粥。