Javascript 선언적/익명 함수 차이

BooKi·2022년 2월 5일
0

Javascript

목록 보기
16/46
post-thumbnail

⭐Javascript 선언적/익명 함수 차이

📕선언적 함수

function f() {
	본문
}

📗익명 함수

const f = function() {
	본문
}

익명 함수는 변수와 같기 때문에 코드가 위에서 아래로 읽어지면서 만들어 진다

let f = function(){
	console.log('1')
}
f = function(){
	console.log('2')
}
f = function(){
	console.log('3')
}
f() -> 3 출력 위에서 아래로 코드를 읽기 때문

선언적 함수는 그렇지 않다

f() -> 3 위에서부터 읽지않고 함수를 먼저 선언한 후에 실행한다
function f(){
	console.log('1')
}
function f(){
	console.log('2')
}
function f(){
	console.log('3')
}

그렇다면 선언적 함수와 익명 함수가 함께있다면 어떻게 될까

f() //함수 호출
f = function(){ //익명 함수
	console.log('1')
}
function f(){ //선언적 함수
	console.log('5')
}
f() //함수 호출
-> 5가 먼저 출력되고 1이 출력된다

즉, 선언적 함수는 무조건 적으로 전체 코드를 실행하기 전에 만들어지고

익명 함수는 코드를 하나하나 실행하면서 만들어진다

그렇기 때문에 선언적 함수와 익명 함수를 섞어서 쓰면 코드 결과 예측이 어려워진다

또한 섞어 쓰지 않더라도 선언적 함수를 사용하는 것 만으로도 결과 예측이 어렵다

그러므로 익명 함수를 쓰는 습관을 들이도록 하자

📘함수 정리 예제

let a = [1, 124, 100, 75, 35, 21, 2]

a.filter((value,index) => { //홀수만 출력
	if(value % 2 === 1)
    	console.log(`${value}, ${index}`)
})

a.filter((value,index) => { //100이하만 출력
	if(value <= 100)
    	console.log(`${value}, ${index}`)
})

a.filter((value,index) => { //4로 나눈 나머지가 0인거만 출력
	if(value % 4 === 0)
    	console.log(`${value}, ${index}`)
})

let a = ['안녕', '나는', '부기', '라고해']

forin 반복문을 forEach로 작성

a.forEach((value,index) => console.log(index)) 

forof 반복문을 forEach로 작성

a.forEach((value,index) => console.log(value))

profile
성장을 보여주는 기록

0개의 댓글