JS / 01 / 기초-8

✅ JS 함수

• 특별한 목적의 작업을 수행하도록 설계 된 '독립적인 블록'
  1) 코드의 재사용이 좋다
  2) 유지보수가 편리해진다

---

[ ❗ ] 전역함수, 지역함수

전역함수 : 전체 범위에서 접근,활용 가능한 함수
지역함수 : 특정 범위에서 접근,활용 가능한 함수


전역함수와, 지역함수 범위를 잘 구분하자 ^^.

---

✔️ 함수 표현의 다양한 방법들

ⓐ 매개변수 없이, 호출
ⓑ 매개변수 있이, 호출
ⓒ 매개변수 2개, 호출
ⓓ 매개변수 2개 + 변수 할당 후 + 호출

---

✅ JS 함수표현식 ⭐⭐

• 익명함수를 사용해 변수에 할당하는 방식
• 함수는 주로, 상수(const)를 사용해서 지정한다.

[ ❗ ] 익명함수 : 함수명 없이, 바로 변수에 할당하는 함수
함수명,변수 둘 다 없이 쓰기도 함 ▶ 이벤트 속성에 바로 화살표함수 구현시

[ ❗ ] 상수 const

• 재할당 ❌
• 재선언 ❌

---

---

✅ JS 화살표함수 ⭐⭐

• ECMA6에 도입 된 함수의 표현식을 간소화 한 함수

• function 키워드가 생략 됨

• 매개변수가 1개일 경우, 소괄호 생략 가능

• {} 내 하나의 문장이며,
  반환(return)해야 하는 값인 경우 👉 return과 {} 생략가능

---

✔️ 화살표함수 표현의 다양한 방법들

• 개발자마다 스타일이 달라서, 다양하게 표현 된다고 함 . .🥵
  
  

ⓐ 기본 : const 변수 = (매개변수) => {명령어 ;}

ⓑ 매개변수 소괄호 생략 : const 변수 = 매개변수 => {명령어 ;}

ⓒ 리턴값 有 : const 변수 = (매개변수) => {return 명령어 ;}

ⓓ 리턴값,{}생략 : const 변수 = (매개변수) => 명령어 ;

---

풀어쓰는 함수의 변화

1️⃣ function 함수명(매개변수) {
로직
}

실행시 : 함수명(매개변수)

" 아 뭔가 귀찮다.. 변수에 할당도 해야하는데 또 줄 써야하고.."
" 어차피, 변수에 대부분 할당하니까, 함수명이 굳이 필요한가?..."


2️⃣ ⭐️함수표현식⭐️ 등장 !!
const 변수명 = function(매개변수) {
로직
}

실행시 : 변수명(매개변수)

" 아 바로 하니까 편하다 ㅋㅋ 근데 function 이거 계속 타이핑 해야하나.."
" function을 지우고 함수라는걸 화살표 기호로 표현해볼까?"


3️⃣ ⭐️화살표함수⭐️ 등장 !!
const 변수명 = (매개변수) => {
로직
}

실행시 : 변수명(매개변수)

" 와 ㅋㅋ 진짜 편하다 !! "
" 좀 더 유도리 있게 할 수 있도록 생략 할 수 있는것들을 넣어볼까?! ㅋㅋ"

1) 매개변수가 1개뿐이면 소괄호 생략해도 된다
2) {} 내에 1줄에, return 있으면 이거 둘 다 생략해도 된다

" 어우 편해 ㅋㅋ 굿 !! ^.^b"