jQuery AJAX - присвояване на върнатите данни към променлива

[georgirgeorgiev]

Имам два JSON файла.
Искам с jQuery да направя две AJAX заявки и да присвоя върнатите данни от заявките, към две различни променливи.
Намерих един сравнително лесен начин по който мога да направя това. Това е той:

(тъй, като двете AJAX заявки са идентични, ще дам пример само с една променлива и една заявка)

Код: Javascript

1. var companies;
2.  
3. $.ajax({
4.     async: false,
5.     global: false,
6.     url: "../../js/companies.json",
7.     dataType: "json",
8.     success: function(data){
9.         companies = data;
10.     }
11. });

По този начин, биват присовени данните от "data" върнатият резултат от AJAX заявката, към променливата "companies". Всичко е наред до тук.
Обаче в последствие когато променя някакво съдържание в страницата без да се е презаредила страницата, информацията в страницата не се обновява. Почетох малко в интернет и ако съм разбрал правилно, това, което става е че браузъра/страницата замръзва, защото заявката е синхронна (вместо асинхронна), заради аргумента:

Код: Javascript

1. async: false

Обаче коато този аргумент не го сложа в AJAX заявката, данните от JSON файловете не биват присвоени към променливите, не се получава успешно заявка-отговр, без наличието на този аргумент.

Знаете ли дали има начин по който мога да присвоя данните върнати от AJAX заявките, към променливи, обаче без да изниква този проблем с замръзването, ами страницата и всичко останало да си работи коректно и информацията в нея да се обновява ?

[Avalanche]

Трябва да продължиш с изпълнението на логиката на кода си в callback функцията (success в твоя случай), или да ползваш promise. Първия вариант е по-лесен за разбиране, но при по-голяма логика има опасност да изпаднеш в нещо наречено callback hell, и кодът ти започва да наподобява спагети (нещо характерно за jQuery между другото). Промисите, честно казано, не съм ги ползвал с jQuery, но като цяло концепцията при тях е че ти дават обект, който отговаря за решаването на асинхронната задача и каква логика да се изпълни за тогава. Гугълни го - това не е нещо което съм ползвал особено много и се затруднявам да ти дам хубава и изчистена теория.

[georgirgeorgiev]

Благодаря ти от все сърце!
Сега ще потърся за промисите, защото така съм написал логиката, че ми е нужно да имам две променливи съдържащи данните от двата JSON-а в тях. И в последтвие вече да използвам тези променливи на някои определени места от кода, където са ми нужни.

[bulforce]

Така и така сте вдигнали летвата с промисите, да взема и аз да я повдигна още малко.

С промиси и без промиси при повечко асинхронни заявки зависещи една от друга пак ще се окажеш в колбек хела

Решението е да се изполват генератори. Това са функции които се декларират с function* и ползват ключова дума yield за спирачка вътре във функцията. На node.js работят от раз, за браузър ще трябва да се ползва polyfill.

Това е единствения изход от колбек пирамидите, особенно при среди като node понеже там почти всичко е async.

[Avalanche]

Еее чакаме, чакаме EcmaScript 6 съпорт и по браузърите в близкото бъдеще 

[bulforce]

В браузърите има солиден съпорт, естествено говорим за последни версии, така че ако чакате целия интернет изведнъж да започне да поддържа ес6 ще има да си почакате. Но както казах не е задължително да се чака изобщо, можете още днес да ползвате почти всико от ес6 със съответния полифил.

https://kangax.github.io/compat-table/es6/

Полифила ще ви трябва за продъкшън, за дев можете да си свалите по-нов браузър и да си цъкате на нейтив и ще си имате добра среда за дебъг и тнт. Проблема на полифила е, че конвертира кода към ес5 и се получават едни макарони дето нямат четене.