각 object들이 같은 key:value를 가졌어도, 다른 뿌리로 여겨져서 서로 다른 object로서 메모리에 저장되듯이,
object는 특정하게 매겨진 뿌리, 원산지 reference로 함수에 전달되어진다.
숫자, 문자 같은 경우는 간단하니 패스하고, 인자에 object 객체 자체를 넣을 때와 함수를 넣을 때를 생각해보자.
object parameter의 예시 1 - 객체를 함수에 넣을 때 (객체.key로 key를 써서 객체 안의 데이터값을 불러온 거 기억하기..)
function changeName(obj){
obj.name = "cat";
} // 객체의 key(name)의 value를 cat으로 해라. 라는 기능을 가진 함수 선언
const hoochu = {name:'hoochu'}; // 'hoochu'라는 객체를 선언함
changeName(hoochu); // hoochu 객체를 인자로 가져와 함수를 호출한다.
console.log(hoochu); // 화면에서 결과를 보려면 함수를 출력해야지
출력물 : {name: 'cat'}
object parameter의 예시 2 - 함수 자체를 함수에 넣을 때
function add(a,b){
let sum = a + b;
return sum;
}
add(1,2);
add 라는 함수부터 만들었고, 이 add 함수를 다른 함수에 인자로 전달해보자.
function doSomething(add){
console.log(add)
}
doSomething(add)
이 때, 주의할점은, 함수를 인자로 넣을 때 add( ) 를 넣으면 doSomething(add())를 넣으면, add()의 return값인 sum이 호출되야하는데, 인자 a,b가 값이 들어가지 않은 빈 상태이므로, sum = NaN이 나오고 이 NaN이 doSomething함수로 들어가서 최종 출력은 NaN이 나온다. 따라서, 함수 자체를 인자로 전달할 땐 함수의 이름만 넣을 것. add()가 아닌 add만 넣기
본론으로 돌아와서, doSomething(add)는 아래와 같이 함수 자체가 출력된다.
이 때, 전달받은 add라는 함수를 이용해서 뭔가를 하고 싶다면, 인자를 넣은 add 함수를 변수로 선언하고 -> 변수를 출력해주면 -> add 함수가 작동해서 3이 출력됨
function doSomething(add){
console.log(add)
const result = add(1,2); // 받아온 인자를 할당해주고
console.log(result) // 출력까지 해주기
}
doSomething(add)
혹은, 그냥 간단하게 doSomething 함수에 인자값을 넣은 add()를 넣어줘도 출력됨
아 그런데, 매개변수, 전달인자는 같은 것 같지만 사알짝 다른 개념인듯하여 정리해보았다.
매개변수 (parameter) vs. 전달인자 (Argument)
매개변수 (parameter)
전달인자 (Argument)
함수를 정의,선언할 때 나열하는 변수
함수를 호출할 때 전달되는 실제 값
들어가는 값 : variable (변수)
들어가는 값 : value (값)
ex) 함수 정의할 때 사용되는 a,b가 매개변수
ex) 함수를 호출할 때 함수 자체에 넣어주는 1,2가 전달인자
4. return 예약어
return의 기능
#1. 함수라는 작은 프로그램안에서 어떤 값을 되돌려주는 output의 역할
즉, 함수 내부의 내용을 저장해놨다가 외부에서 사용하게 해주는 역할
#2. 함수를 종료해주는 기능
: 코드블럭 안에서 return이 중간에 나오면, return 줄에 있는 연산을 실행하고 그 결과물을 반환 해주고
그 이후 코드 블럭에 있는 코드들은 무시한채 함수의 실행을 종료 시키고, 그 함수를 호출했던 지점으로 돌아간다.
즉, return 뒤에 있는 코드들은 실행되지 않기 때문에 dead code라고 하니까 되도록 넣지 말자.
근데,
나는 return과 console.log가 정말 헷갈렸고 드디어 이해했다.. 정리를 해놔야겠다.
return vs. console.log
#1. function내부에 console.log를 쓴 경우
function printOut(a,b){
console.log(a*b);
}
PrintOut(3,2);
console.log 라는 출력문이 있기 때문에 바로 ! 6 이 출력되어 화면상에 찍힌다.
#2. function 내부에 return 을 쓴 경우
function returnOut(a,b){
return a * b;
}
returnOut(3,2);
returnOut이라는 함수 내부에서 3 x 2를 하기만 하고 return이 함수를 종료해버린다. 즉, 출력은 못한 채로 저장만 해둔 상태이다.
function returnOut(a,b){
return a * b;
}
returnOut(3,2);
console.log(returnOut(3,2));
이 때, console.log로 출력하는 기능을 써주면, 드디어 6이 출력되고 화면상에 나오게 된다.
하지만, 그렇게 단순하게 생각해서는 안되는 부분인 걸 깨달았다. printOut 함수는 return문이 없고, 단순히 console.log로 출력하는 함수다. 즉, 화면상에 출력물이 보이긴 하지만, 실상 6이라는 숫자가 그 코드 안에서만 출력해버리고 저장은 못해준다. 값을 담고 있지 않다. return이 없는 함수들은 내부에 return undefined 가 들어있는 것과 마찬가지로 생각해도 된다.
