함수 선언문
-
함수 내부에서 return키워드가 나오면 그 함수는 중단된다.
-
함수를 선언할때 리턴문을 따로 작성하지 않으면 undefined값을 리턴한다
-
return은 함수를 실행하고 어떤 값을 돌려주는 것이고 console.log는 콘솔창에 어떤 값을 출력해주는 함수이다.
함수 / 함수 호출
프로그래밍의 가장 기본적인 단위는 함수이다. 긴 프로그램을 기능별로 나눠 여러 함수로 나누어 작성하면 모듈화로 전체 코드의 가독성이 좋아지고, 기능별(함수별)로 수정이 가능하므로 유지보수가 쉽다. 함수를 호출할 때 괄호 안에 적는 것을 매개변수라고 하고 이것이 함수의 입력값이다. 함수의 최종 결과는 함수 내부에 return 키워드를 입력하고 뒤에 값을 넣어서 생성하며 리턴값이라고 부른다.
호출할 때 매개변수의 개수가 고정적이지 않은 함수를 가변 매개변수 함수라고 부르며, 이러한 함수를 구현할 때는 나머지 매개변수(rest parameter)라는 문법을 사용한다. 함수의 매개변수 앞에 마침표 3개(...)를 입력하면 매개변수들이 배열로 들어온다. 배열을 전개해서 함수의 매개변수로 전달해주는 전개 연산자(spread operator)는 배열 앞에 사용한다. arguments는 유사 배열객체이고 rest는 배열이다. 유사 배열 객체는 간단하게 순회가능한(iterable) 특징이 있고 length 값을 알 수 있다. 즉, 배열처럼 사용할 수 있는 개체이지만 유사 배열 객체이기 때문에 Array 오브젝트의 메서드를 사용할 수 없다. 따라서 arrow function에 arguments는 사용할 수 없고 rest parameter를 사용할 수 있다.
//rest parameter
function 함수 이름(...나머지 배개변수){} //숫자를 넣으면 배열로 출력
//spread operator
function 함수이름(...배열){} // 숫자 하나하나가 출력됨 //사용 되지않으면 [Array(4)]로 출력
}콜백함수
자바스크립트는 함수도 하나의 자료형으로 매개변수로 전달할 수 있고 매개변수로 전달하는 함수를 콜백함수라고 한다. 즉, 매개변수를 통해 함수를 받고 그 함수를 통해 결과값을 호출한다.
함수를 만들면 주소값(reference)가 생성된다. 그래서 함수를 다른 함수의 인자로 전달 했을 때 그 주소값을 복사해 담아오기 때문에 같은 함수의 기능을 수행하고, 이때 함수의 매개변수(parameter)가 필요하다면 괄호안에 꼭 써주어야 정상적인 출력이 이루어진다.
function add(num1, num2){
return num1+num2;
}
function surprise(callback){
const result = callback(2,3);
console.log(result);
}
surprise(add); function callThreeTimes(callback){
for (let i = 0; i<3; i++) {
callback(i)
}
}
//익명함수로 선언
callThreeTimes(function (i) {
console.log(`${i}번째 함수 호출`)
})- 콜백함수를 활용하는 함수: forEach(), map(), filter()
호이스팅(Hoisting)
함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것을 말한다. 함수의 유효범위는 함수 블록{} 내부이다. 자바스크립트 Parser가 함수 실행 전 해당 함수를 한 번 훑고 함수 안에 존재하는 변수/함수선언에 대한 정보를 기억하고 있다가 실행시킨다.
입력받은 나머지 인수 저장 함수
- Arguments
자바스크립트 함수는 선언한 파라미터보다 더 많은 인자를 보낼 수도 있다. 이때 넘어온 인자를 arguments로 배열의 형태로 하나씩 접근할 수가 있다. arguments는 배열타입은 아니다. 따라서 배열의 메서드를 사용할 수가 없다.
자바스크립트의 가변인자를 받아서 처리하는 함수를 만들때 등에서 arguments속성을 유용하게 사용할 수가 있다.
#해볼만한 것(1~무한대까지 인자를 받아 합을 구하는 함수를 만들어보자)
- 스프레드 연산자 vs Rest(...)
arrow function
간단하게 함수를 선언할 수 있는 문법으로 가독성이 좋다.
function getName(name) {
return "Kim " + name ;
}
//위 함수는 아래 arrow함수와 같다.
const getName = (name) => "Kim " + name;파라미터/인자
- 파라미터(Parameter)는 함수 내부에 있는 인자로 함수를 호출할 때 전달되는 인자(argument)의 값이 변수에 담기게 된다. 매개체 역할을 하므로 매개변수라고도 한다.
- 인수(Argument)는 함수를 호출할 때 전달하는 값을 의미하고 전달인자라고도 한다.
반환값
return으로 함수의 반환값을 얻을 수 있다.
return 명령문은 함수 실행을 종료하고 반환값을 함수 호출 지점으로 반환한다.
네이밍 컨벤션
여러 사람이 협업할 때 가독성이 좋게 하기 위해 정한 프로그래밍 스타일에 관한 가이드라인을 코딩 컨벤션(Coding Convention)이라고 한다. 코딩 컨벤션은 네이밍 컨벤션, 주석 컨벤션, 들여쓰기 컨벤션으로 이루어져있다. 그 중 네이밍 컨벤션은 소스 코드와 문서에 있는 변수 이름, 타입, 함수 등의 식별자에 사용되는 문자열을 선택하기 위한 여러가지 규칙을 말한다.
- 변수
- 알파벳으로 시작하는 명사
- lowerCamelCase
- 함수
- 동사 또는 동사구문
- lowerCamelCase
- default export할 때는 camleCase
- 라이브러리를 export할 때는 PascalCase
- 객체
- key와 value의 공통적인 특성을 나타낼 수 있는 명사
- lowerCamelCase
- export할 때는 PascalCase
- 클래스
- 명사 또는 명사구문
- PascalCase
- export할 때는 PascalCase
null과 undefined
- 둘다 '값이 없다'는 것이지만 null은 값이 없다는 것을 의도적으로 표현할 때 사용하고 undefined는 코드를 실행하면서 값이 없다는 것을 확인할 때 사용된다.값이 주어지지 않은 변수에는 기본적으로 undefined값을 가지고 있다. 선언한 다음 값을 정해주지 않았다는 것을 의미한다.
