Day 37 - 16/10
Plan:
Morning - 15h30: Learning Js: Bit wise, Regular expression, Precedence, Error, Scope, Hoisting, Strict mode, this Keyword, Arrow function, Class
>15h30: Converting web to html:
Progress:
Bitwise
Js uses 32 bits bitwise operands
Decimal to Binary
function dec2bin(dec){
return (dec >>> 0).toString(2);
}
dec >>> 0
: doesn't shift the number, just convert the dec value to number and set the sign bit to 0 (always positive)
Binary to Decimal
function bin2dec(bin){
return parseInt(bin, 2).toString(10);
}
Regular Expressions
.search(" ");
: return first position
.match(" ");
: return every matches posible
.replace("one", "other");
: consecutively replace words "one" with word "other" each time activate
pattern.test("string");
: check if string contains pattern
pattern.exec("string");
: search for the first pattern matches in string and return it as object
A regular expression is a sequence of characters that forms a search pattern.
/ /i : case-insensitive matching
/ /g : global match (find all matches)
/ /m : multiline matching
[abc] : Find any of the characters between the brackets (case-sensitive)
[0-9] : Find any of the digits between the brackets
(x|y) : Find any of the word or letter
\d : Find a digit
\s : Find a whitespace
\b : Find a match starts with WORD ( \bWORD ), or ends with WORD ( WORD\b )
\uxxxx : Find the Unicode character specified by the hexadecimal number xxxx
n+ : Matches any string that contains at least one n
n* : Matches any string that contains or not contains n
n? : Matches any string that contains zero or one n
Error
try {} : define a code block to run
catch(err) {} : define a code block to handle any error
finally {} : define a code block to run regardless of the result
throw {} : define a custom error
Use "try" and "catch" in pair
Error Object properties
name : set or return an error name
message : set or return an error message
Error Name value
RangeError : A number "out of range" has occurred
ReferenceError : An illegal reference has occurred
SyntaxError : A syntax error has occurred
TypeError : A type error has occurred
URIError : An error in encodeURI() has occurred
Scope
In JavaScript, objects and functions are also variables.
Types:
block scope: provided when "let" or "const" is used inside a block. "var" doesn't have block scope
function scope: each function creates a new scope, variables can not be accessed from outside
global scope: a variable declared outside a function become global; can be accessed by all script and function on the web page
When assign a value to a variable that has not been declared, it will automatically become a GLOBAL variable
Lifetime of Js variables
start when it is declared
local var are deleted when the function completed
in web browser, global var deleted when close browser window
Hoisting
Means a variable can be used before be declared
Only "var" has hoisting
Strict mode
"use strict"
Help writing cleaner code, preventing from using undeclared variables.
Not allowed:
Using a variable (or object) without declaring
Deleting a variable (or object), a function, an undeletable property
Duplicating a parameter name
Writing to a read-only (or get-only) property
...
this Keyword
this
refer to:
the object when used in an object method
the global object when used alone ( in a browser window the global object is
[object Window]
)the global object when used in a function
undefined
when used in a function in strict modethe element that receive the event in event handler
.call() and .apply() method can be used to call an object method with another object as argument
.bind() method is for an object to borrow a method from another object
Arrow function
Allow us to write shorter function syntax
From
hello = function() { return "Hello World!"; }
to
hello = () => { return "Hello World!"; }
to ( if function only have 1 statement )
hello = () => "Hello World!";
( if function has parameters)
hello = (val) => "Hello " + val;
to ( if there is only 1 parameter )
hello = val => "Hello " + val;
In Arrow function, this keyword represents the object owns the function no matter who calls the function
Class
class ClassName {
constructor(element1, element2, ...) {
this.element1 = x;
this.element2 = y;
...
}
method1() { }
method2() { }
}
Class is not an object. It's a template for objects
Can use class to create objects:
const elementN = new ClassName("Ford", 2014);
Last updated