JavaScript Day 1

JSCCC
4 min readDec 15, 2020

I wanted to take a full stack web course in Udacity and in order to start, I should be able to write codes with object oriented language. Since I’ve only studied C language, I decided to take JS course in Udemy beforehand.

3 ways of variable declaration — var, let, const

1. Var
Var can be re-declared later and it is also mutable. However, It is not good practice to use this and leave a potential to create a bug later. Var is old way of declaring variable so that it is not used as often.

2. Let
Let is used to declare any types of variables such as number, string or character unlike C language. It is mutable but can’t be re-declared.

3. Const
Const is also similar in a way that it is used to declare variable like let and var except for the fact that its value is immutable and can not be re-declared. As this value can not be changed once it is declared, of course it can’t be left empty. It makes a variable a constant so that it does not create any sorts of error. To write a code clearer and easier to be read, it’s better to declare variable with ‘const’ when it’s certain that it won’t be changed.

Basic operation

Assignment operator and math operator both are pretty much same concept as C language.
Output of “console.log(2**3)” is 8, which is basically 2 * 2 * 2. So ‘x**y’ means x to the power of y.

Operator precedence

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence

let x, y, a, b;
x = y= 1 +2;

According to precedence order, It’s processed left-right as +,- signs have higher precedence than = sign.
Thus, y became 3 and then x is automatically declared as 3.

a = b+ 1 = 1 + 2;

This causes error cause b has not been declared yet.

Template literal

Template Literal in ES6 provides new features to create a string that gives more control over dynamic strings. Traditionally, String is created using single quotes (‘) or double quotes (“) quotes. Template literal is created using the backtick (`) character.
https://www.geeksforgeeks.org/javascript-template-literals/

`${Expression}`
For instance, when trying to concatenate multiple variable in a string using single quotes(‘) or double quotes(“), plus sign(+) is normally used.

let a = “hello”;
let b = ‘world’;
console.log(“Print out” + a + “and ” + b);

To get a output “Print out hello and world”, It should be separated by single/double quotes several times and added with plus(+) sign. Here comes the usage of template literal to make this way simpler.

console.log(`Print out ${a} and ${b}`);

With backtick(`), this statement does not need to be separated each time new variable is called. An expression and operator can be written inside of this bracket{}. For example, if-else statements can’t be used in this bracket since it is a statement that doesn’t produce any value, but ternary operator can be written.

Type conversion and coercion

Type conversation is when it is manually converted to different type.
const x = ‘10’;

console.log(Number(x), x); >10(number) and 10(string)
console.log(x + x); >1010(string + string)
console.log(Number(x) + 18); >28
console.log(Number(‘emma’)); >NaN (Not A Number)
console.log(typeof NaN); >number. It’s still a number but it’s an invalid number.
console.log(String(23), 34); >23(string) and 34 (number)

Coercion happens whenever operator is dealing with 2 different types.

console.log(‘I am ’+ 25+ ‘ years old’);
In JS, the plus operator that we used here triggers a coercion to strings. Thus, every time there is an operation between a string and the number, the number would be converted to a string.

console.log(‘23’-‘10’ -3); = 3
In this case, strings are converted to numbers.
Unlike plus(+) operator, minus(-) trigger the opposite conversion.
All operators except for plus sign(+) happens this way.

ex)
let n = ‘1’ + 1; >
Output of this is ‘11’. Number 1 is converted to string 1
n = n-1; >
10 because minus(-) sign coverts string to number.

ex)
‘10’ -‘4’ -’3'-2 + ‘5’ = 15

Between Boolean value and number, Boolean is converted to the number because it is just easier. Boolean True becomes number ‘1’ and False becomes number ‘2’.

Truthy and Falsy value

Falsy value is not exactly false but it will be a false when It is converted to a Boolean. There are 5 falsy value.
1. 0 (number zero)
2. ‘’, “” (empty string)
3. undefined
4. NULL
5. NaN
Other than these falsy value, everything else is a truthy. Like, A string that includes number zero(0), a string containing the word “False”, empty array and function will be true once it is converted to Boolean.

Equality operation ==, ===

=== is a strict equality operator so that It does not perform type coercion automatically. It’d be better practice to use operator even though user needs to convert type manually sometimes.
== is a loose equality operator so it perform type coercion.
For example,

‘10’ == 10 > True
‘10’ === 10 > False

Boolean logic, Logical operator, Switch statement. The conditional(ternary) operator

This concepts are also very similar to C language. So, skip.

Expressions and Statements

Expression is a piece of code that produces a value and statement is a bigger piece of code that is executed and does not produce a value itself.
Such as if-else is executable statement but It does not produce any value.

First, JS looked like whole different new language from C but so far, It is quite similar when it comes down to logic and fundamental. I don’t have to add any library on the top of codes and assume that I don’t have to care for memory management, which actually sounds nice and easy! I’ve only taken this course for 5 hours so far, so let’s see how it turns out later.

--

--