특정한 동일한 작업을 여러번 수행하기 위해 같은 코드를 여러번 표현하는 것은 불필요한 일이다.
그래서 함수(function)란 하나의 로직을 재실행 할 수 있도록 하는 것으로 코드의 재사용성을 높여준다.
1. 함수 선언
: 함수는 사용하기 전에 미리 선언해두어야 한다..
function () {}- 기본적인 함수를 정의하는 방법이다.
- 그러나 이렇게 선언해서는 이 함수에 접근하는 것이 어려워진다.
그렇기 때문에 이 함수를 변수에 담아함수 이름을 만든다.
: 변수에 담아보았다.
var 함수이름 = function () {}- 이 말은 자바스크립트에서 함수 그 자체는 변수에 담을 수 있는
값에 해당한다는 것 - 이렇게 만들어진
함수이름은함수표현식을 통해 조금 더 쉽게 표현할 수 있다.
: 함수의 표현식은 아래와 같이 선언 한다.
function 함수이름() {
console.log('Hello, World!'); //output: 'Hello, World!'
}- 형식 :
function함수이름(파라미터){코드}.
2. 함수 호출
: 함수 선언은 그저 함수의 존재를 정의 내리는 것이다.
함수를 호출해야 코드를 실행할 수 있게 되는 것이다.
호출하는 방법은 아래와 같다.
function greetWorld() {
console.log('Hello, World!');
}
greetWorld();- 함수의 호출은 함수이름 뒤에
()괄호를 붙여 입력한다.
3. Parameters, Arguments (파라미터, 인수)
: 함수를 선언할때 input이 필요한 함수도 있다. 그때의 input을 넣을 위치를 파라미터라고 한다.
function sayThanks(name) {
console.log('name');
}
sayThanks('Cole')- 함수를 선언할 때 'name'은
파라미터이다. - 함수를 호출할 때 'Cole'은
인수다.
1) 디폴트 Parameter
: (ES6에서 생긴 기능) 함수를 선언할때 파라미터에 미리 인수 값을 지정해둘 수 있다.
function greeting(name = 'stranger') {
console.log(`Hello, ${name}!`)
}
greeting('Nick') // Output: Hello, Nick!
greeting() // Output: Hello, stranger!- 인수를 지정하면 입력한 값으로 표현된다.
- 인수를 지정하지 않으면
디폴트 파라미터값으로 표현된다.
2) 함수 Parameters
: JavaScript에서는 함수도 객체다. 다시 말해서 일종의 값이다.
때문에 함수 그 자체를 다른 함수의 인수로 받아들일 수 있다.
const timeFuncRuntime = funcParameter => {
let t1 = Date.now();
funcParameter();
let t2 = Date.now();
return t2 - t1;
}
const addOneToOne = () => 1 + 1;
timeFuncRuntime(addOneToOne);- 인수로 전달할 때, 함수를 호출
()하지 않는다. - 함수를 인수로 받을 경우 함수 내부에서 함수를 호출
()시켜주어야 한다.
5. 헬퍼 함수
: 함수의 Return된 값을 활용해서 다른 함수에 도움을 주는 함수를 Helper Function이라고 한다.
function multiplyByNineFifths(number) {
return number * (9/5);
};
function getFahrenheit(celsius) {
return multiplyByNineFifths(celsius) + 32;
};
getFahrenheit(15); // Returns 59multiplyByNineFifths는Helper Function이다.
6. 익명 함수
: 우리는 함수를 사용하기 위해 함수를 선언한 후 그 함수를 어떤 변수에 담았다.
그 변수의 이름이 함수의 이름이 되었다.
이런 함수 이름 없이 일회용으로 사용하는 방법도 있다.
function 함수명 () {} // 일반적인 함수 선언 방법
(function () {})() // 익명 함수 선언 및 호출 방법- 함수를 변수에 담지 않고 함수 전체를 브라켓에 담아 그대로
()실행시킨다.
7. First Class Citizen (1급 시민)
: 1급 시민의 조건은 아래와 같다.
- 변수(variable)에 담을 수 있다.
- 인자(parameter)로 전달할 수 있다.
- 반환값(return value)으로 전달할 수 있다.
= avaScript의 함수도 객체로써 관리되므로 1급 객체라고 볼 수 있다.
동시에 JavaScript의 함수는 1급 함수의 조건도 만족한다.
1) Functions as Data
: 함수를 변수에 할당할 수 있고, 그것을 또 새로운 변수에 재할당 할 수 있다.
const busy = announceThatIAmDoingImportantWork;
busy();- 함수명이 불필요하게 긴 경우 새로운 변수에 담을 수 있다.
console.log(is2p2.name)- .name 이라는 Property를 사용하면 원래 변수명을 알 수 있다.
2) Call Back Function
: 콜백함수란 함수의 인자가 되어 그 함수의 동작을 완전히 바꿔주는 함수를 의미한다.
- 함수 그 자체가
값이 될 수 있기 때문에 다른 함수의인자로 전달받을 수 있다.
function sortNumber(a,b){
// 위의 예제와 비교해서 a와 b의 순서를 바꾸면 정렬순서가 반대가 된다.
return b-a;
}
var numbers = [20, 10, 9,8,7,6,5,4,3,2,1];
alert(numbers.sort(sortNumber)); // array, [20,10,9,8,7,6,5,4,3,2,1]- 여기서 sortNumber라고 하는
값으로써 전달되어sort라고 하는 함수의 동작 방식을 바꾼다.
3) Return Value Function
: 함수는 함수의 리턴 값으로도 사용할 수 있다.
function cal(mode){
var funcs = {
'plus' : function(left, right){return left + right},
'minus' : function(left, right){return left - right}
}
return funcs[mode];
}
console.log(cal('plus')(2,1));.jpg)