Я создаю простой загрузчик с перетаскиванием, используя Promises, однако я получаю Uncaught SyntaxError: Unexpected token .
при попытке передать метод (object.function) в качестве параметра для функций обратного вызова обещания/отклонить.Передача (object.function) в качестве параметра
Я ищу, чтобы организовать свое обещание обратные вызовы как методы под resolve
и reject
объектов, так и в случае загрузки было бы resolve.upload
и reject.upload
, и, например, если бы я имел обещание входа в аккаунт для аутентификации пользователей скажем тогда было бы т.е. resolve.signin
и reject.signin
.
Текущий шаблон обещания заключается в цепочке then(), catch(), reject(), resolve(), это ужасный шаблон программирования, если использование сокетов и цепочек 2+ асинхронных вызовов кода становится сложным для управления, поскольку вы гнезда все больше и больше анонимных функций, также известный как pyramid of doom pattern, чтобы избежать этого шаблона, я использую еще один, который я использовал бесчисленное количество раз для асинхронных вызовов, как я делаю в приведенном ниже коде, когда я устанавливаю асинхронные прослушиватели событий client.addEventListener(prop, callback.upload[prop]);
и обрабатывать их в отдельном объекте callback.upload.event
.
Точно так же я обрабатываю ответ обратного вызова для запроса async, я пытаюсь реализовать для обещаний избегать привязки/вложенности 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>
Вам нужно определить обратные вызовы перед объектом-исполнителем? – IrkenInvader
@IrkenInvader да, это первое, что я подумал, но я изменил его и все тот же ошибку –
Это странно во многих отношениях, трудно понять, с чего начать. –