[JavaScript] 5. 함수의 선언과 표현, Arrow Function

 

1. Function

 - fundamental building block in the program.

 - sub-program can be used multiple times.

 - performs a task or calculates a value.

 

 

2. Function declaration

 - function name(param1, param2) {body... return;}

 - one function === one thing

 - naming : doSomething, command, verb

 - e.g. createCardAndPoint -> createCard, createPoint

 - function is object in JS

function printHello() {
	console.log('Hello');
}

printHello();

function log(message) {
	console.log(message);
}

log('Hello')'

 

 

3. Parameters

 - premitive parameters : passed by value

 - object parameters : passed by reference

function changeName(obj) {
	obj.name = 'coder';
}

const a = {name: 'apple'};
changeName(a);
console.log(a); // {name: "coder"}

 

 

4. Default parameters (added in ES6)

function showMessage(m, from = 'unknown') {
	console.log(`${m} by #{from}`);
}

showMessage('Hi!');

 

 

5. Rest parameters (added in ES6)

function printAll(...args) { // 인자를 배열로 받는다.
	for(let i = 0; i < args.length; i++) {
    	console.log(args[i]);
    }
    
    for(const arg of args) { // 위 반복문과 같다.
    	console.log(arg);
    }
}

printAll('dream', 'coding', 'apple');

 

 

6. Local Scope

let globalMessage = 'globe'; // global variable
function printMessage() {
	let message = 'hello';
    console.log(message); // local variable
    console.log(globalMessage);
}

printMessage();

 

 

7. Return a value

function sum(a, b) {
	return a + b;
}

const result = sum(1, 2);
console.log(`sum : ${sum(1, 2)}`);

 

 

8. Early return, Early exit

function upgradeUser(user) {
	if (user.point <= 10) {
    	return; // early return
    }
    
    // long upgrade logic...
}

 

 

9. Function Expression

 - a function decalration can be called earlier than it is defiend. (hoisted)

 - a function expression is created when the execution reaches it. (not hoisted)

const print = function() { // anonymous function 이름없는 함수
	console.log('print');
}
print();

const printAgain = print;
printAgain();

const sumAgain = sum;
console.log(sumAgain(1, 3));

9-1. First-class function

 - functions are treated like any other variable.

 - can be assigned as a value to variable.

 - can be passed as an argument to other functions.

 - can be returned by another function.

 

 

10. Callback function using function expression

function randomQuiz(answer, printYes, printNo) {
	if (answer === 'love you') {
    	printYes();
    } else {
    	printNo();
    }
}

const printYes = function() { // anonymous function
	console.log('yes!');
}

const printNo = function print() { // named function
	console.log('No!');		// better debugger's stack traces
}

 

 

11. Arrow function

 - Always anonymous function

const SimplePrint = () => console.log('simple print!');
const add = (a, b) => a + b;

 

 

12. IIFE : Immediately Invoked Function Expression

(function hello() {
	console.log('IIFE');
})(); // 선언한 함수를 바로 호출한다.