How to Master JavaScript Step by Step | The complete Path from scratch to expert.

ladies and gentlemen today we gonna talk about how to learn JavaScript step by step a lot of confused people out there and a lot of people ask me every single day on my channel how do I learn jóska how do I where do I start how do I become an expert so today I'm gonna I'm thinking okay I'm gonna I'm gonna make this video where I show you the step by said the way I learn and the way I know because there's so much bad material out there and a lot of people are confused by the trick is actually not to learn everything the trick is to learn the right and most of us are actually targeting either a node or some JavaScript framework right and and so I'm gonna show you all the steps to become a expert at that and then I'll show you some of the stuff beyond that where you can actually become an expert so you can actually navigate to any problem that occurs in JavaScript and you can actually solve our advanced problem and I will also show you on the way not what not to learn or what to forget and if you stick around to the end I'll show you some of the resources I'll use to learn this stuff and welcome to tech see tutorials if you wanna learn JavaScript I should suggest learn JavaScript in isolation without using HTML or CSS at the at least in this in the beginning ok learn it as a language so that's what we're going to do and then we'll look at the Dom manipulation and whatnot all right let's just start with the first thing I would have known is types and scope so I need to learn how to define a variable and so the first thing I want to learn is let and cost okay where do you slang word to use constant what's the difference between to forget about war I would say if you're new don't don't learn of art because a problem that happens to me too are you know what I deal with right so forget about it you wanna learn about scope okay how the school works the block scope okay because you're using your lead and Const you're gonna deal with block scope right so what is a block scope what is a global scope okay how do access things from gross what is the lexical scope okay when you access something from outside automatically that's called lexical scope so you need to understand global scope block scope and Lexus okay now you are ready to move to data types okay there are two data types or two kind of data types in Java Script the one is primitive and the second is reference or complex data types so let's look at the the first time the primitive data types numbers string boolean undefined and now and simple so the first two undefined and all their empty values want to use it how exactly they work why there are two different types and what is the difference between two okay when you define a variable without assigning a value what really happened it's undefined right so that's how the empty values are then move to numbers how to define how to define a number what's the largest value means that you can have as a number what is the largest integer or floating point what is it infinity what about the math library okay because you're gonna be doing a lot of math operation and even though the numbers are primitive data types you can still use some methods on it how to access it okay fine if I put some number underscore underscore underscore underscore underscore I should be able to see the all the methods I can use the math library has a lot of math functions number library okay number library a lot of methods you can use so you need to find out where they are what are the functions or methods and you should be able to try it out a few things all right the next thing is strings okay another primitive type how to define an empty string what's the difference between double code single code and a backtick template strings right I'm going to use which to use where are the string matters if you do a particular string dot underscore underscore proto underscore underscore you should be able to see all the spin string methods and you should be able to use it now I'm not trying to say that okay at this point you should know the prototype inheritance but you should at least know where to find all this method so that you can start using it right and then try them out try them out bullying okay another perimeter data type and the last a premie data type is symbol if you're trying to learn I would just put sing I would not learn symbol at this point I would move on to another topic which is which is type conversion okay what is type conversion I wanna convert one primitive data type to another it's a string to number number two string string to boolean 1 there are a few simple rules that applies when you want to do this and a lot of people are confused they they try to they try to convert everything to everything and it gets really weird but there are a few simple rules okay and I think there are two key roles they need to follow okay if you don't if you don't know this rule ask him you know I'll tell you all right the next topic is operators and statements so what are the operators operators are you know the like equal sign plus sign you know so there are math operators you know plus minus plus plus and all that stuff right then there are comparison operators double equal sign whatever they're logical operators there are binary operators but there are some other operators right so you need to understand all the operators and what they do what about the statements okay you have a for loop while loop if statements all of that right so like a lot of basic stuff that you usually use in a programming language if you're coming from another programming language how it happens in jóska because there might be some nuances that you don't know so at least try it out now it's time to move on to reference data types now we are getting into a little bit complex territory what are there there are data types you have objects arrays sets maps and then some others like type 2 arrays and all that stuff right you should be able to create an empty array using array literal I do not use constructors to create a race that is like old way to do it how to add things at the end using Porsche how to remove things from the end you Paul how to add something in the front how to add or remove something from the front of the array how to add something in the middle how to remove something from the middle how to iterate through that are using for loop for each loop for off loop in the end you also need to know how to create multi-dimensional arrays so already there let's say if you want to create a matrix you should be able to you should know how to do it alright so the next thing is objects JavaScript objects they are the like the heart of the JavaScript you need to know how to create an empty object using object literal do not use constructors again you should be able to add values to it because you know Johnston Bob does nothing but key value pairs so you should be able to add a different kind of keys keys without space key keys would space and you need to know how to access it how to delete a problem how to modify it how to iterate through it now when you use an object there is a for in loop you can also use for off off loop using object keys and object or values newly introduced in es6 how to add methods to opt like you can have a method send those method can access properties of those objects the keys and values right how to use those properties using this dot okay so you need to understand how this works inside an object you also need to know what is it this structuring okay if I'm trying to access the property of properties of the object and assign to a variable D structuring is very helpful okay next move to a different data structure Maps and says okay these are the new data structures they were introduced in es6 okay what aren't there you need to understand how to use them all that so I have actually lost a tutorial on it if you want to check it out I'm not gonna provide a link here but you can just go through my channel so now the next topic is functions okay now the real work starts now we understand the data structures now functions within the function you are a first thing you want to learn is the function declaration and function expression in jar scheme you're gonna be using mostly function expression which is like a function stored inside a variable you also need to know what is an anonymous function what is an immediately it was invoked function expression okay nowadays we don't use it that much but you need to understand they need to then you need to know default parameters how does that default parameters yes it's available in JavaScript now sprout operators and rest parameter and since you already know about the arrays and object spero operator will help you create a shallow copy of objects and arrays and also it allows you to merge two objects or arrays the next topic is very important callback functions you're gonna be using this a lot I think Java Script is pretty much all callback functions so you need to understand why have you used it basically is a function passed into another function and executed at some point of time it's not that hard so that's of all about the basics of Josten now we are ready some some serious work with object-oriented jóska okay when it comes to object oriented JavaScript jóska is actually portable inheritance Java's get follows predictable inheritance not the classical inheritance like Java okay it does have classes but it's it's kind of like a syntactic sugar actually so I would suggest learn about the programming errors what is a prototype create a constructor even though you nominate he wasn't much I would just at least understand how to add properties and methods to to purify so you can understand it better and then once you don't have to go too deep as long as you understand the pervert ID chain then move to classes error function okay I kept it for last because you need to understand function before you and before you understand our ultimately Joseph is actually a functional programming language believe it or not it's uses more functional program than object-oriented so it's important functional and I would say the first thing you are learning in a functional programming is call applying by then learn about higher order function when you return a function from a function what really happened closures okay that's what really happens closures are so important even though you don't use it intensely but you need to understand why why they are being used function chaining will you change the function like X dot y dot Z dot you know I'm going to change a function like that Map Reduce filters each and some very important to understand khari function it's again the same principle of hi or function the next thing what I learned is modules if you learn any new Java framework you will see this import X people react from react right so these are all modules a importing and exporting all right we almost there so the next thing you want to learn is all the icing operations right set timeout set interval fetch API if you if you are working in a project there's front-end project most probably you're gonna make API call and fetch API is a new newer way to do it then you have to learn promises because if you use fresh API you're gonna make a few promises right and you can also learn async await but now it's time to actually use HTML and CSS and JavaScript combined so we need to understand don't look very well so how do i navigate you're down using javascript how to add events to particular a particular element ok event bubbling and capturing because when you when you click somewhere some in a button actually the click is actually happened on every single element so if you have a click event they would happen so you need to understand that how are you want propagates and how to stop those events from happening so I would say that's all you need to become an expert in javascript in the next step next step is actually a master of JavaScript how do I become a master of JavaScript well I need to I need to learn some additional topics or I need to go out and actually learn what are the things that are going in or coming up or changing in JavaScript and I would do constantly work hard to actually keep an eye on all of that right and so I'm gonna suggest few topics but I mean Jonathan is too vast but I will select some of the topics said if you learn you can actually get into the territory proxies and the deflection symbols remember I told you a primitive type symbols allows you to create unique values in try JavaScript regex regular expression you're gonna try to recursive jóska now right now it's a little bit riskier to use a recursive operation than jost it because it doesn't have the tail optimization but I think it's coming so soon we will be able to use it comfortably okay you can also learn that workers to do so you can delegate some work out to some worker if you have very computational intensive work eventually have to do some time generators also very important their nutrition in JavaScript if you have used reading saga you probably have seen generators right so these are all the all the good topics to actually become master in JavaScript sure I say okay now let's look at some of the resources that I usually one of my favorite author is dr. Alex Rashmi he has a website called exploring J's comp and I often watch that and he actually has a lot of topics on upcoming JavaScript and also look at the evolution of JavaScript there's this great github project that actually keeps track of all the features that are coming in javascript the next feature the proposal in August of I'll provide a link here I usually watch out for them as well and by the way a lot of topics are that I mentioned here I already have lots of tutorial on work where two generators two promises and all that stuff go ahead and check it out I don't want to provide all the slings here because I think you two only Pro allows you to do a couple but since you have access to my channel you should be able to navigate to it if you have any questions feel free to ask me if if you are can confuse with particular topic or path and I hope you learned something from this video and if you did please like don't forget to Like subscribe and provide a nice comment [Music]

Channel: techsith

Views: 49,501

Keywords: java script, javaScript, master js, mastering js, javaScript basics, JavaScript knoledge, javaScript 2018, JavaScript 2019, techsith

Id: gflV5llbsL0

Length: 16min 12sec (972 seconds)

Published: Mon Nov 05 2018