JavaScript Day2

JSCCC
4 min readJan 7, 2021

Strict mode

Strict mode is a special mode that user can activate in JS which makes it easier for us to write a secure JS code.
All user needs to activate this strict mode is to write this at the beginning of the script.
‘use strict’;
Without strict mode, JS will fail silently without letting user know that there is a mistake.

Function declarations vs Expressions

Just like a variable starts with ‘var/let /const’, function declaration also should begin with ‘function’ and it is used as function name to invoke the function.

ex)
function age1(year) {return 2020-year;}
console.log(age1(2020));

Function expression is stored in a variable.

const age2 = function(year)
{ return 2020-year; }

Users do not name this function but store it in a variable ‘age2’.
It’s invoked using a variable’s name. anonymous!

Expression produces a value. So ‘age2’ variable holds a value of this function.
In JS, functions are just values not a type or statement
The difference between expressions and declarations is that user can call function declarations before they are defined in the code but function expressions only can be used after they are initialized. Which one is better than another? It’s just a personal preference.

Arrow functions

It is shorter and faster way of function writing for simple one line code.
Its return happens implicitly without having to write a return code explicitly.
const/let/var function_name = (parameters) => { }
Fat arrow ‘=>’ separates parameters and function body.
When there is no parameter, () can be just empty.
If function body consists of just one line of code, the curly brackets and return are not needed.

ex)
const age = year(parameter) => 2020 — year;

const years = (birth, name) => {
const age = 2037 — birth;
const retirement = 65 — age;
return `${name} retires in ${retirement}years`;
}
console.log(years(1991, ‘emma’));

Arrays

let friends = [“a”, “b”, ‘c’];
> [“a”, “b”, “c”]
Unlike C language, It prints out an array including [] and “”

console.log(friends.length);
> 3. It shows how many elements this array contains

console.log(friends[friends.length — 1]);
> b. It shows the last element

friends[2] = ‘d’;
console.log(friends[2]); > d
Although variable was declared with const, It can be changed because only primitive values are immutable and an array is mutable.
However, we can not replace entire array.
ex) friends = [‘a’, ‘b’]; > error

An array can hold values with different types all at the same time.
ex)
const first = ‘hello’;
const world = [‘world’, 1–2, first, friends];
> Even a variable name and another array can be used in a same array.
We can also place function calls into an array cause It produces a value.

Array method and operation

Push method
It is technically a function and adds element to the end of an array.
arrayName.push(‘whatever’);
Since it’s a function, It can also return something.
User can pass arguments into functions
What push functions returns is the length of the new array
ex)
const friends = [“A”, ‘B’, ‘C’];
const newLength = friends.push(‘D’);
console.log(newLength);
> 5

Unshift method
It inserts an element at the beginning of the array and It also returns the length of this array
ex)
arrayName.unshift(‘whatever’);

Pop method
It removes the last element of the array.
arrayName.pop();
Users don’t need to pass an argument cos It just takes away last element.
It returns the removed element.
ex)const what = friends.pop();
console.log(what);
>D

Shift method
It removes the first element of the array and returns an element that was removed.
ex)
const first = friends.shift();
> D

indexOf
It returns the index at which this element is located.
ex)
console.log(friends.indexOf(‘A’));
> 1
If users try to find an element that is not in an array, It will return -1

includes method
It will simply return true or false depending on if they have that element or not. It uses strict equality for this check, like === and does not do type coercion.
ex)
console.log(friends.includes(‘S’));
>false

Introduction to Object(literal syntax)

An object of JS is a collection of related datas and It uses curly bracket {}.
User can access a certain property via either ‘.’ dot notation or [“property name”] bracket notation.
Unlike an array[], the order of values of an object does not matter at all when user wants to retrieve values. So an output is arranged alphabetically.

ex)
const info= {
firstName: ‘milky’,
lastName: ‘chance’,
age: 20,
job: ‘singer’,
friends: [‘oat’, ‘almond’]
};
console.log(info.firstName);
console.log(info[“firstName”]);

console.log(info.firstName) = console.log(info[‘firstName’]);
The difference between these is that in the bracket notation, user can put any expression that user would like , so that user does not have to explicitly write the string here but instead it can be computed from some operation cause operation is basically an expression that produces a value.
when user tries to access the property that does not exist, it returns ‘undefine’

ex)
const key = ‘Name’;
console.log(info[‘first’ + key]);
User can create a new string concatenating them together in []notation.Dot notation is recommended to use as it is more readable and easier to use.

ex)
info.location = ‘usa’;
> adding new property.
info[‘sns’] = ‘instagram’;

Function expressions that produce values can be used in an object.
const info = {
year: 2020,
age: function(n){
this.age = this.year — n;
return this.age;
}};
To create new property ‘age’, user should activate this first by calling this function.
ex)
info.age();
console.log(info); > all objects alphabetically

Iteration: the for loop and While

Loops are a fundamental aspect of every programming language cause they allow users to automate repetitive tasks that are performed over and over.
ex)
for (let i = 1; i <= 10; i++)
{
console.log(`number ${i}`);
}
ex)
let i= 0;
while (i < 6){
console.log(`number${i}`);
i++;
}

Continue and Break

continue is to exit the current iteration of the loop and continue to the next one. On the other hand, break is used to completely terminate the whole loop.

--

--