Plan: read online documents, enroll in code academy, and build projects.
I have no experience or background with JavaScript. To tackle this problem, I will read documents going back to the history of JavaScript. Even though this may be irrelevant to some people, knowing the history of JavaScript helps me understand the language. My first programming language is Ruby so you can see me refer Ruby and how similar and different they are.
To be honest, I am only reading/working on basics to set myself up better before I learn React with Redux. I want to learn JavaScript’s fundamental concepts and syntax. If you are already more knowledgeable or looking to dig deeper, this may not be suited for your needs.
All information will be in this learning path: https://javascript.info/
Use this document to follow along my thought process:
https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics
What is JavaScript
- It’s a programming language that is very popular. Used with dynamic web applications. If you get more advanced, you can create 2D and 3D games
- Mostly used in a browser
A “Hello World!” example
- I downloaded the example folder and followed the example on Visual Studio Code.
In this example, I added one line of code in my html file (index.html) with a
<script>
tag that let me add JavaScript dependencies to render a heading. I stored the string “Hello World!” inmyHeading
variable and it override the written html heading.Yay! This is my first JavaScript code 😊
Language basics crash course
- These are similar to Ruby and most programming languages
Variables
Variables are containers that can have values stored.
One difference in JavaScript is it starts with
let
to declare your variable. I have also seenconst
andvar
Variable names are case sensitive and can be Capitalized unlike in Ruby.Variables have data types. String, Number, Boolean, Array, Object and more
Using variables is helpful to create dynamic applications.
Comments
Things can be commented out in one line with
//
Multiple lines of code can be commented out with
*/
just like CSS
Operators
- Operators are the same as Ruby. The difference is strict equality is three equal signs
===
and for a NOT equal… it is!==
Conditionals
- Code structures used to test if an expression is
TRUE
orFALSE
- Mostly used in if-else statements
- The document uses this example:
- What I can see different from Ruby syntax is the expression is inside (parenthesis)
- Uses semicolons after statements.
- Uses curly brackets as blocks???
Functions
- Functions are similar to methods in Ruby
- There are in-built functions and you can also define functions
- Functions are followed by (parentheses) and take arguments separated by commas
- Here is an example of a defined function that multiplies two numbers
function multiply(num1, num2) {
let result = num1 * num2;
return result;
}
- I ran this in the console which can be accessed in the browser through developer tools and the function works!!
Events
- Real interactivity with the browser. These interactions need a handler. These are code that listen/wait for these activities and run a code when it happens.
Top comments (1)
I would recommend this well written book, that is available for free. Javascript is more a melange of different ideas, but this would give you a cobnsisrent view.