다시 쓰는 자바스크립트 2탄
오늘 다뤄볼 내용은 자바스크립트 언어의 핵심이라 할수있는
함수,객체,getter & setter 의 대해 알아보도록 하자
함수
함수는 수학적인 개념과 비슷하다
어떤 값이(input) 들어가면 로직이 실행되면서 일정값을 다시 반환(output)이 된다.
하나의 기능을 만들어주는 매우 중요한 요소이다
코드를 보자
function name () {
return 10
}
name() << 이렇게 호출하게되면 10을 출력한다
함수의 호출은 함수가선언된 이름을 적어주고 소괄호를 넣어주면 되는 문법이다
함수는 여러 인자를받을수있는데
인자라고함은
이렇게 name 소괄호 안에 1,2를 넣어주는 부분을 함수의 인자라고 부른다
호출하는 부분에서 인자의 개수에 맞게 넣어줘야하는게 문법이며
1,2가 각각 a,b에 들어가면서
return a+b 즉 return 1+2가되면서
값을 출력하게되는것이다.
지금은 숫자로 예시를 들었지만, 문자열이될수도있고 다른 함수의 호출이 될수도있다.
매우 자유롭게 사용할수있기 때문에 어떤 언어에서든 활용도가 매우 높다
함수에서는 크게 두가지로 나뉜다.
es6문법에서 추가된 arrow function 인데
코드를보면
또는
이렇게 사용할수있다.
둘의 차이점은 this 라는 개념을 알아야 하는데 function 에서의 this와
화살표 함수 내에서의 this가 서로 다르다는 것이다.이는 추후에 알아보자
객체
함수와 쌍으로 프로그래밍에서 많이 마주할 부분이다
객체는 key : value 로 이루어진 것으로 여러 데이터값을 저장할수있다.
코드에서는
이렇게 사용할수있다.
이렇게 함수호출에서 조금전 선언해놓은 person2를 호출하면
함수에서 반환되는 값은 sean
즉 함수와 객체의 활용이 매우 높다는것이다.
객체에서도 함수를 넣어줄수도있다.
이렇게말이다.
객체에서도 이렇게 함수를 넣어줄수도있다
활용도가 매우높다.
getter setter
객체의 프로퍼티는 두 종류로 나뉜다.
첫 번째는 데이터 프로퍼티(data Property)
두 번쨰는 접근자 프로퍼티(accessor property)
접근 프로퍼티의 본질은 함수인데 이 함수는 값을 획득(get) 설정(set) 하는 역할을 한다.
객체의 프로퍼티를 그 프로퍼티로 가져올 때 호출되는 함수로 바인딩한다
여기서 잠깐 ❗️
바인딩?
프로그램의 어떤 기본 단위가 가질 수있는 구성요소의 구체적인값,성격을 확정하는 것을 말한다.
const a = 123;
이라고 가정했을때
cosnt = 변수의 선언 방식
a = 변수의이름
123 = 변수에 할당된 값
변수의 속성의 구체적인 값이다.
위와 같이 이름,변수이름,값 이라는 구체적인 값을 할당하는 각각의 과정을 바인딩 이라고 한다.
함수에서도 바인딩이 일어나는데 이때에 바인딩은 함수를 호출할때 그 해당 함수가 위치한
메모리 주소로 연결해주는것을 의미한다.
=>https://medium.com/pocs/%EB%B0%94%EC%9D%B8%EB%94%A9-binding-4a4a2f641b27 내용을
기술했습니다.
다시 돌아와서
getter 의 예시를 보면
=>mdn https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Functions/get
또는
=> 모던자바스크립트 https://ko.javascript.info/property-accessors
let obj = {
get propName() {
// getter, obj.propName을 실행할 때 실행되는 코드
},
set propName(value) {
// setter, obj.propName = value를 실행할 때 실행되는 코드
}
};
이 객체에 fullName 이라는 프로퍼티를 추가해 fullName 이 'ma sean' 되도록해보자
이렇게 full name을 만들었다.
주어진 값이 set full Name에서 작동한다 .
get - 인수가 없는 함수로, 프로퍼티를 읽을때 동작한다.
set - 인수가 하나인 함수로, 프로퍼티에 값을 쓸때 호출된다.
❗️ 프로퍼티는 접근자 프로퍼티(get/set 메서드를 가짐) 데이터 프로퍼티 (value를가짐) 중 한 종류에만 속하고 둘 다에 속할수 없다는 점을 유의해야 한다.
getter setter 활용하기
함수와 객체만으로도 설명한 내용들이 너무 많다.
개발을 하다보면 어떠한 값을 추출해낼때 필요한 기능을하는 메소드 주로쓰는 메소드 활용도도 높아지는데
다음 포스팅은 내장객체에대해서 알아보도록하자 !
