JavaScript Fundamentals For Beginners
Vložit
- čas přidán 7. 09. 2024
- UPDATED COURSE HERE - • JavaScript Crash Cours...
This is a mini-course on the fundamentals of not only JavaScript, but programming in general. We will cover the following...
What is JavaScript?
Variables & Data Types
Loops
Arrays
Objects
Functions
Conditionals - If Statements, switches
Events
Forms & Validation
MODERN JS FROM THE BEGINNING (21.5 HOUR COURSE)
www.udemy.com/...
Choosing a text editor - 6:15
Variables and Data Types - 9:07
Arrays - 17:25
Conditionals - 32:21
Objects - 39:28
Events - 51:14
Forms - 59:08
thx
Thakns bro, saved my tym :D
Loops - 25:15
Rönny kh i knew i missed one
Jacob Broughton thank you
Hi Brad, thanks for the mini-course, i started learning js, and I'm glad that I found your video. I have prepared the index for your video. Please find it below. Feel free to paste it in the video description if you want. and I have some feedback. from the topics you listed at the beginning of the video, i'm not sure if covered "Prototypes. If you already covered them here, I might have missed them. i'm curious, what are prototypes?
Intro 1:09
Variables & Data Types 9:01
Data Types 11:16
Number
String
Array
Object
Naming Conventions of Variables 13:50
Array 17:30
[...] 17:43
new Array(...) 19:44
.push() 21:15
array of numbers
array of numbers and string
.length
.sort()
.reverse()
.forEach() 29:57
Loops 25:11
For 25:55
While 29:02
forEach() 29:57
Conditionals, Comparisons, Operators 32:20
if 32:38
Comparisons 34:34
== === !=
Operators 35:27
&& ||
switch 36:36
case
break
fallthrough
default
Objects & Functions 39:24
Object Litereal 39:40
function 42:42
Object constructor 43:54
function 44:38
constructor pattern 46:05
Arrays of Objects 49:35
Events 51:00
onclick
onmouseover
onmouseout
onload
Forms 59:02
link events to form fields 59:39
form validation 1:03:07
Thanks , mully.
cheers man
Prototypes are to JS what classes are to intermediate languages like C# and Java.
thanks buddy
Thanks !
Bro, I am so amazed at how clear you teach JavaScript, I have been taking other tutorials for the last 7 month, and have not found a course as clear to understand as yours, I just cannot believe that this language is so easy. Thanks to your teachings, I have develop such a hunger for JavaScript that I am literally doing this every single day, just yesterday I practice my coding development for about 8 hours straight, thanks man, you have surely help me see JS from another perspective.
9:00 Variables & Data Types
17:30 Arrays
25:10 Loops
32:20 Conditionals
39:23 Objects
50:59 Events
59:03 Forms & Validation
world needs more people like u
Cheers!
Live Lombs I actually did this as notes because I know I'll be going back quite a few times lol
This saved me so much time. Thank You!
you should share the notes on Google Drive with everyone here!
*Time Stamps*
_Intro_
0:00-1:09 ---- Intro
1:09-2:28 ---- What is JavaScript?
2:28-3:06 ---- JavaScript is NOT Java!
3:06-3:55 ---- Programming Fundamentals
3:55-4:42 ---- What Do I Need to Run JavaScript?
4:42-5:23 ---- HTML vs. JavaScript
5:23-6:12 ---- What Can I Do With JavaScript?
6:12-9:00 ---- Choosing A Text Editor
_Java Script_
9:00-17:30 ---- Variables and Data Type
17:30-25:11 ---- Arrays
25:11-32:19 ---- Loops
32:19-39:22 ---- Conditionals
39:22-50:58 ---- Objects
50:58-59:02 ---- Events
59:02-1:08:21 ---- Forms
2016-2021 : 5 years of awesome tutorials !
Midterm on Arrays this week and I wanted to cry! Your vid has helped me so much today!! Thank you for sharing!!
Sarah SweetAndSimple hhyggftthjj🇧🇿🇧🇾🇧🇪🇧🇪🇧🇪🇧🇪🇦🇲🔵🔵🔺🚾🚾🚾🔠🔠🈁📱📱📱📲📲🖲🕹🕹🖲🌅🌅fc
why you cry ? no need to cry only fly
I've been learning so much from your videos. I've taken the HTML and CSS crash courses and now this one. Please keep up the awesome work!
You give me that hope of being a Programmer! Thanks Brad. I am very glad to be your student. #RoleModel #Brad #YesWeCode
This is the most easy to follow Tutorial on JavaScript on the web, easy to follow, brilliant...... I would recommend this to anyone just wanting a recap of JavaScript... Keep up the good work...Can not believe you do this for free....You my man are a Rockstar
intro 1:09
Variables & Data Types 9:01
Data Types 11:16
Number
String
Array
Object
Naming Conventions of Variables 13:50
Array 17:30
[...] 17:43
new Array(...) 19:44
.push() 21:15
array of numbers
array of numbers and string
.length
.sort()
.reverse()
.forEach() 29:57
Loops 25:11
For 25:55
While 29:02
forEach() 29:57
Conditionals, Comparisons, Operators 32:20
if 32:38
Comparisons 34:34
== === !=
Operators 35:27
&& ||
switch 36:36
case
break
fallthrough
default
Objects & Functions 39:24
Object Litereal 39:40
function 42:42
Object constructor 43:54
function 44:38
constructor pattern 46:05
Arrays of Objects 49:35
Events 51:00
onclick
onmouseover
onmouseout
onload
Forms 59:02
link events to form fields 59:39
form validation 1:03:07
Mr. Brad you are really awesome... seriously hats off to you... Your method of teaching is so smooth and brilliant. Specially your way of talking and explaining.. Great (Y)
Pleasure Mr. Brad
Thanks! I needed a refresher. I rely too much on jQuery and other frameworks. This was so helpful. :)
Gaby Campagna jquery is still awesome! It helps you kinda understand vanilla JavaScript in a simpler way
Over the last three years I was "forced" to shift gears from Manufacturing management to ERP implementation after a rubbish ERP implementation in my old manufacturing company that went horribly wrong and I was the most interested and most qualified among a bunch of functional managers. I LOVED the IT world and here I am now an ERP consultant that needs to know how things work together, not more for now. Your videos are perfect for me and I thank you for the few hours well spent watching your videos. i'd like to send you a private email so that you can point me more in the right direction. Thanks Brad.
Hey boss Brad , Take my cordial Love From Bangladesh , Your lectures are So understanding ! You are a Good Teacher ! What should be a appropriate Word to praise you ? i can't find ! carry on this for the better place of Heaven.
I feel the same way. Thank you!!!
This comment is the best praise Brad can ever get 😂 I will send some money to Brad on your behalf Mahadi!
it will be great job , will be created more BRAD in CZcams and we poorer people can be learnt much from internet. thanks brother too much !
me from Bangladesh too
Ei madari poorer people ki?
Was doing this on codacademy and getting a bit confused. Great explanation on the fundamentals. Feeling more confident again :)
I WAS TAKING A JAVA COURSE ON SOLOLEARN AND I GOT STUCK I COULDN'T UNDERSTAND ANYTHING, I WAS HAVING DIZZY JUST FOR SEEING JAVA'S CODE, I HAD TO COME ACROSS THIS GUY CHANNEL AND HOPED TO GET SOME HELP, EVENTUALLY I NOW UNDERSTAND WHAT IS JAVA NOW IM GOING BACK TO CONTINUE WITH MY COURSE THERE, THANK YOU SO MUCH BROTHER 😎
lol
me too
Another great tutorial. No doubt Brad has all you need to get a feel for java script basics. In fact his entire channel is amazing. If you are trying to learn web dev this is the channel for you.
Very nice, complete and thorough tutorial. You've done a good job. The content will definitely offset the time. A beginner could spend hours and days trying to accumulate the knowledge you've given in just and an hour or so. Great job.
Hi, I am Brazilian and i am a developer of process automation, so I use my knowlegdement on JavaScript to see the page code and extract the necessary information of him.
Videos like this, help us to fix our knowledgement same, if we have a lot experience is every good to review this content.
And this video is very useful to make the knowledment recycle.
this is a great tutorial...well spoken, clear, concise, thank you!
They way you describe everything and the pace of your voice in this video are both perfect! I didn't feel overloaded with JS jargon and I was able to keep up. Your teaching style is perfect.
Ah man! Usually I DON'T like ANY video. But your hard work and honesty, in the end, made me like it. Thank You
I appreciate that :)
Thank you for this video. Out of the 30+ videos I have checked out this is the best so far. I look forward to watching all of your material.
Time stamps for every subject would be awesome. ty
Random Person considering that your getting this for free, you can kindly shut the f up.
human151 he never said anything wrong so kindly stfu to u
human151 lol your just a bundle of sunshine aren't ya?
It's been a few years since I've done any programming so this was a great general refresher, as well as a solid intro to js. Thanks for the content.
I can't express my love and respect for you Brother ! You're perfect Teacher I can understand each bit and piece you teach. ! Lots of Love from Pakistan
I'm in the process of learning coding and going through youtube, I found your channel to be the best (for me) coz of the simplicity in presentation. Really looks like you put time and effort in your work. Thank you, much appreciated.
thanks brad, cuz all of the other ones were confusing
i am a visual learner :)
I have ended CSS and JS tutorials and happy that encountered your tutorials. I had almost no questions.
My only 1 thing that I would fix is not deleting what we wrote, but to continue and adding new features to our site.
Thanks for your work!
What keyboard were you using? so satisfying to hear the clicks lol
Agreed
Those are called mechanical keyboards. I love mine.
Yes, Mechanical keyboards makes clicking sound
@@keshav2136 do you know what model he’s using?
Hey Brad. I have been watching videos from Udemy to Lynda and other paid course websites but you stand out. You have a natural gift as a teacher.
thank you for your lessons. I like your videos, English and looking forward to next episodes :)
WHOAAAAA !!! I am "JavaScript fundamentals" ready with hands on coding in 2.5 Hours !!
Along with notes !! and more than 8 coding practice javascript html files !!
Subscribed !! Happy Leanring !!
One of the best teacher at Udemy . thank you Brad
Thank you so much for the lesson. I started studying JS with the book and it took me much more time to go through all of these things you explained in just one hour. Great job!
Hi Brad, what should I do next after learning the basics? Thanks.
Get good at using them.
hello brad, My name is michael and i just want to say thank you for all your awesome tutorial videos, They are very helpful
and all your teaching method 100% awesome. You have no idea how much i have accomplish with your videos.
Thank you vary much brad, God bless.
Arrays is what my boss doesn´t want to give me
Ricardo Belmont ....
ahhaa
Haha..Good One. I think most people did not get it.
LOOOOL
A RAISE!!! ... Aah fk took me a day to figure out xD
NICE one man!
Really nice
xD
Only watched half of the video so far but I've already learned so much. You have a very clear style of teaching, don't miss out important facts and explain things without too much jargon. Thank you!
Very helpful and informative. Helped me far more than codeacademy did! Thanks Bro!!!
HA HAHAHA
I am an absolute beginner to JavaScript. This video was very helpful. Feel like I am starting to get a feel for the language now. Thanks so much!
Hey Brad,
Really its too good thanks a lot for this basics tutorial.Can you please share advanced tutorials regarding javascript and angular js too..Really your lectures helping me alot.
Brad, you are the best teacher I've found on the internet -- current, engaging, and timely. Thanks much.
i did console.log and didnt put i < 10 and it kept adding 1 until it got to 200,000+ and then my browser crashed
haha ikr do this with c++ your pc will crash
How about an infinite loop? I tested my computer do so do an infinite loop for one second and then stopped it right at the end of the second to see how many loops it did. It was around 15,000 :0
Well, infinite loops are infinite.
😂😂😂
Awesome. Got me through to the next step. Well explained!
Top notch video. Really nice, great quality and higly usefull. Love it!
This was really helpful, I am a complete beginner and I must have spent 3 hours pausing and rewinding to get the gist of the concepts lol. I am looking forward to watching the rest of the vids in this playlist. Thanks!
Hi,
While performing sort method at 24:48 the output is 1,5,55,6,77, seven but it is not following the increasing order i.e 55 comes first later 6 ,which is not pretty clear. Could you please say what is the sorting technique by default it is following.
You can pass sorting function to method sort. If none is provided (like in this tutorial) the default behaviour is to convert all elements in array to strings and sort them using their Unicode codes. That's why '6' comes after '55'.
If you want to sort array of numbers you can do it like this:
var arrayOfNumbers = [1, 45, 23, 44, 12, 5, 100];
arrayOfNumbers.sort(function(a, b) {
return a - b;
});
console.log(arrayOfNumbers); // now it's: [ 1, 5, 12, 23, 44, 45, 100 ]
It is passing a function as an argument for another function, so it's a bit complicated as for first lesson and i get why he skipped it here.
Tomorrow is my interview and I am looking your JavaScript videos for revision. Thank you for making all these wonderful videos. Love from Pakistan.
Well good luck to you friend :)
Great course, but definitely not for slow typists, so I uploaded all the code and some notes to my Google Drive: drive.google.com/file/d/13BGXGW_LEamhRoo1914imDV-CpRteHbF/view?usp=sharing ... Brad, feel free to link this in your description, or host it yourself. Sublime Text 3 users should know that you can easily comment/uncomment the lines in my files by putting your cursor anywhere in the line and hitting CTRL /. There's a small chance you might need the Sublime Text DocBlockr package to get some of that to work (not sure). I guess CTRL / may also work in other text editors like vscode or atom.io too.
Nick Hope Thanks!
Thanks, could you please do it for the others courses? (JS ones) it will be helpful
I'm not sure I'll ever take those courses but if I do then I could (p.s. I'm not the video uploader, in case you didn't realise).
Yes, I know that you're volunteer to write down the codes,
Thanks in advance
honestly Brad, if i don't comment on your tutorials then I am just a big F.
you are just a absolute stand out programmer and teacher. you know class, have good taste and standards.
most importantly, your words are just it. when you say you words "absolute beginner"you really mean it.
unlike some others when the say absolute, they are just blushing on their own.
Thanks Brad! :)
Good video, enjoyed it!
Just starting out with everything programming/developer... I feel like you're tutorials teach me way more than these meet up (pre-bootcamp) classes.. Thanks!!! Even though I'll have to go over this 50,000 times to understand fully.. lol
Hey thanks for your videos. got a question. ...at approx. 24:47 you do a sort. I tried plugging in a string with larger numbers (second time watching after a month of deep JS exposure) and I noticed it didn't sort it by number but by alphabet. How do you account for that?
Checkout developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort?v=control for more: If compareFunction is not supplied, elements are sorted by converting them to strings and comparing strings in Unicode code point order. For example, "Banana" comes before "cherry". In a numeric sort, 9 comes before 80, but because numbers are converted to strings, "80" comes before "9" in Unicode order.
There really was a problem.. I saw 1,5,55,6,seven
czcams.com/video/U_RXeS4QdQ0/video.html
Thank you, I liked how fast you went through the basics without complicating the concepts.
console.log("I love your tutorials. Trillions Blessings")
Manish Vashisth alert("you forgot the semicolon so you will get a syntax error);
lol
Manish Vashisth and the script tags. Did you learn nothing?
Zahid Reddy hey, this could be from an external js file, so tags are optional
var var1= the best teacher ever;
var var2= rolemodel;
if (var1 == var2 && var2 = rolemodel){
consle.log('this is true ');
};
This is a very smooth overview of the JS I've come across needing to apply with different technologies. The 3rd part of your DOM manipulations series also gives extra dexterities (I appreciated the first 2 as well, while the 3rd gets into more eventful applications.) The MongoDB session reinforced helpful perspectives, too. Looking forward to your React mini.
good work..!! well done
Brad I won';t say that I found your presentation to be boring but I absolutely already knew everything which you mentioned about Javascript!
When you first start going over the for loop, how is it that "0" is printed to the console as the first number if the "i++" increment function runs before "console.log(i)"?
The while loop version makes sense, it's the for loop that seems strange considering the order of the parameters and elements
Also, when you do the for loop around 31:00, I would have thought that what would have printed to the console would have simply been a series of numbers starting with 0 and ending at 5. What makes me think this is that it seems like the value of "i" is set to 0 and that the "numbers.length" portion of the second/conditional parameter would just be a roundabout way of saying "6". So I guess I'm reading it like this: i is equal to 0; so long as i is less than 6, add 1 and then print to console the current value of i. I have a very vague sense of what it might mean given the actual output but my mind isn't being able to make any natural sense of the syntax+semantics.
Hey Jonathan, the i++ part of a for loop doesn't get executed until _after_ the body of the loop is executed.
Since i++ doesn't get executed until after the body, that also means that when i == 6, it hasn't been console logged yet.
You are an excellent teacher. You have explained all fundamentals in an excellent manner in such a short time..I have understood everything you discussed in this tutorial clearly..Thanks a ton..
Thanks Mark Wahlberg!
+Brad Traversy he was talkin about your boston accent. I picked up on it too haha! Thanks though, man. Been trying to find good tutorials to learn js, but everyone else sounds either very boring/not engaging. Gonna check for other videos you have. thumbs up
ha don't fret my brother, you have helped me more than any other content creator in getting a full-time position. I've gone from here to finishing a few angular 1 projects now working on react and angular 2 (now that it's out of beta) going to try some vue next.
hahaha!! Nice one! Brad has that classy Boston accent :)
I was gonna say Matt Damon
I think he sounds more like Matt Damon.
Hi TEACHER, I watched your courses many times and I understood them as well as I want, I'm proud of you teacher.
0:48 "forgive me if I go over stuff you already know"??? The title of the video is "Javascript fundamentals for (absolute) beginners.
help!!! im stuck with an error!
var apple = new object();
apple.color = 'red';
apple.shape = 'round';
apple.description = function() {
return 'an apple is '+this.color+' and '+this.shape;
}
console.log(apple.description());
why the fuck does the console says javascript0.js:1 Uncaught ReferenceError: object is not defined
at javascript0.js:1
im using sublime text and chrome.
JavaScript is case sensitive, first line should be:
var apple = new Object();
wtk300 thank you so much sir, helped me alot, and isorry im just newbie in coding. But im willing to learn.
Thank you for this. I am returning to Uni after 3yrs hiatus and even tho I am a Junior in Software Engineering degree... I REALLY needed a basics review to get my dormant programming brain cells activated again. I did note that this was done in 2016... and I am familiar with this syntax. I will now watch the update and hopefully that will show the changes in common JS, like let and ${} concatenating, etc. that I have begun to see. This was very succinct and helpful of an overview refresher.
If this is fundamentals,then what the hell ia advanced
Same bro 😢😢
@@thethugguy2437I don’t recommend this tutorial for beginners because he doesn’t really get into detail. If you want to learn from 0, checking out other, more precise and longer tutorials I think would be ideal.
@@dianaabisheva745 thank you bro
Very good vide. I picked up quite a bit. My big take away was returning false on the function when validating the form. I didn't know it would halt the form submission. That's going to be used tomorrow. Thanks again.
So 9 minutes of discussing text editors? Real tutorial starts at 9:00
Gob blessyou!
There is a FFW button for you "efficient person"!
How about just saying "thank you"? Nobody needs your crap.
I benefited from it. I downloaded Sublime text and will be using it now.
have a reply
Thanks for this tutorial. I have to learn JavaScript for university and I have so much problems with it. Your video is helping me a lot. Thank you again.
Pro-tip: Set the speed to 1.25x normal speed. Speeds up the delivery. Super helpful video!
Thanks for the video. I learned a lot about the JavaScript language (specifically the terminology), not so much about programming in general. Just for future reference, I'd recommend you invest more time talking about how the language is used in the real world, especially when it comes to objects.
Found myself trying to do too much with my limited knowledge in JS this helped me a bit
I completed CSS, Materialize and this tutorial. You did it very well man ! I'm going to learn jQ React in nearest future . THANKS
Hi Brad, time kept me away from programming for a long time...you know here in Bangladesh we guys have to face lot of obstacles....but after watching your this tutorial I lost myself completely & time passed away so nicely it seemed only 20 minutes. My programming addictions are rising again....before it was C#.....why not javascript this time : >. Thanks..!
It is kinda like Lua for example
*Alert*
For js:
alert("Hello!")
For lua:
print("Hello!")
*Variable*
Js: var xd = 32
Lua: local xd = 32
*New*
Js: new Object
lua: Instance.new("ObjectName")
But they in common are very different.
Lua is used for games.
Js is used for websites.
Really great primer, especially for an experienced programmer who just started with JS this morning! Thanks.
lol I just watched this video before going to my job interview and I had written down that I know javascript which I don't. let's hope I get the job. This really was helpful, thanks.
I'm amazed how you did it: js in one hour and it covered all the basics! You're really talented. Thanks for sharing this with us =)
i was watching your tutorials of css and html and m gonna definately get this cours of js from udemy because i think that you are one of rare ppl who can explain this very well soo ppl can really learn something !
dude, great demo on forms and how to connect the dots. It's nice to see how arrays/function etc are used in real applications. I have been struggling with that concept for awhile. You just cleared it up thx a lot.
Thanks so much Boss i really appreciate, you made me understand this better by breaking it down one after the other 'Respect'
I am beginner and your video gave me overall insight differently. Thanks
I've really learnt something new today. Brad you are the man....JS simplified
I love this videocourse a lot! I wish I had started to learn JavaScript a lot sooner. Thank you, bro, for making this helpful resource for us newbies.
I'm busy with a JS course and this video really helped me alot.
thanks a lot Mr brad ......! you are really helping a lot of people like me.....!, who want to learn something,
but they can't take any paid courses, and they don't know how and where get to right courses,
thanks once again .
may god bless and keep you always.......!
You Sir, have taught me more in 1 hour that my boot camp has in a week lol. Thanks and keep up the great content!!!
i learned HTML 5 and CSS 3 from Brad, very nice and explained Crash Courses but i've been noticing that learning programming languages since 2016 to 2018 has really blown up, i was watching this video yesterday because i never finished my note and etc, but later i refresh how many views this got and when i first saw it it was in 869k but now it has 909k on views... meaning that the rate of learning coding has grown overwhelmingly too much. something i was just very anxious that i wanted to leave out there
Nice tutorial ,as iam totaly beginner to web language i realize that i should learn html first,then learning additional languages like php and jquery is also necessary....This is nice tutorial as a start..Thanks
I'm starting out my run this year and this was a indeed a beautiful start. Thanks for sharing this, Traversy. I wonder, if you have some more recommendations for complete beginners!
i just subscribed to your angular course in udemy. i thought i'll just quickly see some javascript intro and continue course. watching this video seemed very similar, lo and behold was pleasantly surprised to find out that its you!
very nice video thank you. onward to your angular course!
Hello Brad, Thank you..! This is the first video that shows js so detailed and how to be used. I am learning a lot.
Hi Brad, This is very straight forward, right to the point JavaScript mini-course that I could manage to find on the internet/ CZcams channels among too many other available courses/ videos. Thanks very much and congratulation for the great job.
I found the "for loop of an array a little confusing" - so just to clear it up for others and myself [31:36]
var numbers = [33,54,76,34,2,6] //Here we have 6 "items" so numbers.length = 6. What messed me up is their "position" value is [0,1,2,3,4,5]
for(var i = 0; i < numbers.length; i++){ //Here we're saying start "i" at 0 and add +1 until it reaches less than numbers.length (=6)
console.log(numbers[i]);
//Lastly what's happening here, is we're saying display in the console, from the numbers in our numbers array, the value that corresponds to the position indicated by i. So at the start of our loop "i" = 0 (because that's our initial condition). What 0 refers to, is the 0th position within our numbers array. The number at that position is 33, thus we will display 33 in the console. Then the next loop "i" = 2, which means it will display 54, and so on.
What messed with my head a little was I didn't understand how we could be displaying 6 items on the console, if we have i < numbers.length. Numbers.length is 6 so I didn't understand how we could display 6 items, when telling i to go as high as 5. But, that's where the 0th position comes into the play with arrays [which was mentioned earlier].
I'm a novice just starting out - thanks for your tutorial. It was very insightful!
Thank you sir, you're an excellent teacher.. Am 50, and just starting out..
One of the best crash courses out there!
Bravo for this tutorial!
I am using Brackets, pretty simple and powerful, too.