Loading...
daredevil avatar daredevil 7 Точки

Може ли малко инфо за JS и Jquery and Ajax

Не съм много на ясно , но от 2-3 лекции се очаква от нас да пишем код и да правим блогове ли не мога да разбера, не знам дали съм само аз , но ми бяга синтаксиса на JS и не знам как да си реша домашните, не знам от къде да взема инфо как да ги наваксам ? Като за начало исках да попитам как да разбера поне как да си дебъгвам , стартирам проектите за да мога да разбера къде греша и резултата от кода? Всъщност този JS изобщо ли не казва къде какви проблеми има с кода ? Пиша на WS EcmaScrypt 6. При стартиране на проекта ми излиза това съобщение и до там : "Process finished with exit code 0" нищо не знам къде ми е проблема и т.н. Това със "Кинви"-то изобщо не мога да го хвана от къде какво се случва и защо се случват нещата всичко ми изглежда много набързо претупано при обясненията ... Може ли някъде из форума да споделяме домашни къде какво как работи и защо (става въпрос за домашните за JS, Ajax, jQuery последните 3)???

Тагове:
0
Fundamentals Module
evgenikolov avatar evgenikolov 304 Точки

Здравей, ще се опитам да помогна по някой от въпросите.

WebStorm си има дебъгер много подобен на Visual Studio дебъгера. Можеш да го старираш като си във съответният файл по който работиш, натиснеш дясно копче и избираш опция Debug, долу се стартира самият дебъгер и има бутони за Step Over, Step In и тн. Основният клавиш за ходене по редовете е F8. 

Проектите се стартират по същият начин само че с десен бутон и Run.

За да тръгне това което тестваш в конзолата отдолу трябва най-накрая след декларирането на функцията да я извикаш.

Пример:

function solve(){
     //some logic
    console.log("Test");
}

Ако това ти е функцията за да я изпробваш в IDE-то трябва да напишеш най-отдолу:

solve();

Понеже само написана функцията тя си стои там декларирана, но никой не я извиква за да се стартира логиката в нея. 

Judge това го прави автоматично и затова на него се праща само функцията.

'use strict';
function solve(){
     //some logic
    console.log("Test");
}

solve();

Това трябва да ти е цялата структура на кода в webstorm за да можеш да тестваш и съответно да дебъгваш.


Kinvey-то за момента можеш да си го представиш като една завършена, готова за работа база данни със всичките инструменти, която ти складира данните някъде в cloud.
Нарича се MBaaS - Mobile Back-end as a Service, което аз си го превеждам като готова услуга за ползване на back-end (сървърната) част на приложението.

Използваме го само като инструмент за да си правим малките проекти и да не преоткриваме топлата вода. 

Както показаха на лекциите, в Kinvey си правиш регистрация, правиш си ново приложение (нова база за приложението) и да кажеш си правиш 1 таблица със книги в която ти определяш какви колони (тоест свойства да има всяка книга (име, автор и тн)) и съответно попълваш данните там. След това всяка отделна база в Kinvey ти предоставя app id и secret code, който са уникални и чрез тях се свързваш през твоя JS код към Kinvey. Когато се свържеш има доста голяма свобода, можеш да правиш нови записи, да триеш, да променяш и тн през твоя JavaScript код директно в базата. 

Идеята е да видим как всъщност се правят заявки към отдалечени сървъри и съответно как получаваме данните от там и как ги обработваме.

Надявам се обясих доколкото можах. Ако имаш още неясноти ще се опитам да помагам. :)

7
25/06/2016 00:08:27
daredevil avatar daredevil 7 Точки

когато стартирам проект излиза : "Process finished with exit code 0", а как да видя реално какъв е резултатът ? написах това което ми каза :

function solve(){
     //some logic
    console.log("Test");
}
solve();

А от къде мога да черпя информация за JS за синтаксиса ?

0
raging avatar raging 92 Точки

https://developer.mozilla.org/en-US/

0
daredevil avatar daredevil 7 Точки

този код не работи някой може ли да го види защо , какво изпускам ?

 

function product(nums)
{
    let num0 = Number(nums[0]);
    let num1 = Number(nums[1]);
    let num2 = Number(nums[2]);

    let positive = "Positive";
    let negative = "Negative";

    if (num0 < 0 && num1 < 0 && num2 < 0)
        console.log("positive");
    else if (num0 < 0 && num1 < 0 && num2 > 0)
        consle.log("positive");
    else if (num0 < 0 && num1 > 0 && num2 > 0)
        consle.log("negative");
    else if (num0 < 0 && num1 > 0 && num2 < 0)
        consle.log("positive");
    else if (num0 > 0 && num1 < 0 && num2 < 0)
        consle.log("positive");
    else if (num0 > 0 && num1 < 0 && num2 > 0)
        consle.log("negative");
    else (num0 > 0 && num1 > 0 && num2 > 0)
        consle.log("positive");
}
0
dimitur_botev avatar dimitur_botev 112 Точки

Когато ди даде Process finished with exit code 0 значи всичко е минало наред. Това е унверсалния в програмните езици начин да се разбере, че всичко е минало наред.(идва от C). Дебъгването на JS е малко трики, моят съвет е поставяй console.log() за да видиш дали даден фукция се изпълнява, и брейк пойнтове. Изгледай 1-2 по-кратки видеа за да придобиеш идея. JS e зор ако идваш от .NET или Java, но е важен и просто няма как. Само писане го оправя :( Kinvi e платформа на която се пазят данни. По-просто казано, сървър, а сървърът е машина, която предоставя услуги. По-различен тип компютър. Връзката между клиент(в случаят твоят browser) и сървърът(Kinvey) както и преноса на данни по мрежата се осъществява по различни протоколи ( HTTP/ HTTPS). Ако тези протоколи не се подържат от която и да е от двете страни пренос не се осъществява. В общи линии това което беше показано е как се праща заявка, тоест изпращаш  запитване към сървъра а той ти връща подходящият отговор. Ако не си запонзат  с някои основни понятия като DNS IP URI/URL и т.н те съвртвам да прочетеш там за половин-един час, за да не е пъла каша и да имаш представа какво се случва в действителност, а иначе ако имаш по-конкретен въпрос, с радост ще ти помогна ;)

0
25/06/2016 12:51:47
Jinjaar avatar Jinjaar 348 Точки

Здравей!
Ще се опитам да ти дам малко насоки, надявам се да са ти от полза.
 

Както са казали колегите малко над мен, за да видиш резултата от функцията ти първо трябва да я извикаш.Когато слагаш кода си в Judge , там просто му подаваш цялата функция и Judge си я извиква автоматично.

Относно Debugg  в Web Storm става с node.js и е същото като това да Debugg в Visual Studio слагаш брейк пойнт, пускаш с Debug и здраво напред с F8.

Debugg в конзолата на браузара може да стане по два начина: 
1 Може да отвориш конзолата и също да сложиш брейк пойнт на редът който иска

ш и F10.
2. Може да използваш ключовата дума debugger в кода си - Пример:

'use strict';
function solve(){
     debugger
    console.log("Test");
}

solve();

Ключовата дума debugger играе роля на брейк пойнт в браузара и кода спира точно там.

Относно jQuery - това е библиотека която ни дава по голяма свобода върху маниполирането на DOM елементит.Също така правим нещата с по съкратен синтаксис отколкото с обикновен JavaScript.
Ajax - тук трябва да изпиша 100 реда ако изпадна в подробности, но накратко.С него правим HTTP requests към сървара , като  дърпаме, изпращаме, истриваме и ъпдейтваме информацията. Ето един кратък пример с Kinvey.
 

function solve(){
// this is the body of ajax with jQuery, body have URL ( in this case is your Kinvey BaaS ),
// method : Can be GET,POST,PUT,DELETE
// headers: object where we tell information to server who we are
// data : {} object where we send our data to server on POST,DELETE,PUT requests,
// success : in success function we store data from the server request if ajax request is successful
// error : in error function we handle the error message from server if ajax request fail
$.ajax({
  url: "https://baas.kinvey.com/appdata/kid_WyAfK-tRRg/Books",
  type: "GET",
  dataType: "json",
  headers: {
     "Authorization": "Basic " + btoa(username + ":" + password)
  },
  success : function(data){
     console.log(data)
  }
  error: function(error){
      console.log(error);
  }
        
});

solve();

С този Аjax правим рекуест към Kinvey и му казваме дай ми всичката информация от таблицата Books, ако заявката мине успешно, влизаме в функцията success и принтираме на конзолата обекта който ни е върнал сървара ( всички книги ), ако не влизмае в еrror и печатаме грешката която е възникнала при заявката.
Попринцип не ползваме success точно по този начин, защото така ограничаваме информацията в тялото на ajax-a.Използват се промиси , незнам дали са ви говори за тях в лекцийте.Тъй като ajax е като асинхроното програмиране ние незнаем кога резултата от заявката ще пристигне при нас, може да е след 1 ,2 ,3 200 секунди, затова използваме промиси с което си гарантираме че информацията ни ще пристигне и чак тогава ще я обработваме.Пример:
 

function solve(){
$.ajax({
  url: "https://baas.kinvey.com/appdata/kid_WyAfK-tRRg/Books",
  type: "GET",
  dataType: "json",
  headers: {
     "Authorization": "Basic " + btoa(username + ":" + password)
  },
  error: function(error){
      console.log(error);
  }
        
}).then(function success(data){
   console.log(data)
});

solve();

Това е примера с промис с който си гарантираме че информацията ще пристигне при нас и ще се запише в data.След тялото на ajax, му казваме .then(function success(data){

и тук обработваме информацията

});

Изпаднах в подробности но надявам се да ви е било полезно.
Поздрави!

4
daredevil avatar daredevil 7 Точки

Мерси , чета всичко и се опитвам да разбера какво се случва, но на мен ми се струва , че започнахме да пишем думи без да знаем кое е "а,б,в" в този момент или нещо на мен ми липства и се чудя от къде и как да го наваксам . Свикнал съм с .NET там нещата са подредени и ясни, а тук не гърми и не работи ... 

 

Някакво ръководство книга като тази за C# нещо поне бегло подобие някъде има ли не можах да намеря из интернет всичко е хаотично което намерих ? 

0
Jinjaar avatar Jinjaar 348 Точки

Разбирам те напълно. Като цяло от вас се иска просто да минете през материята без да задълбавате.Нормално е да не разбирате повече от нещата, защото не е лесна материя.
Препоръчвам ви да минете набързо през Code Academy където се започва от това какво е стринг, масив, цикъл и т.н... чрез прости задачки които са много добре обяснени, така ще свикнете със синтаксиса. https://www.codecademy.com/learn/javascript

Аз лично научих синтаксиса от тук и доста ми помогна за основите в JS.
 

1
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.