JavaScript For Noobs : Part - 1
Milan Mohapatra
Posted on October 21, 2022
Basics Of JavaScript : " What you need to know to become PRO "
As a developer it is a ritual to say Hello! to world. So, let's learn how to write your first Hello! World in JavaScript
console.log('Hello! Word of Developer')
- console is a JavaScript object who is identify as console of web.
- there is a log() whose job is to print output.
- and you know sentence between " and ' is string.
Eg.
console.log('Hello', 'World', '!')
console.log('HAPPY', 'NEW', 'YEAR', 2020)
console.log('Welcome', 'to', 30, 'Days', 'Of', 'JavaScript')
1. Comments in JavaScript
comments are the most essential part of programming. Because, if you don't know how to comment you are not a developer. In JavaScript we basicity have two types of comments.
- Single line comment
// this is a single line comment
- Multiline comment
/* This is a multiline comment This is a multiline comment */
2. Syntax
Every programming language has its own structures and rules to write code so, as JavaScript that called syntax. If you don't follow that syntax you will get error in console.
Tackle that syntactical by solving error is called debugging.
3. Adding JS to web page
There are three way to put your JS in HTML page
by
- inline JavaScript
- internal JavaScript
- external JavaScript
Home Work: google HOW?
NOTES: Do you know you can add multiple JS file in a single HTML page. Yes! we do it externally.
4. Types
- Numbers (both Integer and floating point number)
- Strings
- Booleans (true & false)
- Undefined (Not assigned == Undefined)
- Null (Empty)
NOTE:
- null is a default type of objects
- collection of one or more characters between two single & double quotes, or backticks.
you can check type of datatype by typeof
operator
Eg.
console.log(typeof 'Asabeneh') // string
console.log(typeof 5) // number
console.log(typeof true) // boolean
console.log(typeof null) // object type
console.log(typeof undefined) // undefined
5. Variables
Variables are containers of data. Variables are used to store data in a memory location. When a variable is declared, a memory location is reserved. When a variable is assigned to a value (data), the memory space will be filled with that data. To declare a variable, we mostly use let to create non constant variable and const for constant variable. But we will ignore var due to avoid useless scoping error.
5.1. Variable Naming Rules
- should not begin with a number
- not allow special characters except $ & _
- follows a camelCase convention
- should not have space between words
Eg.
let firstName = 'Asabeneh'
let lastName = 'Yetayeh'
let country = 'Finland'
let city = 'Helsinki'
let age = 100
let isMarried = true
let age = 100
const gravity = 9.81
const boilingPoint = 100
6. Data Types
data types can be divided into two types
- Primitive or inbuilt
- Non Primitive or reference type
6.1. Primitive Datatypes
- Numbers - Integers, floats
- Strings - Any data under single quote, double quote or backtick quote
- Booleans - true or false value
- Null - empty value or no value
- Undefined - a declared variable without a value
- Symbol - A unique value that can be generated by Symbol constructor
6.2 Non-Primitive Datatypes
- Objects
- Arrays
- Functions
NOTE: Primitive data types are immutable(non-modifiable) data types. Once a primitive data type is created we cannot modify it.
6.3 What is mutable and Immutable in JavaScript
As we create primitive variable if we want to change the value we have to reassign the value. Modification and reassignment is completely two different things. But in case of object or non-Pre variable there is a allocation of memory and reference is assigned to a variable that's way we can modify the vale of variable without re assigning that is the concept of mutability
NOTES: we do not compare non-pre data types. Do not compare arrays, function or objects. Non-pre values are referred to as reference types, because they are being compared by reference instead of value. Two objects are only strictly equal if they refer to the same underlying object.
7. Math Objects in JavaScript
Math objects has pre defined methods who helps to works with numbers.
Math.PI // 3.141592653589793
Math.round(PI) // 3 to round values to the nearest number
Math.floor(PI) // 3 rounding down
Math.ceil(PI)// 4 rounding up
Math.min(-5, 3, 20, 4, 5, 10) // -5
Math.max(-5, 3, 20, 4, 5, 10) // 20
Math.random() //random num bet 0 to 0.999999
Math.abs(-10) // 10
Math.sqrt(100) // 10
Math.pow(3, 2) // 9
Math.E // 2.718
Math.log(2) // 0.6931471805599453 (log 2 base E)
Math.LN2 // 0.69
Math.LN10 // 2.30 (ln 10)
Math.sin(0)
Math.cos(60)
Eg. generate a random number between 5 to 10 include
console.log(5 + Math.floor(Math.random() * 6))
8. Strings in JavaScript
Strings are texts, which are under single , double, back-tick quote. To declare a string, we need a variable name, assignment operator, a value under a single quote, double quote, or backtick quote.
Note : ' ' space also goes into strings in JS
8.1. String Concatenation
Connecting two or more strings together is called concatenation.
Eg.
let fullName = firstName + space + lastName
8.2. Escape Sequences
\n: new line
\t: Tab, means 8 spaces
\\: Back slash
\': Single quote (')
\": Double quote (")
8.3. Templet Literals
To create a template strings, we use two back-ticks. We can inject data as expressions inside a template string. To inject data, we enclose the expression with a curly bracket({}) preceded by a $ sign.
Eg.
console.log(`The sum of 2 and 3 is 5`)
let a = 2
let b = 3
console.log(`The sum of ${a} and ${b} is ${a + b}`) // injecting the data dynamically
Eg.
let a = 2
let b = 3
console.log(`${a} is greater than ${b}: ${a > b}`)
8.4 String Methods
String has inbuilt some methods who helps to work with strings
str.length
str.charAt(1) // access index 1
str.charCodeAt(5) // access ASCII of chat at index 5
str.toUpperCase()
str.toLowerCase()
str.substring(0, 5) // 0 to 4
str.split(" ") // return array of splited string wrt space
str.trim(' ') // trim space from beginning and end
str.includes('string') // return true if present
str.replace('strx', 'stry')
str.indexOf('str') // return first occurance
str.lastIndexOf('str') //return last occurance
str.concat(str)
str.startsWith('str') // true if starts with
str.endsWith('str') // true if ends with
str. search('str') //return index
str.match('str') // return array
str.repeat(2) // repeat twice
9. Typecasting in JavaScript
As we know type casting is of two types
- External Typecasting
- Internal Typecasting
9.1. External Typecasting
To Number
parseInt(str)
Number(str)
console.log(+str)
parseFloat(str)
Number('mil') // NaN
9.1.1. Date to Number
Number(dt)
dt.getTime()
9.1.2. Boolean to Number
Number(true)
9.1.3. To String
String(num)
num.toString()
9.1.4. Date to String
String(dt)
dt.toString()
9.1.5. Boolean to String
String(false)
9.1.6. To Boolean
Boolean(0)
Boolean(1)
9.2 Internal type casting
It happen when one data type is automatically converted to other data type.
Eg.
console.log(10 + '10') // 20
// string converted to int then added
PART - 2 IS COMING.........
Posted on October 21, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.