#24 Java Script 확산 연산자, 메서드와 함수, this, 호이스팅

 2019.06.18

 

 // 확산 연산자(...)

 배열의 나머지 값들을 받아오거나 확장시킬 수 있다 

 남는 매개변수를 이용할 수 있다

// ex) 확산 연산자
 
let f1 = (x, y)=>{
    console.log(`f1.x : ${x}, f1.y : ${y}`);
}
 
let f2 = (x,...y)=>{
    console.log(`f2.x : ${x}, f2.y : ${y}`);
}
 
f1(1); // f1.x : 1, f2.x : undefined
f1(1,2,3); // f1.x : 1, f1.y : 2
f2(3); // f2.x : 3, f2.y : 
f2(4,5); // f2.x : 4, f2.y : 5
f2(6,7,8); // f2.x : 6, f2.y : 7,8 

​

 

 // 함수(function)

 소프트웨어에서 특정 동작을 수행하는 일정 코드 부분을 의미한다

​

 // 메서드(method)

 객체 지향 프로그래밍 언어에서 사용한다

 클래스 인스턴스 (또는 클래스 객체)에 저장되어 있는 데이터에 접근할 수 있는 특수 속성을 가지고 있다

 즉, 클래스 내부에서 함수를 사용할 때 '메서드'라하고 멤버함수라고 부르기도 한다

 

 // this

 Java에서는 클래스로부터 생성되는 인스턴스 중 현재 객체를 의미하는 연산자

 클래스 밖에서는 사용X

​

 Java Script에서는 함수의 현재 실행 문맥

 메서드를 호출하면 this는 호출한 메서드를 소유하는 객체가 된다

 객체의 프로퍼티인 함수에서 의미가 있다

// ex) this 연산자
 
const o = {
    name : "codenbike",
    getName1 : () => {
        console.log(this.name); // undefined
    },
    getName2 : function(){
        console.log(this.name); // codenbike
        let x = function(){
            console.log(this.name); // undefined, function의 단점
        };
        let that = this;
        let y = function(){
            console.log(that.name); // codenbike
        }
        x();
        y();
    }
 
}
o.getName1();
o.getName2();

​

 

 // 프로퍼티(property)

 객체의 일부로 이름과 값 사이 연결을 의미

 객체의 속성 나타내는 접근 가능한 이름과 활용가능한 값을 가지는 특별한형태

 접근 연산자 (.) ex) o.getName1();

 

 일반 함수(function)에서 this는 함수를 호출시 함수가 어떻게 호출되었는지에 따라서 this에 바인딩할 객체가 동적으로 결정된다

 화살표 함수(()=>{})에서 this는 함수 선언시 this에 바인딩할 객체가 정적으로 결정되는데 언제나 상위 스코프의 this를 가리킨다

​

 // 바인딩(binding)

 메서드와 객체를 묶어놓는 것

​

 // 스코프(scope)

 변수를 사용할 수 있는 영역

 

 // 호이스팅(hoisting)

 변수를 선언하지도 않았는데 그 변수에 접근할 수 있다

 var로 변수를 사용하여 스코프 맨위로 끌어올리거나 함수 호이스팅을 통해 함수를 선언하기 전에 호출할 수 있다

// ex) 호이스팅
 
greet();
 
function greet(){
    console.log("hi");
}