2022.09.06 Function과 ArrowFunction

1.Function이란?

 

• sub-program : 서브 프로그램이라고 부름 
• 여러번 재사용이 가능하다. 
• 프로그램 안에서 또 각각의 작은 기능을 수행 

파라미터를 받아서 

 

 

Function f: 이름을 잘 정하는 것이 중요하다.이름과 파라미터로 이 function이 하는 일을 유추할 수 있기 때문

 

처리하는 것이 function이다 : return

 

 

 

naming : doSometging, command. verb /동작, 명령어, 동사 형태로 이름을 지어줘야 한다

 

*하나의 함수는 하나의 일만 해야 한다. 

ex) createCardAndPoint를  createCard 와 createPoint로 나눈다. 

 

javaScript에서 function은 Object이다. 

 

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

파라미터(인자)를 설정해두면 인자만 바꾸어서 보다 유용하게 사용이 가능하다. 

 

log('Hello') ->출력물 Hello

 

2.Parameters

Premite  : 메모리에 value가 그대로 저장 value가 전달된다.

Object :  메모리에 레퍼런스가 저장 레퍼런스가 전달된다. 

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

 const ellie = {name : 'ellie'};

changeName(ellie) 

console.log(ellie); => name : coder

둘 다 name라는 레퍼런스는 동일하나 name가 가르키는 값을 바꾼다. 

레퍼런스는 고정이기 때문 

 

 

3.Default Parameters

fubction showMessage(message, from){
console.log(`${messahe}` by $[from}`);

}

showMessage('hi!');



fubction showMessage(message, from = 'unknown'){
console.log(`${messahe}` by $[from}`);
}
사용자가 from의 값을 지정하지 않으면 'unknown'이 기본값이 되어 출력된다.

 

 

4.Rest Parameters 

function printAll(...ares){
for(let i=0; i<args.length; i++){
console.log(args[i]);
}
}
//...은 배열 형태로 전달한다는 의미

printAll('dream', 'coding', 'ellie'); =>출력물 : dream, coding, ellie

//좀 더 간단한 문법을 사용하면 

function printAll(...ares){
for(const arg of ares){
console.log(ares);
}
}

 

 

5.Local Scope

let globalMessage='gloval'; //gloval variable

function printMessage(){
let message ='hello';
console/log(message);
console.log(message);
console.log(glovalMessage);
}

printMessage();

//밖에서는 안이 보이지 않고 안에서만 밖을 볼 수 있다. 
functopm glovalMessage안에서
console.log로 출력하면 message를 볼 수 있으나
밖에서 출력하게 되면 오류
message는 지역변수이기 때문

 

 

6.Local Scope

function sum(a,b){
return a+b; //return이 없으면 return값이 undefineddlek dlsms 생략이 가능하다. 
}

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

 

7. Early return, early exit

 

//bad
function upgradeUser(user){
if (user.point > 10){
//long upgrade logic...
}
}
//블럭 안에서 if, else를 많이 사용하면 가독성이 떨어진다. 

//good

//bad
function upgradeUser(user){
if (user.point > 10){
return;
}
//long upgrade logic...
}
//조건이 맞지 않으면 바르게 함수를 종료(return)하고
//조건이 맞을 때만 필요한 로직을 실행하도록 짠다.

 

 

8. First-class Function , Function expression, Function declaration

const print = function(){ 
// First-Class Function : Function을 객체에 할당 가능 return 값으로 받을 수 있음.
//이름이 없는 Function을 anonymous Function이라고 함. 
//이름이 있는 것을 name Function이라고 함. 

console.log(print);
};

constAgin = print;
printAgain(); //print 출력

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


//declaration : sum이 선언되기 전에도 호출이 가능하다. 
//javaScprit 엔진이 선언 된 함수를 제일 위로 올리기 때문

//express : 할당이 된 뒤 호출이 가능하다 
//아마 이름이 없고 객체에 할당을 했기 때문인듯 하다.

 

 

9. Collback function 

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

//answer 가 조건에 맞으면 불러올 함수
// true 일 경우 printYes 함수 호출
// fales 일 경우  printNo 함수 호출
// 함수를 전달하여 상황에 따라 정답인 함수를 부르는 걸 collBack 함수라고 한다. 

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

const printNO =function print(){
console.log('no');
};
//이름을 넣는 이유는 디버깅을 할 때 함수 이름이 나오게 하기 위해서
//그리고 함수 안에서 자신을 부르는 걸 리커젼이라고 함
//근대 이러면 프로그램이 죽음. 자신을 무한히 불러버려서 call stack가 전부 차버림. 

reandmQuiz('wrong', printYes, printNo); //no
reandmQuiz('love you', printYes, printNo); //yes

 

 

10. Arrow Function 

함수를 굉장히 간단하게 만들어줌 

 

const simplePrint = function(){
console.log('simplePrint!');
};
//이것을 굉장히 간단하게 만들어준다. 

const simplePrint =() => console.log('sumplePrint');
const add =(a,b => a+b;
//'=()=>'기호가 중요하다. 
//위 두개는 블럭이 없는 경우이다. 


//좀 더 복잡한 함수가 필요한 경우
const simpleMultply =(a,b) =>{
//do something more
return a*b;
};
//블럭을 쓰게 되면 return 값이 꼭 필요하다.

 

 

11.IIFE  : Immediately Invoked function Expression

선언함과 동시에 호출할 수 있다.

(function hello(){
console.log('iife');
})();

//선언과 동시에 호출하려면 함수를 괄호 ()로 감싸고 ()를 바로 붙여 호출해줘야 한다. 
//요즘에는 잘 쓰이지 않음.

 

 

12.숙제

function calculate(commend, a, b)
commend(add, substract, divide, multiply, remainder)
//더하기, 배기, 곱하기, 나누기, 나머지 를 구하는 Call Back Function을 만들어라

 

13.근황....

6시 50에 일어나서 회사

퇴근하고 7시 30분 부터 운동 

9시에 밥먹고 공부하고 블로그 정리하려니까 시간이 정말 부족하다...

 

일하는 곳은 보안 때문에 전자기기를 사용할 수 없으니

손으로 작성해봐야 겠다....