while 반복문 - 조건을 중심으로 반복할 때
for 반복문 - 횟수를 중심으로 또는 배열 등을 중심으로 반복할 때 사용
그런데익명 함수와 선언적 함수는 사용하는 상황이 비슷함
편하고 손에 익은 걸 사용하면 되는데, 최근에는 안전 등의 이유로 많은 개발자가 익명 함수를 선호하는 편
왜 익명 함수가 안전하다고 하는 걸까?
어떤 차이가 있기에?
익명 함수
익명함수 -> 순차적인 코드 실행에서 코드가 해당 줄을 읽을 때 생성됨
따라서 다음과 같은 코드가 있다면 위에서 아래로 차례대로 코드가 실행되면서 익명함수라는 변수에 '2번째 익명 함수입니다.'를 호출하는 함수가 할당됨
let 익명함수
익명함수 = function () {
console.log('1번째 익명 함수입니다.')
}
익명함수 = function () {
console.log('2번째 익명 함수입니다.')
}
익명함수()
//출력: 2번째 익명함수입니다선언적 함수
선언적 함수는 순차적인 코드 실행이 일어나기 전에 생성됨
따라서 선언적 함수는 같은 블록이라면 어디에서 함수를 호출해도 상관없음
다음 코드와 같이 선언적 함수를 생성하기 전에 함수를 호출해도 함수가 이미 생성된 상태이므로 아무 문제 없이 실행됨
선언적 함수() //호출! 테스트를 위해 생성 전에 입력해본 것
function 선언적 함수 () {
console.log('1번째 선언적 함수입니다.')
}
function 선언적 함수 () {
console.log('2번째 선언적 함수입니다.')
}
//출력: 2번째 선언적 함수입니다.선언적 함수도 입력한 순서대로 생성되고 같은 이름이라면 덮어쓰므로 코드를 실행했을 때 "2번째 선언적 함수입니다."를 출력하는 모습을 볼 수 있음
선언적 함수와 익명 함수의 조합 상황
두 가지 상황이 조합된 경우에는 선언적 함수는 먼저 생성되고, 이후에 순차적인 코드 진행을 시작하면서 익명 함수를 생성
//예시
//익명 함수를 두 번 생성
함수 = function () {
console.log('익명 함수입니다.')
}
//선언적 함수를 두 번 생성하고 할당함
function 함수 () {
console.log('선언적 함수입니다.')
}
//함수를 호출
함수()익명함수는 코드를 읽을 때와 '같은' 순서로 함수가 선언되지만
선언적 함수는 코드를 읽는 순서와 다른 순서로 함수가 선언됨
따라서 함수를 같은 이름으로 덮어쓰는 건 위험한 일이기에 안전하게 사용 가능한 익명 함수를 선호
블록이 다른 경우 선언적 함수의 사용
<!DOCTYPE html>
<html>
<head>
<title></title>
<script>
선언적함수()
function 선언적함수 () {
console.log('1번째 선언적 함수입니다.')
}
</script>
<script>
function 선언적함수 () {
console.log('2번째 선언적 함수입니다.')
}
</script>
<script>
선언적함수()
</script>
</head>
<body></body>
<!-- 출력: 1번째 선언적 함수입니다. \n 2번째 선언적 함수입니다. -->블록이 나눠진 경우에 선언적 함수의 실행 흐름을 예측하는 것이 훨씬 힘들어짐
다른 프로그래밍 언어들은 일반적으로 선언적 함수 형태로 함수를 많이 사용하지만, 자바스크립트는 이처럼 블록이 예상하지 못하게 나뉘는 문제 등이 발생할 수 있어 익명 함수를 더 많이 사용
과거 자바스크립트는 var 키워드를 사용하여 변수를 선언했지만 이것은 전역 변수이므로 덮어쓰는 문제가 발생. 따라서 모던 자바스크립트는 let 키워드와 const 키워드를 이용해 변수와 상수를 선언하고 위험을 원천적으로 차단하기 위해서 오류를 발생시킴
차이를 명확하게 구분하면서 공부하는 것이 필요하다 !! 대충 알고 넘어가면 나중에 헷갈리거더라거,,
