[혼공스] 4주차. 함수

const isLeapYear = (year) => {
    let flag = false;
    if (year % 4 === 0)
        flag = true;
    if (year % 100 === 0)
        flag = false;
    if (year % 400 === 0)
        flag = true;
    return flag;
}


console.log(`2022년은 윤년일까? === ${isLeapYear(2022)}`);

숙제

 

함수 개요

const tmpName = function() {
    console.log('inner code1');
};

tmpName();
typeof(tmpName);
console.log(tmpName);

이렇게 변수명에 함수를 할당할 수 있다는 것에서 많이 놀랐던 기억이 난다. C언어에선 없던 기능이라.. 자바에선 functional interface가 여기에 매칭이 된다고 볼 수 있으려나..

암튼, 익명 함수는 한번 쓰고 버리는 함수라 이름이 없고, 따라서 람다 표현식을 많이 사용한다.
반면, 선언적 함수는 함수에 이름이 있다.

const test = (str) => console.log(str);
test('hello');

윤년 계산로직

const isLeapYear = (year) => {
    boolean flag = false;
    if (year % 4 === 0)
        flag = true;
    if (year % 100 === 0)
        flag = false;
    if (year % 400 === 0)
        flag = true;
    return flag;
}

두 숫자 더하는 로직

const rangeAdd = (a,b) => {
    let total = 0;
    for (int i = a; i <= b; i++)
        total += i;
    return total;
}
rangeAdd(1,100);

최솟값 구하는 함수

const getMin = (arr) => {
    let min = arr[0];
    for (int i = 0; i < arr.length; i++) {
        if (min > arr[i])
            min = arr[i];
    }
    return min;
}

// for문의 방법
1. for const element of arr
2. for const idx in arr
3. for let i=0; i<arr.length; i++

가변 매개변수 함수 (나머지 매개변수)

가변 매개변수는 예전에 C언어로 printf를 구현할 때 사용했던 기억이 난다. 사실 그 이후로 사용한 적은 거의 없다.
자스에서 이걸 지원해준다고 한다! 진짜 오랜만에 사용하네..

가변매개변수는 배열이 생성되며, 요소들이 배열에 자동으로 담기게 된다.

const sample = (...items) => {console.log(items); };
const sample2 = (a,b, ...items) => {console.log(a,b,items); };

sample(1,2,3,4);
sample(1,2,3,4,5,);

const minByArgs = (first, ...args) => {
    let min = first;
    for (const item of args) {
        if (min > item)
            min = item;
    }
    return min;
}

function min(first, ...args) {
    let min;
    let items;

    if (Array.isArray(first)) {
        min = first[0];
        items = first;
    } else if (typeof(first) === 'number'){
        min = first;
        items = args;
    }

    for (const item of items) {
        if (min > item)
            min = item;
    }
    return min;
}

전개연산자

데이터를 배열로 갖고있을 때, 함수의 매개변수로 하나하나씩 넣어야하는 상황을 대비하기 위해, 전개연산자가 존재한다.

function temp(...items) {
    console.log(items);
}

const arr = [1,2,3,4];
temp(arr);
temp(...arr); // 전개연산자 사용

실행결과:
전개연산자를 사용x : 배열의 요소로 배열
전개연산자를 사용 : 배열의 요소로 각 원소

즉, temp(...arr) === temp(arr[0],arr[1],arr[2], arr[3]) 이렇게 된 것임.

기본 매개변수

매개변수로 들어오는 값에 default를 지정할 수 있음.

확인문제

1. 
function getRangeMultiple(a, b) {
    let result = 1;
    for (let i=a; i<= b; i++){
        result *= i;
    }
    return result;
}

2. 
const max = (arr) => {
    let output = arr[0];
    for (const item of arr) {
        if (output < item)
            output = item;
    }
    return output;
}

3.
const max = (...array) => {
    let output = array[0];
    ... 동일
}

4.
const max = (first, ...args) => {
    let result;
    let items;
    if (Array.isArray(first)) {
        result = first[0];
        items = first;
    } else if (typeof(first) === 'number') {
        result = first;
        items = args;
    }

    for (const item of items) {
        if (result < item)
            result = item;
    }

    return result;
}

함수 고급

오,,, 람다에 대해서 소개하려나봄!

콜백 함수

매개변수로 전달하는 함수.

콜백함수 활용 함수

1. forEach : 배열의 내장 함수로서 요소들을 하나씩 넘긴다.
2. map : 배열의 내장함수로서 return 값을 기반으로 새로운 배열 만듦.
3. filter

function callBackFunc(callBack) {
    for (let i =0; i <3; i++)
        callBack(i);
}

function print(i){ console.log(i); }

callBackFunc(print);
callBackFunc((i) => console.log(i));
callBackFunc(function(i) { console.log(i); })

1. forEach
const arr = [1,2,3,4,5];
arr.forEach(function(val, idx, arr) {
    console.log(`${val}, ${idx}, ${arr}`);
});

2. MAP
let mapArr =[1,2,3,4,5];
mapArr = mapArr.map((val, idx, arr) => val * val);
mapArr.forEach(console.log);

3. Filter
const arr = [1,2,3,4,5];
const evenNumber = (arr) => arr.filter(i => i % 2 === 0);
const result = evenNumber(arr);
console.log(result);

화살표함수

내가 지금까지 썼던 것. 주의할 점은 중괄호를 사용하면 반드시! return을 명시해주어야 한다.

const evenArr = arr.filter(function(i) {
    return i % 2 === 0;
});

const evenArr = arr.filter(i => i % 2===0);

[1,2,3,4,5]
    .filter(val => val % 2 === 0)
    .map(val => val * val)
    .forEach(val => console.log(val));

타이머 함수

특정 시간마다, 혹은 특정 시간이 지난 후 호출하는 함수가 존재.

1. setTimeout(함수, 시간) : 특정 시간이 지난 후 함수 호출
2. setInterval(함수, 시간) : 특정 시간 마다 함수 호출

setTimeout(() => {
    console.log('1sec TIMEOUT);
}, 1000);

let count = 0;
setInterval(()=>{
    console.log(`${count}번째`);
    count++;
}, 1000);

타이머를 종료시키고 싶으면?

1. clearTimeout(타이머ID)
2. clearInterval(타이머ID)

타이머 설정 시 나오는 return값들을 여기에 넣어주면 된다.

let count = 0;
let id = setInterval(()=>{
    console.log(`${count}번째`);
    count++;
}, 1000);

setTimeout(() => {
    console.log('clear Interval);
    clearInterval(id);
}, 5000);