Video: Douglas Crockford, “Advanced JavaScript”

By YUI TeamNovember 27th, 2006

Last month, I posted some video taken from one of Douglas Crockford’s presentations on frontend engineering (Video: Douglas Crockford, “An Inconvenient API: The Theory of the Dom”). Those who enjoyed Douglas’s deep-dive into the DOM may be interested also in his “Advanced JavaScript” presentation, now publicly available on Yahoo! Video. In this presentation — the third of a three-part series he has been teaching at Yahoo! — Douglas looks closely at code patterns from which JavaScript programmers can choose in authoring their applications. He compares familiar constructs like the Pseudoclassical Pattern with more unique patterns like the Parasitic Pattern that (he argues) run more “with the grain” of JavaScript. When Brendan Eich spoke at Yahoo this summer he described Douglas as “Yoda of lambda programming and JavaScript”; after watching “Advanced JavaScript,” you may have a clear sense of where that sentiment comes from.

It bears repeating that Douglas’s ideas and perspectives are his own and that the many flaws in videographic craftsmanship are mine.

34 Comments

  1. I reallly love Crockfords knowledge about Javascript. But I don’t think introducing private/protected-stuff in javascript is a good thing. These patterns will turn javascript code into javaesk proportions; it also takes a performance penalty. I think documentation and unit-tests would suffice…

    (and about the video format: it’s hell to get a rebuffering every 10 seconds or so, and I have a pretty fast connection. All you can do is bear it, or wait a day and hope for it to get better. A downloadable format would be appreciated)

  2. the video doesn’t seem to be loading for me. i would love it if you could get a downloadable link as well!

    thanks.

  3. Any chance of getting the slides?

    Thanks for the great videos!

  4. Zellyn: Slides for the Crockford “Advanced JavaScript” session are here: http://yuiblog.com/assets/crockford/advancedjavascript.zip — I’ll add that to the blog post…thanks for the reminder. Regards, Eric

  5. With prototypes, public methods are generally defined in the prototype object, which saves memory because each instance doesn’t have a copy of these methods. For example:

    function Hoozit(id) {
    this.id = id;
    }
    Hoozit.prototype.test = function(testid) {
    return testid === this.id;
    }

    However, in the Parasitic Inheritance example, it looks as though public methods are created for each instance. For example:

    function Gizmo(id){
    return {
    toString: function() { return “gizmo ” + id; }
    };
    }
    function Hoozit(id) {
    var that = Gizmo(id);
    that.test = function(testid) { return testid === this.id; };
    return that;
    }
    var hoozit1 = Hoozit(1);
    var hoozit2 = Hoozit(2);

    In that example, both hoozit1 and hoozit2 have a test method. Wont this sort of memory consumption affect performance? Or did I just misunderstand the example?

    Thanks.

  6. Robert Johnston said:
    December 1, 2006 at 2:11 am

    These are wonderful and useful presentations rendered unwatchable by the toytown Flash video format. It’s beyond me, for one, to follow Crockford properly when the video is rebuffering every few seconds (and I have a fast connection).

    Fine for 30 second clips of pets doing funny things; totally inappropriate for this. Stop eating your own dogfood and post the videos in a downloadable format.

    Thanks!

    Robert

  7. Peter:

    Privileged do have a higher memory cost, but it does not effect performance unless the number of instances is extremely large.

  8. [...] Via YUI Blog. Tags:  AJAX, Companies, Development, Javascript, Technologies, Web 2.0, Yahoo! [...]

  9. [...] Some very nice video tutuorials over at the YUI Theater. I’m particularly enjoying Professor Crockford’s talk on Advanced JavaScript. Always nice to see yet another way to create a singleton for namespacing in JS: [...]

  10. Der Godfather erklärt Javascript-Theorie…

    Wie der webstandard blog und ajaxian berichten, hat Douglas Crockford mehrere Javascript-Videotutorials veröffentlicht.Hinter den Titeln "Theory of the DOM" und "Advanced Javascript" stecken je 3 Videos mit sehr tiefgehender aber gu…

  11. These videos are interesting but the video keeps buffering every ten seconds after about 12:00. A downloadable version of the video would be much appreciated.

  12. @jws–I spoke with the YVideo people about this, and they tell me that the videos now load progressively — so if you pause the video it should continue downloading. Have you tried doing so? That should allow you to download the video in advance and then watch it without the interruption of buffering. Regards, Eric

  13. [...] شاهد هذه الثلاثة مع العديد من ملفات الفيديو حول جافاسكربت على فيديو ياهو هنا: http://yuiblog.com/blog/2006/11/27/video-crockford-advjs/ [...]

  14. [...] Douglas crockford uses “var foo = function() {}();” in Dhis video on advanced JavaScript [...]

  15. [...] Douglas Crockford’s Advanced JavaScript – 3 videos: 31, 25, and 11 mins. He compares familiar constructs like the Pseudoclassical Pattern with more unique patterns like the Parasitic Pattern that (he argues) run more “with the grain” of JavaScript. (tags: JavaScript Videos) [...]

  16. The flash player is perhaps great for 95% of the people out there but is there any way to get this in another format? Perhaps in MPEG so I can take it with me on the road? The save video link doesn’t work at all (I get this weird error message).

  17. Theoretically, two objects would have access to each others’ private properties and methods, if they are instances of the same class. To me at least, it seems impossible to hack this into JS 1.x. And I second that creating methods for each instance is nonsensical. You’re completely losing a main benefit of object orientation. That’s why I’d stick with prototyping for the time being. You don’t depend on being able to keep stuff private, do you?

    The only real problem is inheritance, not because it looks ugly but because calling a constructor in order to extend a (pseudo)class is by far not appropriate; I’d even call it stupid (but I doubt that Netscape wanted us to code this way, I guess they intentionally left inheritance out.)

    Note that I’ve only seen the first video so far, and it was already a torture. I don’t know if it’s the video player or the server being slow — anyway, it’s pathetic.

    if you pause the video it should continue downloading.

    That’s what I usually do with YouTube or Google Video. Here it didn’t work for me.

  18. @xutopia: No question, the Flash player is a bad solution for portability. The Save button (which should not give an error…I apologize about that) is for saving to a favorites list, not for saving to the local disk, so that won’t be of help. I hear what you’re saying — more formats would be better.

    @dao: Can you confirm that you were on the Yahoo! Video page for the video and not viewing it on the embedded Flash player? The embedded version on the blog does not download the whole file, but the version on Yahoo! Video should download even when paused (this works well for me — not for you?).

    Regards,
    Eric

  19. Eric, that seems to work — thanks. Going to watch the other parts now.

  20. [...] Video: Douglas Crockford, “Advanced JavaScript” » Yahoo! User Interface Blog [...]

  21. great video’s. one thing i was realy interested about was concatenation, this has always been an issue with other languages aswel like php asp. there are alot of things you can do when optimizing code, but usualy is not realy needed because the app is not big enough.

  22. What are the pros and cons of extending the global Object with a later() method (or any method for that matter)?

    Also, I loved the idea of using an object function for creating new objects, newObj = object(oldObj);.

    If global methods are added to an application, is it preferable to extend the global Object, or is it be better practice to extend my custom object() and add attach ‘global’ methods there?

    I genuinely enjoyed the series, and I look forward to more.

    Thanks,
    Ben

  23. The implications of augmenting Object.prototype are discussed at http://yuiblog.com/blog/2006/09/26/for-in-intrigue/

    Where is the best place to insert a method in the prototype chain? That depends on the universality of your method. If it is very application specific, it should go near the top. If it is very general (like the .later method) you would want it at the bottom.

  24. I’d like to point out that this isn’t advanced javascript at all, it’s actually pretty basic stuff.

    On top of that, he explains everything awfully, descides to skip vital information (scope chain, closures for scope trapping, to name two), and writes some of the most poorly laid out code I’ve seen. Not to mention ‘that’ pointing to ‘this’, silly names like ‘hoozit’, and the fact that he MAKES UP terms like parasitic and swiss inheritance (honestly, do you think we’re morons crockford?)

    Cmon guys, try to find other ways to learn javascript than listening to this guy.

  25. [...] @Eric: Indeed they are now. thanks. You might want to update http://yuiblog.com/blog/2006/11/27/video-crockford-advjs with these new downloads. [...]

  26. Thanks for an interesting series; I, for one, learnt a lot.

    Luke: if you direct your complaints to the Yahoo directors, I am sure they are willing to refund everything you’ve paid to access the resource.

  27. After watching those videos, I hope people realize that there is more running on a computer than just a web browser. Looks like a split in application intentions might need to be done one day. Similar to, but not identical to: C and C++, Java Standard and Enterprise, even HTML Doctype’s. I don’t think NPO’s or even mid-level non-state educational facilities could afford to spare such memory. If JavaScript is going this way, it’s a all or nothing language. I hope it prevails in the all category, with regards to cost to performance in mind.

  28. Hi Eric, can you provide the downloads links. Thank you.

  29. @Adrian: You can find all the direct, downloadable links to the .m4v (MP4) files at the YUI Theater: http://developer.yahoo.com/yui/theater . -Regards,
    Eric

  30. [...] Advanced javascript is really very interesting and not to be missed if you want to know how to exploit the language’s power. The second video has a part about debugging, and explains how to get the Microsoft Office javascript debugger which seems to be the best solution to debug in IE, although you’ll see it’s not easy to find. The third video talks about performance, minification, JSON. [...]

  31. [...] and in the YUI Theater two presentations created by Yahoo! JavaScript Architect Douglas Crockford (“Advanced JavaScript” and“An Inconvenient API: The Theory of the Dom”). Today I’m happy to announce [...]