일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- 명령어
- it
- 순서 보장
- Intellij
- #{..}
- Java
- 개발시작전 자세
- select
- 타임리프와 스프링
- 추천 사이트
- 스프링부트
- 프로젝트 클린
- 타임리프
- 룸북
- 함수 인자값 id
- linux
- cmd
- StringUtils.hasText
- JSON
- 시퀀스 조회
- 리눅스
- 설정
- BindingResult
- 하모니카 OS 5
- 다른사람 프로젝트 수정전 가져야할 자세
- Test 룸북 사용하기
- 비밀번호 변경 명령어
- js
- 추천 프로그램
- 자바스크립트 인라인
Archives
- Today
- Total
웹개발 블로그
[JS] 함수, 함수 표현식, 화살표 함수, 콜백함수 본문
#함수
- 함수를 호출하면서 전달하는 값 : 인수
- 매개체 역할을 하는 변수 : 매개변수
ㄴ '함수의 매개변수'라고 부른다.
함수 안에서 return을 사용하게되면
ㄴ '반환값' 이라 부른다.
ㄴ 함수의 return문 아래에는 작성해도 작동하지 않는다.
함수안에 내부함수를 작성할 수 있다.
ㄴ '중첩함수'라 부른다.
function a(){
function aa(){} //중첩함수
aa();//호출
}
선언이 이루어진 함수를 호출하면 오류를 내지만
⭐자바스크립트의 특징 중 호이스팅(끌어올리다) 특징 때문에 오류를 내지 않는다.
ㄴ함수를 호출 문 보다 아래 두어도 문제가 일어나지 않는다.
ㄴㄴ 프로그램에 유연성을 준다는 특징이 있다
자바스크립트에서는 함수도 문자열이나 숫자 같은 값으로 취급된다.
ㄴ 그래서 함수자체를 인수로 사용할 수 있는거다. 아래 함수를 살펴보자.
1. 함수 표현식
값으로서 함수를 표현하는 방식
ㄴ 콜백함수에 유용하게 사용된다.
let varB = function () {
console.log("funcB")
}
varB(); // 함수 표현식으로 만든 함수는 호이스팅이 이뤄지지 않는다.(값으로 취급되지 때문에)
2. 화살표 함수
let varC = () => { return 1;}
=
단, 반환값만 있을경우(추가적인 작업이 있다면, 중괄호{}를 사용하자)
let varC = () => 1;
let varC = (value) => value + 1;
varC();
3. 콜백함수
ㄴ 자신이 아닌 다른 함수에, 인수로써 전달된 함수를 의미 함.
ㄴ 쉽게말하면 매개변수인 함수의 순서를 나중에 호출시키게 하려는거야.
함수를 인자로 넣어준다.
function main(value){
console.log("start"); //순서1
value(); //순서2
console.log("end"); //순서3
}
function sub(){console.log("sub")}
main(sub);//함수를 main함수의 인자값으로
ㄴ이걸 callback 함수라 부른다.
=
main( () => { console.log("i am sub"); });
콜백?
= 뒷전에 실행되는, 나중에 실행되는
콜백함수 활용 예제
function repeat(count, callback) {
for( let idx = 1; idx <= count; idx++) {
callback(idx);
}
}
repeat(5, (idx) => {
console.log(idx)
});
=
repeat(5, function (idx) {
console.log(idx)
});
'◆React.js & Next.js & Node.js > JavaScript' 카테고리의 다른 글
[JS] 비동기 작업 처리하기2 - Promise (JS 내장객체) (1) | 2025.01.26 |
---|---|
[JS] 비동기 작업 처리하기1 - 콜백함수 사용하여 처리 (0) | 2025.01.21 |
[JS] 스프레드(Spread) 연산자? (1) | 2025.01.21 |
[JS] (배열/객체) 구조 분해 할당 (0) | 2025.01.21 |
[JS] (⭐)모듈 시스템이란? (+ ES 모듈 시스템) (0) | 2024.12.31 |