[HTML, CSS, JS] Frontend #41: De Node is hoger

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue
pi_143542663
quote:
2s.gif Op maandag 18 augustus 2014 04:37 schreef d4v1d het volgende:
Ik heb het volgende:
[ code verwijderd ]

Dit lijkt redelijk te werken. de console.log geeft hetgene wat ik verwacht.

Maar zodra ik de functie aanroep krijg ik een undifined te zien :?

Ennnn in de developer console van Chrome zie ik eerst de undefined en dan zie ik pas XHR finished loading: GET bla bla bla. Alsof die eerst de undefined stuurt en dan pas de json api aanroept. :?

Waar komt die undefined vandaan en waarom werkt mijn return niet maar console.log wel? :?
Die undefined is waarschijnlijk het resultaat van de functie getYoutubeInfo omdat er geen return in staat.
Hoe roep je die functie aan, want de aanroeper kan nu niet het promiseobject gebruiken.
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
pi_143553662
quote:
1s.gif Op maandag 18 augustus 2014 07:21 schreef Aether het volgende:

[..]

Die undefined is waarschijnlijk het resultaat van de functie getYoutubeInfo omdat er geen return in staat.
Hoe roep je die functie aan, want de aanroeper kan nu niet het promiseobject gebruiken.
De code waarmee ik hem aanroep:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17		function buildList() {

    var tempElm;
    
    $.each(videoList, function(i, id) {
        tempElm = null;
        tempElm = $(".videoList .videoItem.hidden").clone().removeClass("hidden");

        console.log(getYoutubeInfo(id));
        tempElm.find("h4.vid-title").text(getYoutubeInfo(id).title);
        tempElm.find("span.vid-uploader").text(getYoutubeInfo(id).uploader);

        tempElm.find("p.vid-id").text("video id: " + id);

        tempElm.appendTo("ul.videoList");
    });
};
videoList is een array met video ID's.

[ Bericht 0% gewijzigd door #ANONIEM op 18-08-2014 14:36:16 ]
pi_143554203
quote:
2s.gif Op maandag 18 augustus 2014 14:36 schreef d4v1d het volgende:

[..]

De code waarmee ik hem aanroep:
[ code verwijderd ]

videoList is een array met video ID's.
De functie getYoutubeInfo zal niet direct de gegevens van Youtube terugkrijgen dus die zijn niet direct te gebruiken in buildList. Je kunt het Promise-object als functiewaarde teruggeven zodat het doorvoeren pas plaatsvindt wanneer de gegevens beschikbaar zijn.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41		function getYoutubeInfo(id)
{
    var url = "http://gdata.youtube.com/feeds/api/videos/" + id + "?v=2&alt=json";

    // Verander "done" door "then" zodat er nog meer
    // acties aan het Promise-object gekoppeld kunnen worden.
    // Geef het Promise-object terug zodat het binnen buildList
    // gebruikt kan worden.

    return $.getJSON( url ).then( function(data) {
        var returnObj = {
            title: data.entry.title.$t,
            uploader: data.entry.author[0].name.$t
        }

        console.log(returnObj);
        return returnObj;
    });
};

function buildList() {

    var tempElm;
    
    $.each(videoList, function(i, id) {
        tempElm = null;
        tempElm = $(".videoList .videoItem.hidden").clone().removeClass("hidden");

        getYoutubeInfo( id ).then(function(info) {
            // info bevat de gegevens van returnObj uit getYoutubeInfo

            console.log( info.id );
            tempElm.find("h4.vid-title").text( info.title );
            tempElm.find("span.vid-uploader").text( info.uploader );
            tempElm.find("p.vid-id").text("video id: " + info.id);
        });

        // tempElm wordt toegevoegd voordat de Youtube-info is verwerkt!
        tempElm.appendTo("ul.videoList");
    });
};
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
pi_143554397
quote:
7s.gif Op maandag 18 augustus 2014 14:49 schreef Aether het volgende:

[..]

De functie getYoutubeInfo zal niet direct de gegevens van Youtube terugkrijgen dus die zijn niet direct te gebruiken in buildList. Je kunt het Promise-object als functiewaarde teruggeven zodat het doorvoeren pas plaatsvindt wanneer de gegevens beschikbaar zijn.
[ code verwijderd ]

het werkt _O_ Thx O+

[ Bericht 10% gewijzigd door #ANONIEM op 18-08-2014 14:59:45 ]
pi_143554742
quote:
2s.gif Op maandag 18 augustus 2014 14:54 schreef d4v1d het volgende:

[..]

Je returned nu twee keer in getYoutubeInfo() ? :?
Nee, de functie getYoutubeInfo geeft een Promise-object terug. Dit is de waarde die $.getJSON teruggeeft :)

Je kunt het ook zo schrijven:
1
2
3
4
5
6
7
8
9
10
11
12		var result = $.getJSON( url );

result.then(function(data) {
    var returnObj = {
        title: data.entry.title.$t,
        uploader: data.entry.author[0].name.$t
    }
    console.log(returnObj);
    return returnObj;
});

return result;
getYoutubeInfo geeft de waarde terug die door $.getJSON wordt teruggegeven (dit is een Promise-object).

Nadat de gegevens door getJSON zijn opgehaald moeten ze nog bewerkt worden. Daarom wordt er een actie toegevoegd d.m.v. then (in getYoutubeInfo). De gegevens uit deze functie (dus return returnObj) worden ontvangen door de ‘then-functie’ in buildList.
When the student is ready, the teacher will appear.
When the student is truly ready, the teacher will disappear.
  maandag 18 augustus 2014 @ 15:08:52 #231
56176 Catch22-
Ben je Blind?!
pi_143554922
Wel even een errorHandler toevoegen natuurlijk :)
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_143555996
quote:
11s.gif Op maandag 18 augustus 2014 15:08 schreef Catch22- het volgende:
Wel even een errorHandler toevoegen natuurlijk :)
Komt wel :P

Maar ik denk dat ik het in php ga herschrijven omdat het uiteindelijk meer gedoe wordt met javascript enzo :')

(in de .each doet die dus http requests, en die each gaat weer vrolijk door voor de http request klaar is..

Geen zin om daar allemaal omheen te gaan bouwen :')
  maandag 18 augustus 2014 @ 15:42:38 #233
56176 Catch22-
Ben je Blind?!
pi_143556064
quote:
2s.gif Op maandag 18 augustus 2014 15:40 schreef d4v1d het volgende:

[..]

Komt wel :P

Maar ik denk dat ik het in php ga herschrijven omdat het uiteindelijk meer gedoe wordt met javascript enzo :')

(in de .each doet die dus http requests, en die each gaat weer vrolijk door voor de http request klaar is..

Geen zin om daar allemaal omheen te gaan bouwen :')
dat zou ik even de boel zo bouwen dat je een array van id's kan doorsturen en je daar de info van krijgt, ipv voor alles een losse request te maken
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_143556113
quote:
11s.gif Op maandag 18 augustus 2014 15:42 schreef Catch22- het volgende:

[..]

dat zou ik even de boel zo bouwen dat je een array van id's kan doorsturen en je daar de info van krijgt, ipv voor alles een losse request te maken
Dat je met javascript een array van video id's maakt en deze doorstuurt naar een php dingetje die de info ophaalt?

Zoiets was ik van plan ja :P
pi_143606404
Was er al bang voor dat het deze kant op ging, ik zou meneer kebab vriendelijk door willen verwijzen naar de dagbesteding, kun je daar lekker HTML gaan leren :)
Vooral dat wat hier boven staat.
pi_143688341
pi_143688433
quote:
9s.gif Op vrijdag 22 augustus 2014 00:00 schreef d4v1d het volgende:
[ afbeelding ]
_O- :'(
pi_143693785
quote:
9s.gif Op vrijdag 22 augustus 2014 00:00 schreef d4v1d het volgende:
[ afbeelding ]
JavaScript 1.2 _O_
  vrijdag 22 augustus 2014 @ 09:05:40 #239
56176 Catch22-
Ben je Blind?!
pi_143694176
Yo dawg, i herd u like JavaScript
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_143704874
FOK!silver, maar dan anders.
zcflevo.nl
  vrijdag 22 augustus 2014 @ 19:35:08 #241
230788 n8n
Pragmatisch
pi_143714250
Node.js is dat toch?
“Specialization is for insects”.—Robert Heinlein
pi_143714408
quote:
14s.gif Op vrijdag 22 augustus 2014 15:12 schreef KomtTijd... het volgende:
FOK!silver, maar dan anders.
Dat is waar ook.
  vrijdag 22 augustus 2014 @ 20:44:16 #243
56176 Catch22-
Ben je Blind?!
pi_143717537
quote:
0s.gif Op vrijdag 22 augustus 2014 19:35 schreef n8n het volgende:
Node.js is dat toch?
neejoj n00b dit is TeaScript
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  vrijdag 22 augustus 2014 @ 22:59:44 #244
230788 n8n
Pragmatisch
pi_143724405
quote:
1s.gif Op vrijdag 22 augustus 2014 20:44 schreef Catch22- het volgende:

[..]

neejoj n00b dit is TeaScript
teascript?
A brief tour of Teascript
A brief tour of Teascript
“Specialization is for insects”.—Robert Heinlein
  zaterdag 23 augustus 2014 @ 09:30:01 #245
56176 Catch22-
Ben je Blind?!
pi_143734422
quote:
1s.gif Op vrijdag 22 augustus 2014 22:59 schreef n8n het volgende:

[..]

teascript?
A brief tour of Teascript
A brief tour of Teascript
:o
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
  zaterdag 23 augustus 2014 @ 23:01:35 #246
230788 n8n
Pragmatisch
pi_143756461
JS: The Good Parts uit. Begin was vrij 'dense' maar verder las het prima weg. Was alleen nog niet echt duidelijk wat er mis was met ++, lijkt me niks mis mee voor een for loop?
“Specialization is for insects”.—Robert Heinlein
pi_143758901
quote:
9s.gif Op vrijdag 22 augustus 2014 00:00 schreef d4v1d het volgende:
[ afbeelding ]
Dafuq ?! wat is hier het nut van?:')

Heel benieuwd hoe je op dit idee bent gekomen...
Vooral dat wat hier boven staat.
  zondag 24 augustus 2014 @ 00:16:53 #248
56176 Catch22-
Ben je Blind?!
pi_143758983
quote:
7s.gif Op zondag 24 augustus 2014 00:15 schreef amvrosios het volgende:

[..]

Dafuq ?! wat is hier het nut van?:')

Heel benieuwd hoe je op dit idee bent gekomen...
dit werd vroeger volgens nog best vaak gebruikt, door crappy cms'en en developers
Heel veel groetjes, Catch22
En zoals mijn opa zei: "Al is het meisje nog zo mooi, haar poep stinkt ook". Rust Zacht opa..
Met GHB nooit meer nee
Storneren een optie?
pi_143759007
quote:
1s.gif Op zondag 24 augustus 2014 00:16 schreef Catch22- het volgende:

[..]

dit werd vroeger volgens nog best vaak gebruikt.
toen was het ook al fout :-P
Vooral dat wat hier boven staat.
pi_143759412
quote:
7s.gif Op zondag 24 augustus 2014 00:15 schreef amvrosios het volgende:

[..]

Dafuq ?! wat is hier het nut van?:')

Heel benieuwd hoe je op dit idee bent gekomen...
komt van reddit.

http://www.reddit.com/r/shittyprogramming/
http://www.reddit.com/r/ProgrammerHumor/

:P
actieve topics nieuwe topics
abonnement Unibet Coolblue
[HTML, CSS, JS] Frontend #41: De Node is hoger
Index

» digital corner

» development

Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')