일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
- unity
- STR
- Python
- docker
- if문
- 제이쿼리
- jquery
- 자바
- js
- 자바스크립트
- 문자열
- 메소드
- Numpy
- 라이브러리
- 코딩학습
- JAVA Script
- Coding
- javascript
- 게임개발
- 도커
- 객체
- 파이썬
- 코딩연습
- 숫자형
- 유니티
- 코딩공부
- 딥러닝
- object
- 선형대수학
- 코딩
- Today
- Total
잇뉴얼 (IT_Manual)
[JavaScript] 자바스크립트 함수 선언과 호출 본문
[JavaScript] 자바스크립트 함수 선언과 호출
코드들의 집합을 '함수'라고 합니다. 변수에 값을 할당하는것 처럼, 함수안에도 코드를 작성해놓고, 계속 사용할 수 있게 만드는데요. 함수를 선언하는 방법과 호출하는 방법을 다뤄보겠습니다.
▶ 함수 선언
function 함수명(매개변수들...) {
// 이 함수에서 실행할 코드들 작성
return 반환값
}
함수 구성 | 설명 |
함수명 | 사용자가 원하는 이름을 지정할 수 있다. 단, 예약어로 지정된 이름은 사용할 수 없습니다. |
매개변수들 | 함수 밖에서 함수안으로 특정 값을 넣고 싶을때 사용 |
코드 | 함수 안에 다양한 코드를 작성해 원하는 결과값을 만들어냄 |
return | 코드가 다 끝나고 함수를 호출한곳에 값을 보내주는 역할 |
함수를 선언할려면, 'function'으로 시작을 합니다. 그리고 이 함수에 대한 이름을 작성하게됩니다. 변수로 따지면 'let 변수명'과 비슷하다고 생각하면 됩니다. 다만, 함수의 경우, 코드들을 작성하여, return을 통해 결과를 반환하거나, 다른 방식으로 함수를 사용할 수 있습니다.
function sum(a,b) {
let result = a + b
return result
}
위의 코드를 보면 function을 사용해 함수를 선언하고, sum이라는 함수명을 작성했습니다. 그리고 매개변수는 a,b를 작성해놓았습니다. 함수안의 코드를 보면, 변수 result를 선언한 다음, 외부에서 받아온 매개변수 a와 b를 더해 할당했습니다. 그리고 호출한 곳에 결과값을 반환하기 위해 return을 사용해 result안에 있는 값을 내보내주게됩니다. 허나, 이 코드는 어디서도 호출한 곳이 없기에, 아무런 작동을 하지 않습니다. 이 코드를 작동시키기 위해서는 함수를 호출해야됩니다.
▶ 함수의 호출
function sum(a,b) {
let result = a+b
return result
}
let call_fun = sum(1,2)
console.log(call_fun)
// 터미널 결과값 : 3
함수를 선언한 다음, 아래쪽을 보면, call_fun이라는 변수를 선언하였습니다. 여기에 아까 작성한 함수 sum에 매개변수 2개를 지정했으니, ' 1,2 '의 값을 넣도록 하겠습니다. 그리고 call_fun변수를 출력해보면 '3'이라는 결과값을 확인할 수 있습니다.
참고
function sum(a,b) {
let result = a+b
return result
}
let call_fun = sum(1,"2")
console.log(call_fun)
console.log(typeof(call_fun))
// 터미널 출력 결과값
// 12
// string
참고로 자바스크립트의 경우 변수의 타입을 따로 지정하지 않기 때문에, 매개변수에 어떤 값이 들어가냐에 따라, 반환되는 결과물의 타입이 달라질수 있습니다. 데이터 타입을 잘못입력하게 될 경우, 해당 함수는 에러가 발생하지 않겠지만, 함수를 호출한 곳에서 에러가 발생할 수 있으니, 데이터 타입을 잘 생각합시다.
'Coding > JavaScript' 카테고리의 다른 글
[JavaScript] 자바스크립트 배열 (Array) (0) | 2022.06.01 |
---|---|
[JavaScript] 자바스크립트 클래스와 객체 (0) | 2022.06.01 |
[JavaScript] 자바스크립트 반복문 (0) | 2022.06.01 |
[JavaScript] 자바스크립트 조건문 (0) | 2022.05.31 |
[JavaScript] 자바스크립트 연산자 (0) | 2022.05.31 |