1. Function 정리
//Function(함수)
//프로그램을 구성하는 기본적인 빌딩 블록
// 서브프로그램이라고 불리며 여러번 재사용가능하다는 장점
// 한가지의 업무나, 값을 계산하기위해서 쓰임
// 1. 함수 선언(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은 Object -> 그레서 이런걸 할 수있다. 1. 변수에할당, 2.parameter전달, 3.함수를 리턴할수 있음
function printHello(){
console.log('Hello');
}
printHello();
//조금 더 유용한 Function(함수)만들기
function log(message){
console.log(message);
}
log('Hello@');
log(1234);
// 2. Parameters
// premitive parameters : passed by value (value가 전달)
// object parameters : passed by reference(reference 가 전달)
function changeName(obj) {
obj.name = "coder";
}
JavaScript
복사
1-1 parameter에서 object를 parameter로 받을때
const ellie = {name : 'ellie'};
changeName(ellie);
console.log(ellie);
// 3. Default parameters (added in ES6)
function showMessage(message, from = 'unknown'){
console.log(`${message} by ${from}`);
}
showMessage('Hi!');
JavaScript
복사
1-2 Rest Parameter
// 4. Rest parameter (added in ES6)
function printAll(...args){ // ...은 배열형태로 전달된다는의미
for(let i =0; i < args.length; i++) {
console.log(args[i]);
}
//배열출력의 간단한 예 -> for , of
for(const arg of args) {
console.log(arg);
}
args.forEach((arg) => console.log(arg));
}
printAll('dream', 'coding', 'ellie');
console.log('5 : Local scope')
JavaScript
복사
// 5. Local scope
let globalMassage = 'global'; // global variable
function printMessage() {
let message = 'hello';
console.log(message); // local variable
console.log(globalMassage);
function printAnother() {
console.log(message);
let childMessage = 'hello';
}
}
printMessage();
//6. Return a value;
console.log('6 . Return a value')
function sum (a, b) {
return a + b ;
}
const result = sum(1, 2);
console.log(`sum : ${sum(1,2)}`);
console.log('7. Early Return, Early exit');
//7. Early Return, Early exit
// bad
function upgradeUser(user) {
if(user.point > 10) {
//long upgrade logic...
}
}
// good
function upgradeUser(user) {
if (user.point <= 10){
return;
}
//long upgrade logic...
}
console.log('first class function');
// First-class function
// functions are treated like any other variable (다른 변수와 마찬가지로 변수 할당)
// can be assigned as a value to variable ( 변수 할당 )
// can be passed as argument to other functions. (파라미터 전달가능)
// can be returnd by another function (리턴 가능)
// 1. Function experession
// a function declaration can be called earlier than it is defiend . (hoisted)
// a funciton expression is created when the execution reaches it.
const print = function() { //function을 선얺마과 동시에 print라는 변수에 할당, function에 이름없는것을 anonymous function(익명함수)
console.log('print');
};
print();
const printAgain = print;
printAgain();
const sumAgain = sum;
console.log(sumAgain(1,3));
// 2. Callback function using function exprssion (함수를 전달해서 상황에 맞는 함수를 호출 시키는걸 콜백함수!!)
function randomQuiz(answer, printYes, printNo){
if(answer === 'love you') {
printYes();
} else{
printNo();
}
}
// anonymous function 익명함수
const printYes = function (){
console.log('yes');
};
//named function
// better debugging in debugger`s stack traces
// recursions
const printNo = function print(){
console.log('no!');
};
randomQuiz('wrong', printYes, printNo);
randomQuiz('love you', printYes, printNo);
//Arrow function
// always anonymous
const simplePrint = function() {
console.log('simplePrint!');
}
// arrow function
const simplePrint2 = () =>console.log('simplePrint!');
const add = (a,b) => a + b;
const simpleMultiply = (a, b) => {
// do something more
return a * b;
}
// IIFE : Immediately Invoked Function Expression, 함수를 묶고 뒤에 호출한다는();표현하면 호출
(function hello(){
console.log('IIFE');
})();
//fun quiz time
// function calculate(command, a, b)
// command : (add, substract, divide, multiply, remainder)
const cal = function calculate(command , a, b) {
if (command == 'add') {
return console.log(a + b);
} else if(command == 'substract'){
return console.log(a-b);
} else if (command == 'devide') {
return console.log(a / b);
} else if (command == 'multiply') {
return console.log(a * b);
} else if (command == 'remainder') {
return console.log(a % b);
}
}
cal('add', 2, 5 );
cal('substract', 2, 5);
cal('devide', 2, 5);
cal('multiply', 2, 5);
cal('remiander', 2, 5);
JavaScript
복사
