JS 함수

화살표 함수

() => {}

const doubleArrow = (x) => {
  return x * 2;
}
console.log('doubleArrow: ', doubleArrow(7));

function() {}

const double = function (x) {
  return x * 2;
}

console.log('double: ' , double(7));




const doubleArrow2 = x => x * 2;
console.log('doubleArrow2', doubleArrow2(7));





const doubleArrow3 = x => ({
  name: "jinsungadae"
});
console.log('doubleArrow3: ', doubleArrow3(7));

즉시 실행 함수(IIFE, Immediately-Invoked Function Expression)

(function () {
  console.log(a * 2);
})();




(function () {
  console.log(a7 * 2);
}());

호이스팅(Hoisting)

• 함수 선언부가 유효범위 최상단으로 끌어올려지는 현상

const a8 = 8;
double3();

function double3() {
  console.log(a8 * 2);
}

타이머 함수

setTimeout(함수, 시간)

• 일정 시간 후 함수 실행

setTimeout(function() {
  console.log('sungdae jin!');
}, 3000);

clearTimeout()

• 설정된 Timeout함수를 종료

const timer = setTimeout(() => {
  console.log('sungdae jin!');
}, 3000);

const h1El = document.querySelector('h1');
h1El.addEventListener('click', () => {
  clearTimeout(timer);
});

setInterval(함수, 시간)

• 시간 간격마다 함수 실행

const timer = setInterval(() => {
  console.log('sungdae jin!');
}, 3000);

clearInterval()

• 설정된 Interval함수를 종료

const timer = setInterval(() => {
  console.log('sungdae jin!');
}, 3000);

const h1El = document.querySelector('h1');
h1El.addEventListener('click', () => {
  clearInterval(timer);
});

콜백(CallBack)

• 함수의 인수로 사용되는 함수

function timeout(cb) {
  setTimeout(() => {
    console.log('sungdaeJIn!');
    cb();
  }, 3000);
}

timeout(() => {
  console.log('Done!');
});