JavaScript Tutorial For Beginners! Learn JavaScript in 25 Mins! | Extreme Basics




If you’ve seen the JavaScript tutorial video by Derek Banas, then you’re probably already familiar with a lot of the concepts we go over today, but if you’re a complete beginner that doesn’t know anything about JavaScript programming, then this video if for you!

We talk about some general programming concepts like variables and functions, as well as some JavaScript specific functions, and different ways to include JavaScript in your page from JavaScript onclick, to HTML script tags, and linking to an external JS file.

Links
—————
Web Development Playlist: https://www.youtube.com/playlist?list=PLOMCtHMHH3fA8t3ofduDSP73wKYVfvXDn

Original source


5 responses to “JavaScript Tutorial For Beginners! Learn JavaScript in 25 Mins! | Extreme Basics”

  1. Some possible mistakes, clarification, recommendations, and pedantry:

    1:52 Inline event handlers are not recommended. See https://stackoverflow.com/q/11737873/4642212 and https://stackoverflow.com/a/43459991/4642212

    7:51 The width and height attributes of images are supposed to be just numbers, without a unit.

    8:48 Accessing “.src” or “.href” refers to the element’s property, not the attribute. “.setAttribute” would do that. You may encounter some problems if you don’t regard this difference.

    15:23 camelCase is the naming scheme that is consistent with JavaScript.

    18:35 “Let’s put the name of a variable […]” — …for that parameter, yes; though, indeed, it will act as a variable within that function.

    19:14 Such a “returnThis” variable is not needed in this case. You can simply “return document.getElementById(idName);”.

    21:20 “==” is almost never recommended. Use “===” instead. Similarly, “!==”, instead of “!=”. See more at https://stackoverflow.com/q/359494/4642212

    24:11 Pipes are what these are commonly referred to: “||”. Officially, they’re called “vertical line”s in Unicode.

    General things: IDs aren’t required for JS to select elements. See https://developer.mozilla.org/en-US/docs/Web/API/Document#Methods and other means of the DOM API to target elements.

    There are a few possible pitfalls with variables, that weren’t mentioned, like why assigning “document.getElementById” itself to a variable wouldn’t work as is¹, or why assigning “.style.display” to a variable, then modifying that variable wouldn’t work.²

    1: That’s due to loss of context, specifically the this binding. See why this is, and how to explicitly set it here: https://stackoverflow.com/q/6318704/4642212

    2: That’s because only the value gets assigned. With, say, “.style”, you actually have a reference to a “CSS2Properties” object. Assining to object properties is a different thing than reassining variables.

Leave a Reply