我正在使用_2480368构建一个简单的拖放上传器但是当我尝试传递一个方法(object.function)作为promise的回调函数的参数解析/拒绝时,我得到一个 Uncaught SyntaxError: Unexpected token .
.
我正在寻找组织我的承诺回调作为 resolve
和 reject
对象下面的方法,所以在上传的情况下它将是 resolve.upload
和 reject.upload
,例如,如果我有一个签署承诺说用户认证然后它将是ie . resolve.signin
和 reject.signin
.
当前的promise模式是链接then(),catch(),reject(),resolve()这是一个可怕的编程模式,如果你使用套接字和链2异步调用代码变得难以管理,因为你越来越匿名函数也称为pyramid of doom pattern,为了避免这种模式,我在无异常调用中使用了无数次,因为我在下面的代码中设置了异步事件监听器 client.addEventListener(prop, callback.upload[prop]);
并在单独的对象_2480379中处理它们 .
以同样的方式我正在处理异步请求的回调响应,我试图实现promises以避免在如此长的无法管理的函数中链接/嵌套5-10异步请求,但是为回调函数传递方法(object.function)对于承诺 function(resolve.upload,reject.upload)
似乎不起作用,但是我传递一个全局函数(函数),即 resolve
或 reject
它会工作得很好,但这不好,因为它会混乱全局命名空间,这就是为什么我我试图通过 object.method
.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles/upload.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<script>
//EVENT LISTENERS
var listen = {
drag: ['dragenter','dragover','drop','dragleave'],
async: ['readystatechange','loadstart','progress','abort','error','load','timeout','loadend']
};
//PROMISES
var executor = {
//THIS IS WHERE MY PROBLEM LIES
upload: function(resolve.upload,reject.upload){
var data = new FormData();
var client = new XMLHttpRequest();
data.append('xls', executor.upload.files);
for(prop of listen.async){
client.addEventListener(prop, callback.upload[prop]);
}
client.open("POST", "/core/upload.php");
client.send(data);
}
};
//PROMISES HANDLERS
var resolve = {
upload: function(value){
console.log(value);
}
};
var reject = {
upload: function(reason){
console.log(reason);
}
};
//USER HANDLERS
var handles = {
upload: {
dragenter: function(e){
e.target.classList.remove('emboss');
}
dragover: function(e){
e.preventDefault();
}
drop: function(e){
e.preventDefault();
executor.upload.files = e.dataTransfer.files[0];
//CREATE PROMISE
var p = new Promise(executor.upload);
console.log(p);
//CHECK PROMISE STATUS, EVERY 3 SECS
setInterval(function(){
console.log(p);
}, 3000);
}
dragleave: function(e){
e.target.classList.add('emboss');
}
}
};
//ASYNC HANDLERS
var callback = {
upload: {
readystatechange: function(e){
console.log(e.target.readyState);
}
loadstart: function(e){
console.log('loadstart');
}
progress: function(e){
console.log('progress');
}
abort: function(e){
console.log('abort');
}
error: function(e){
console.log('error');
}
load: function(e){
console.log('load');
}
timeout: function(e){
console.log('timeout');
}
loadend: function(e){
console.log('loadend');
}
}
};
//INITIALIZATION
function init(){
var dropbox = document.getElementById('dropbox');
for(prop of listen.drag){
dropbox.addEventListener(prop, handles.upload[prop]);}
};
//CALL INIT
document.addEventListener('DOMContentLoaded', init);
</script>
</head>
<body>
<div id="dropbox" class="fa fa-file-excel-o fa-4x emboss"></div>
</body>
</html>
2 回答
您不能将自己的回调传递给传递给Promise构造函数的函数 . 您可以做的是在后续链中注册回调,例如:
但是为了使它有用,
execute.upload
函数实际上必须根据XMLHttpRequest
对象的作用调用传递的resolve
和reject
参数:这是在Promise构造函数的回调中调用
resolve()
或reject()
的操作,最终导致调用.then
注册的处理程序 .在“fatarrow”语法中:
左侧的parens中的名称是
{ thing to be returned }
部分的本地名称 . 事实上,除了"this"的差异之外,关于所有的fatarrow数量是一个句法简写 . 所以这两个函数定义基本相同:你要:
无论您在何处进行CALL上传,您都可以去:
我也不确定你对诺言的使用 . 据我所知,回调是给你的,你可以打电话 . 就是这样的 .
然后你可以使用类似的东西: