함수표현식 함수선언문 화살표함수

함수표현식

변수에 대입해 사용하는 이름없는 함수
객체로 호출, 한번만사용 여러번사용시 변수 안에 넣어사용

 한번만 사용은 event버튼눌렸을때 어떤 이벤트들어갈지 익명함수 사용

        

let 변수 = function (매개변수) {
함수 문장들;
return;
};


변수이름으로 호출가능
덮어씌우면 다른 함수사용가능해서 이름없는 함수
function 명시적이랑 비슷 이름대신변수이름사용 변수에 넣어서 호출해준다
변수에 넣어줘서 {}끝에 세미콜론을 붙여줘야한다

//매개변수와 리턴값없을때
let hi = function () {//함수이름,매개변수 없음
document.write("<p>안녕</p>");//함수내용적기
};//변수에 할당하므로 ;을 붙인다
hi();//실행호출 해야 나옴 호출방법은 동일하다
안녕

매개변수 2개 일때
let sub = function (num1,num2) {//매개변수2개
return num1*num2; //return값 으로 되돌려줌
}; //이부분전체 헤드에 넣어도 실행됨 밑의 도큐먼트는 뺴고

document.write(sub(2,5));
10

함수선언식 표현식차이

함수선언문은 앞의 function을 붙이고 매개변수 함수이름 {} 주요코드흐름중간(head에 모아두어쓰지만 body에도 원하는거얼마든지할수있음) 독자적 정의가 되기전 호출가능함 head에 올려두어 불러온 다음 이름 작성해서호출했지만 먼저이름 호출정의해도 호출 가능하다 호이스팅영향받는다

함수표현식은구문 구성내부의 생성 실제흐름이 해당함수에 왔을때 코드작성시 위에서 아래로 코드작성한다
그래서 먼저 호출을 하면 호출이 불가하다 호이스팅 영향받지않는다



호이스팅
이전 선언된함수 미리위로끌어올림 끌어올려서 미리 확인
명시적 함수는 끌어올리지만 함수표현식은 선언된 것이 아닌 변수에 할당되어져
변수 미리올라가지 않음

화살표함수 es6문법

함수표현식을 더 간단히 생성함
let 변수이름 =(매개변수1,매개변수2) => {실행할문장; }
function없어지고 => 가 생겼다

 

//화살표함수 여러줄 작성 {}
let hi = () => {
document.write("<p>안녕</p>")
};

hi();
안녕




//한줄작성
let moning=() => document.write("<p>아침</p>");
아침




매개변수가 하나인 화살표함수
let numToString= n => String(n);
document.write(numToString(10));
10 콘솔창에 numToString(10);하면 문자열'10'이나온다





매개변수2개면 괄호적기 화살표함수
let add= (a,b) => a+b;
document.write(add(5,2));
7