자바스크립트 함수

누가 그러던데, 코딩을 하다보면 "나 왜 이걸 모르지, 바보인가?"와 "역시 난 천재인가?"를 무한 반복한다고 그러더라... 물론 나도 그랬다.

최근 클론코딩을 진행하다가, 아무리 시도해도 js가 적용이 안되길래 뭐가 문제인지 찾아봤다.

계속해서 프로퍼티가 null이라고 뜨길래 기본적인 코딩도 먹히지 않았다.
알고보니 body태그 하단에 스크립트를 적용해야한다고 했다.
html이 로드되기 전에 자바가 실행되는 형태로 적용해뒀기 때문에 이같은 현상이 생겼던 것이다.

아무튼 위치만 옮겨 적어도 오류를 해결할 수 있었던 것에 모르는 부분이 아니여서 다행이였다. 그런데 계속 이런 문제를 마주할 것 만 같다는 생각에, 기초를 제대로 잡아야겠다고 다짐했다.

그렇게 평소 어렵게 생각하던 자바의 함수 선언 호출, 인자 구성에 대해 다시 한번 공부했다.

함수

함수는 어떤 언어에서든 딱 2가지가 가장 중요하다.

1. 함수 선언
2. 함수 호출

이것만 잘해줘도 반은 먹고 들어간다고 한다.

이 두가지를 간단하게 살펴보면 다음과 같다.

<script>
    // 함수 선언
    function hi() {
        console.log("안녕")
    }
    
    //함수 호출
    hi();
</script>
>>> 안녕

여기에 함수 선언에도 계산을 종료하는 함수가 있고,
인자를 전달하는 함수가 있다고 한다.
바로 return이다. 예전엔 이 리턴에 대해서 잘 몰랐는데, 이젠 확실히 잡고 가야겠다.

<script>
    // 함수 선언
    function hi() {
        const result = add(2,4)
        console.log(result)
    }
    // 인자 전달
    function add(a,b) {
        return a + b;
    }
    
    //함수 호출
    hi(add);
</script>
>>> 6

물론 더 쉬운 방법도 있지만, 이렇게 코드를 구성한 이유는
리턴한 값을 어떻게 옮기는지 알수 있기 때문이다.

함수 인자

자바에서 함수를 구성할땐

function 함수이름 (인자1 ,인자2){
	코드블록
}

이렇게 많이 쓰인다. 여기서 인자에 많이 무너지는 경우가 많은데,
도대체 왜 인자1, 인자2 이렇게 쓰는건지 이해가 되질 않았다.

그런데 알고보니 그냥 이름표같은 거라 생각하면 이해가 쉬웠다. 변수와 같이 임의로 데이터 타입에 상관없이 이름을 붙여주는 것이다.
타입스크립트에서는 예를 들어 인자1: number 이런식으로 표기해주기 때문에, 인자 1이 숫자를 받는 구나를 알 수 있는데,

자바스크립트를 공부한지 얼마 안된 입장에선, 데이터타입도 없이 이름만 달랑 있으니, 엄청난 코드처럼 보이는 것이 당연지사다.

그리고 ref 개념을 적용하면 이는 더욱 명확해진다.

함수는 선언시 컴퓨터 메모리 어딘가에 공간을 내주고 함수가 들어갈 자리가 만들어진다고 한다.

즉, add라는 함수를 만들 경우, 메모리상에는 add라는 방이 만들어지는데 이 방의 주소를 ref(레퍼런스)라고 한다.
그래서 함수를 불러올땐 컴퓨터가 이 주소를 찾아보고 함수를 실행한다고 한다.

<script>
function add(a,b) {
	return a+b;
}

function example(wow){
	const result = wow(2,3);
    console.log(result);
}

example(add);
</script>
>>> 5

example이 실행될때, add함수를 인자로 받는다.

// 참고로 함수 이름만 넣어도 인자로 받을 수 있다, 굳이 ()를 함께 안넣어도 된다.//

더 정확하게 말하면 add의 ref 주소를 받게 된다.
호출 코드의 add 인자와
example의 선언 코드에서 wow가 가리키는 ref는 결국 똑같은 셈이다.

이름표만 다를뿐, 서로 같은 주소를 향하고 있어, 매끄럽게 흘러갈 수 있다. 여기에 wow(2,3)이 들어가며 a+b의 자리를 2와 3이 대신 잡아주는 것이다.
즉 add= wow다.

함수를 전달하는 것은 Ref가 전달되는 것과 같다는 것을 항상 기억하고 있자.