[자바스크립트] 함수를 선언하는 세가지 방법. 생성자 되는지 안되는지 확인

const obj = {
    // function 선언 함수
    func1: function () { return true; },

    // 메서드
    func2 () { return true; },

    // 화살표 함수
    func3: () => true
}

console.log(
    obj.func1(),
    obj.func2(),
    obj.func3()
);

console.log(obj.func1);
console.log(obj.func2);
console.log(obj.func3);

const func1 = new obj.func1();
// const func2 = new obj.func2();
// const func3 = new obj.func3();

화살표 함수의 스코프는 그냥 펑션의 스코프랑 다르다.

 

const obj = {
    x: 1,
    y: 2,
    func1: function () {
        console.log('1.', this);
    },
    func2 () {
        console.log('2.', this);
    },
    func3: () => {
        console.log('3.', this);
    }
}
// this가 해당 객체를 가리킴
obj.func1();
obj.func2();
// 💡 this가 상위 스코프를 가리킴
obj.func3();

const outer = {
    a: true,
    b: false,

    func: function () {
        const inner = {
            x: 1,
            y: 2,

            func1: function () {
                console.log('1.', this);
            },
            func2 () {
                console.log('2.', this);
            },
            func3: () => {
                console.log('3.', this);
            }
        }

        // this가 inner를 가리킴
        inner.func1();
        inner.func2();

        // this가 outer를 가리킴
        inner.func3();
    }
}

outer.func();