面試時遇到類似問題,大意就是,載入頁面時,會用script標籤載入一些js檔案資源,這些資源如果長時間沒有請求回來,怎麼手動終止請求?
我知道Ajax請求有個abort方法,不知道面試官是不是想問這個,以及還有什麼別的請求方式的終止方法嗎?
我想大声告诉你2017-06-28 09:30:55
謝邀。
像 @小溪 說的一樣,是考察timeout。
大致實現思路這樣:
var sequence = ['foo', 'bar', 'baz', 'base', 'ball', 'hello', 'world', '100k more'],
start = Date.now();
setTimeout(function _worker() {
do {
var element = sequence.shift();
// do something with element
} while( sequence.length && (Date.now() - start < 100) );
if( sequence.length )
setTimeout(_worker, 25);
}, 25);
以上例子,25毫秒間隔執行佇列加載,加載時間在100ms內。
typecho2017-06-28 09:30:55
的載入總是同步(阻塞性)的,也不能用DOM操作去影響。題主需要的是獨立於頁面載入與渲染的異步JS載入。工具很多,這裡舉一個RequireJS的例子:
HTML頁:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test Page</title>
<script src="//cdn.staticfile.org/require.js/2.1.15/require.min.js" data-main="test1"></script>
</head>
<body></body>
</html>
保存為test1.js
:
require.config({
paths: {
'jquery': '//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery',
'underscore': '//cdn.bootcss.com/underscore.js/1.7.0/underscore'
},
waitSeconds: 20
});
require(['jquery'], function (module) {
console.log("jQuery " + $.fn.jquery + " successfully loaded. ");
}, function (err) {
console.log("SHIT happened while loading jQuery! ");
});
require(['underscore'], function (module) {
console.log(_.last([1, 2, 3, "Underscore.js successfully loaded. "]));
}, function (err) {
console.log("SHIT happened while loading Underscore.js! ");
});