Dissecting the First JavaScript Application You Wrote - 03

Sign in to queue

Description

In the previous video, Bob created an interesting JavaScript example, and in this video he walks through the example line by line, explaining the purpose of the various key words and operators and providing a general overview of topics for the next eight lessons.

 

Download the entire series source code.

 

This video was updated on August 16, 2012.

 

Tag:

JavaScript

Embed

Download

Download this episode

The Discussion

  • User profile image
    PeterNL

    Comforting talk! Thanks.

  • User profile image
    YamilG

    Hello Dan, I also notice the title thing although I don't think it was necessarily bad, you know that kind of things makes you think critically about what you're doing, for me it was like: "OK... I don't think this is right, I'm gonna try it the other way to see if it works" and it did, so that's part of the challenge, to think for yourself.

    Thanks for the videos.
      

  • User profile image
    stupid

    Dude we're not in 1998 anymore, stop posting * like this.

  • User profile image
    Jedrek

    Great educational presentation.

  • User profile image
    BobTabor

    @stupid: Valid point, profanity aside.  The intent is to create a foundation for creating Win 8 apps, which is a different take on JavaScript than traditional browsers (though I obviously am starting there ... it makes it easier since everyone has Notepad and a web browser.)  And, I would like to add, from teaching .NET for 11 years now, every day new developers are coming online and looking for resources about everything -- and programming practices in the JavaScript world change often.  This is a snapshot of current programming heuristics in 2012 which are vastly different from 1998, I think you will agree.  Best wishes!

    @Jedrek: Thanks!

    @YamilG: I think your comment is referencing the previous version of the video which had a bug in it (mistyped ... fixed with new video).  I post this in case someone is confused by YamilG's comment.  Thank you for the kind words!

  • User profile image
    Dharmendra​Sehgal

    Really it's good presentation.

  • User profile image
    Rob

    Dude! You rock!
    Great job!
    Can't wait to watch the next one!

  • User profile image
    mtkupp

    Bob, great fundamentals video. I come from a VB background and the 2 things that always break my javascript code are forgetting the line terminator and case sensitivity, Function() doesn't work. I'm still not sure why anyone would want to create a case sensitive programming language Smiley

  • User profile image
    Nik

    I have VS 2012 Prof. - Does Visual web developer express 2010 comes inbuild in it

  • User profile image
    BobTabor

    @Nik: You are more than good to go.  Big Smile

  • User profile image
    Jorge

    I'd like to say that I spent the whole day, today, looking for tutorials on the internet that I could use to learn javascript. I was about to give up when I found your videos and I'm thinking - these are really very nice people who really know what they're doing! The quality of your material is just astonishing!

    Congratulations,
    Jorge

    PS Now I believe I can learn.

  • User profile image
    BobTabor

    @Jorge: Awesome ... funny how what you're looking for is always in the last place you look ...  Cool

  • User profile image
    mahdi mollaeian

    Bob,grate thanks.

  • User profile image
    Robin

    Do you know if there are any reference materials that would correlate JavaScript instructions/functions to Assembler instructions? I spent some time really studying the 02 Lesson code and was able to translate what it was doing into Assembler, which I understand a whole lot more. It would be nice if there were a table out there somewhere that could do the translation a lot faster, act as a cheat sheet. Do you know of any?
    Thanks!

  • User profile image
    BobTabor

    @Robin: Yowza!  There might be a resource like that out there (I mean, there's like a bajillion pages on the internet) but if there is I don't know where it would be.  Sorry.  If you know Assembler, I think the hard part for you is already over -- I mean, that's no small task!  I would recommend you watch the very last video in this series for book recommendations.  You might get more out of Douglas Crockford's JavaScript book than anything else.  It is considered the definitive resource.  Hope that helps!

  • User profile image
    Tarun

    We like Bob :)

  • User profile image
    SamSmith

    Bob sir please can I que u 1 thing that on windows based forums programs u have to concentrate on the classes of that only because these programmers these days have the mind to do more things at one time so u can record your classes of programmes based on windows forums.

    You will have a nice profit of membership on your site, i.e.,LearnVisualStudio.net.

    That is the suggestion from myself and hope that you will try to seek what i'm saying..

    So Thanxxxxxxx

    Your videos are really awesome and they are in a very good concept and a perfect required pace.

    So keep it upp. Have nice  days.........

  • User profile image
    SamSmith

    [quote]

    , SamSmith wrote

    Bob sir please can I que u 1 thing that on windows based forums programs u have to concentrate on the classes of that only because these programmers these days have the mind to do more things at one time so u can record your classes of programmes based on windows forums.

    You will have a nice profit of membership on your site, i.e.,LearnVisualStudio.net.

    That is the suggestion from myself and hope that you will try to seek what i'm saying..

    So Thanxxxxxxx

    Your videos are really awesome and they are in a very good concept and a perfect required pace.

    So keep it upp. Have nice  days........

  • User profile image
    hemantb

    Hi Bob !

    I had some questions .

    As You mentioned in this video  that its a non-standard stuff when we use innerHtml, what should we use instead ?

    Thanks in advance.

  • User profile image
    BobTabor

    @hemantb: As you get further along into this series, you'll discover a way to do "DOM selection" using jQuery.  I'm willing to bet that you'll prefer jQuery DOM selection over these techniques I teach early on.  So, I would advise to just keep watching and you'll get a more complete picture as you push through. Smiley

  • User profile image
    Ivan Yosifov

    Bob in the code you write
    var myTitle = document.getElementById('title');
    title.innerHTML = myValue; // it should be myTitle yet it still works - is that a bug or a JS feature?

  • User profile image
    BobTabor

    @Ivan Yosifov: I'm looking at the downloadable source code ... this is what I show:

        function substitute() {
          var myValue = document.getElementById('myTextBox').value;
    
          if (myValue.length == 0) {
            alert('Please enter a real value in the text box!');
            return;
          }
          var myTitle = document.getElementById('title');
          myTitle.innerHTML = myValue;
        }
    

    But yes ... I ran into what you described quite accidentally.  In some cases, you can reference an element by its id attribute. However, I think that is a bug.  What I demo (above) is the appropriate way to do it.

     

  • User profile image
    Nikul Patel

    Hello Bob,

    Thanks you for this series. I just completed Html5 series of yours. And I started this one. I am finding difficulties to understand the code you wrote in the second video in this series. Am I worrying too soon? or will it work all good after I watch other videos in the series?

  • User profile image
    BobTabor

    @Nikul Patel: Have you watched video 3 yet?  What specifically doesn't make sense?

  • User profile image
    Nikul Patel

    I watched 3rd video and it helped me understand most of the code.
    However, I didn't understand this line
    myTitle.innerHTML = myValue;

    Thanks Bob!

  • User profile image
    Phil Howell

    Hey Bob, I just wanted to say thanks for these videos - they're great!!! On the strength of your C# for Absolute Beginners series on LearVisualStudio.NET I've been writing middleware applications to take data from some enterprise monitoring tools and into the Amazon AWS cloud - Brilliant. I'm just about to embark on working on some web pages and needed a Java Script shake down - and here you are again, delivering the goods - FANTASTIC!!! I was wondering if you might be thinking of posting a link from your members area on LVS.NET so that all of your customers who directly log in there become aware of this great series too? Keep up the good work, you've made an incredibly positive contribution to my career - thank you...

  • User profile image
    BobTabor

    @Phil Howell: Hi Phil, thanks for the nice note and I'm glad I could serve you in this way.  re: LVS ... I already have these videos posted out there, but perhaps I could make the link more obvious.  Thanks for the feedback!!!  Warm regards, Bob

  • User profile image
    Alex

    Hello Bob. First let me thank you for some great series. I found both your HTML5 and CSS3 videos extremly helpful.
    But i got a little stuck here, at 6.52 you use the .value to get the property of myTextBox.
    What is the difference between using that and .innerHTML? Sorry if this is a stupid question, but i get the same results and would like some clarification.

  • User profile image
    Clint

    @Alex: not a stupid question at all.  There is a reason why we labeled this series absolute beginner, we assume you guys know literally nothing about programing Smiley  JavaScript is extremely powerful but can get confusing on stuff like this.

    Basically, innerHTML gets you the inside HTML.  so if you have a Div or a Span tag, it would get/set the actual HTML from that inside.

    The input DOM element is special however, it has an Value attribute.  That is what we're actually accessing. 

    http://www.w3schools.com/jsref/prop_pushbutton_value.asp

    http://www.w3schools.com/jsref/prop_html_innerhtml.asp

Add Your 2 Cents