Function VS Arrow Function 차이점

결론부터 말하면 다음과 같다.

	Function	Arrow Function
1	함수 자체에 이름을 정의가능하다	함수 자체에 이름을 정의 할 수 없다.
2	argumnets 사용할수 있다	argumnets 대신 Rest Parameters는 사용할 수 있다.
3	this 는 현제 scope(범위) 를 의미한다.	this 는 최상의 범위를 의미한다.

1. 이름정의

    function test () {
        console.log('test')
    }

    const test2 = () => {
        console.log('test2)
    }

Function 함수는 이름을 정의가능하다. 하지만 Arrow Fucntion은 변수를 할당하여 이름을 정의 할 수 있다 그러므로 

Arrow Function은 Function 함수처럼 호이스팅이 일어나지 안는다.

 

2. 파라미터 사용법

    function test () {
        console.log(arguments)
    }

    const test2 = (...arg) => {
        console.log(arg)
    }

    function test3 (...arg3) {
        console.log(arg3)
    }

    test(1,2,3,4)

    test2(5,6,7,8)

    test3(9,10,11,12)

 

3. this차이

    const testFunction = {
        test1: function () {
            console.log(this, this.name)
        },
        test2: () => {
            console.log(this, this.name)
        }
    }

    testFunction.test1.call({name: 'test1'})
    testFunction.test2.call({name: 'test1'})

결과

// {name: "test1"} "test1"
// Window {window: Window, self: Window, document: document, name: "", location: Location, …} ""

 

 

jktech.tistory.com/49

호이스팅(Hoisting)