김루루의 개발일기
function 함수이름짓기 (2) - javascript 0604 본문
◎ 함수 == 주석
함수를 간결하게 만들면 테스트와 디버깅이 쉬워진다. 그리고 함수 자체로 주석의 역할까지 한다.
자기설명적 코드 (self - describing) : 이름만 보고도 어떤 동작을 하는지 알수 있는 코드.
◎ 함수 이름짓기
함수 이름만 보고도 어떤 기능을 하는지 힌트를 얻을 수 있어야 한다.
함수이름 | 뜻 | ex |
show... | 무언가를 보여주는 함수. | showMessage() |
get... | 값을 반환하는 함수. | getAge() |
calc... | 값을 반환하는 함수. | calcSum() |
create... | 무언가를 생성하는 함수. | createForm() |
check... | 무언가를 확인하고 불린값을 반환하는 함수. | checkPermission() |
함수는 동작 하나만 담당해야된다.
다음은 개발자들이 흔히 하는 실수다.
- getAge() 나이를 얻어오는 동작만 해야됨. alert창에 나이를 출력해주는 동작은 이 함수에 들어가지 않는게 좋다.
- createForm() form을 만들고 이를 반환하는 동작만 해야됨. form문서를 추가하는 동작은 이 함수에 들어가지 않는게 좋다.
- checkPermission() 승인여부를 확인하고 그 결과를 반환하는 동작만 해야함. 승인여부를 보여주는 메세지를 띄우는 동작은 이 함수에 들어가지 않는게 좋다.
◎ 함수 표현식
- 자바스크립는 함수를 '특별한 종류의 값'으로 취급한다.(다른언어에서 처럼 '특별한 동작을 하는 구조'로 취급하지 않는다)
- 자바스크립트에서 함수는 값이다. 값처럼 취급할 수있다.
함수선언방식을 함수표현식으로 바꾸기
//함수 선언 방식
function sayHi(){
alert('hello');
}
//함수 표현식(function Expression)
//함수를 만들고 그 함수를 변수 sayHi에 할당한다.
let sayHi = function(){
alert('hello');
};
변수를 복사해 다른 변수에 할당하는것 처럼 함수를 복사해 다른 변수에 할당할 수 도 있다.
function sayHi(){
alert('hello');
}
let func = sayHi;
func();
sayHi();
// 주의! 변수에 복사할때
//sayHi; 함수 그자체가 복사됨.
//sayHi(); 함수 그자체가 아니라 함수 호출 결과(반환값)만 저장됨.
※ 함수 표현식 끝에 세미콜론(;)이 붙는 이유
{} 중괄호로 만든 블록 끝에는 ;이 없어도 된다.
함수표현식은 let sayHi =... ; 과 같은 구문안에 값의 역할을 한다.
모든 구문 끝에는 ;을 붙이는데 함수 표현식에 쓰인 ; 은
함수 표현식이기에 붙여진게 아니라 구문의 끝이기 때문에 붙여진 것이다.
'프론트엔드 > Javascript' 카테고리의 다른 글
function 함수/return반환값 (1) - javascript 0604 (0) | 2021.06.13 |
---|---|
if 조건문 / 연습문제 - javascript 0603 (0) | 2021.06.13 |
switch문 - javascript 0602 (0) | 2021.06.13 |
for 반복문 / break/ continue 연습문제 풀기 - javascript 0601 (0) | 2021.06.13 |
Comments