주절주절 기록장

객체지향 프로그래밍 - 사람이 실체(사물이나 개념)을 인식하는 철학적 사고를 프로그래밍에 적목시키려는 시도이다.

실체는 성질을 나타내는 속성이 있다. 사람을 예로 들면 이름, 나이, 주소, 키 등등 여러가지가 있을 것이다. 프로그래밍은 그러 여러 속성 중 필요한 속성만 간추려 프로그래밍한다. 그것을 추상화라고 한다. 객체는 상태를 나타내는 데이터 상태와 그 데이터를 조작할 수 있는 동작으로 구성된 복합적인 자료구조이다.

상속 - 생성자 함수를 생각해보자. 간편하게 같은 구조의 프로퍼티나 메서드를 가진 객체를 만들 수 있다. 하지만 이런 반복은 결국 낭비가 된다. 그것을 방지하기 위해 부모 객체가 가진 것을 상속하여 불필요한 중복을 제거한다.

프로토타입 객체 - 모든 객체는 [[Prototype]] 이라는 내부슬롯을 가지며, 이 내부 슬롯의 값은 프로토타입의 참조다. 저장되는 프로토타입은 객체 생성방식에 따라 결정된다.

__proto__ 접근자 프로퍼티로 [[Prototype]] 내부슬롯에 간접접근 할 수 있다. 접근자함수이므로 get, set이 있으며 프로토타입을 읽거나 할당한다. __proto__ 는 객체가 직접 소유하는 것이 아닌 Object.prototype의 프로퍼티로 상속 받아 사용할 수 있다. 

질문 1) 접근자 프로퍼티를 통해 프로토타입에 접근하는 이유가 뭘까?

일급객체와 함수 

일급객체는 리터럴로 생성할 수 있다. 런타임 시 생성된다.

변수나 자료구조에 저장가능하다.

매개변수로 사용 가능하다

메서드로 사용 가능하다.

함수객체의 프로퍼티는 argument, length, __proto__, prototype, caller?, name 등이 있다.

argument는 함수 호출 시 받은 인수를 알 수 있다. 전달 받은 인수를 저장하며, 매개변수를 초과해서 받더라도 초과한 인수 역시 저장한다. argument의 length는 받은 인수의 숫자를 나타낸다. 그러므로 인수의 개수에 따라 행동이 달라지는 구조를 만들 때 유용하다.유사 배열 객체로 배열이 아니므로 배열 메서드를 바로 사용하면 에러가 발생한다. 사용하기 위해선 간접호출을 해야한다.

length 매개변수의 숫자를 알려준다. argument의 length는 인수의 숫자이므로 주의를 해야한다.

__proto__ [[prototype]]라는 내부슬롯이 가리키는  프로토타입 객체에 접근할 수 있다.

prototype 생성자 함수에만 존재한다. 생성자 함수 호출 시 인스턴스의 프로토타입을 가리킨다.

caller? 함수 자신을 호출한 함수를 가리킨다. 호출이 없다면 null이다. 

적지 못한 내용 

-> name 함수이름을 나타낸다. ES5에서는 함수 이름이 없다면 빈 문자열을 가졌지만 ES6 부터는 식별자를 값으로 갖는다.

일급객체는 무명의 리터럴로 생성할 수 있다. 즉, 런타임 시 생성 가능하다.(표현식 말하는 것 같다)

변수나 자료구조에 저장가능 하다.

매개변수로 전달 가능하다.

반환값으로 사용 가능하다.

함수 객체의 프로퍼티는 argument, caller, length, name, prototype, __proto__ 로 구성된다.

argument는 함수 호출 시 전달된 인수들의 정보를 담고 있는 유사 배열 객체이다.

 argumet는 전달받은 인수를 순서대로 저장하며, 매겨변수를 초과해서 받은 인수 역시 저장을 한다. argument의 length 프로퍼티는 인수가 몇개인지 나타낸다. 그렇기 때문에 인수의 개수에 따라 동작을 달리하는 구조를 만들 때 유용하다.

caller 프로퍼티는 자신을 호출한 함수를 가리킨다. 호출한 함수가 없다면  null을 반환한다. 

lengh는 매개변수의 숫자를 나타낸다. argument의 lengh는 인수의 숫자이므로 주의하자.

name 프로퍼티 함수의 이름을 나타낸다. ES5에서는 함수이름이 없다면 빈 문자열을 값으로 받았으나 ES6부터는 함수를 가리키는 식별자를 값으로 같는다.

__proto__ 모든 객체는 [[Prototype]] 이라는 내부슬롯을 갖는다. __proto__는 [[Prototype]] 내부슬롯이 가리키는 프로토타입 객체 접근하기 위해 사용하는 접근자 프로퍼티다.

prototype 프로퍼티는 생성자 함수로 호출할 수 있는 함수 객체, 즉 constructor 만이 소유하는 객체다. 함수가 객체로 생성될 때 생성자 함수가 생성할 인스턴스의 프로토타입을 가리킨다. 

프로퍼티 어트리뷰트

내부로직인 내부슬롯, 내부메서드는 직접접근은 안되고 일부에 한해서 간접접근이 가능하다.

[[Prototype]]은 __proto__로 접근이 가능하고, 프로퍼티 속성인 어트리뷰트는 Object.getOwnPropertyDescript ?

로 접근이 가능하다. 둘다 내부슬롯에 해당한다.

프로퍼티 속성은 일반적으로 값, 값변경가능 여부, 열거가능 여부, 재정의가능 여부로 구성되어있다.

프로퍼티의 종류는 두가지로 일반적인 우리가 아는 키와 값으로 구성된 데이터 프로퍼티와 프로퍼티에 접근해서 데이터를 읽거나 쓸수 있는 접근자 프로퍼티가 있다.

접근자 프로퍼티는 구성이 조금 다르다. 값이 없기 때문에 값변경 여부 속성이 빠지고 get, set이라는 속성을 가지고 있다.

get은 데이터프로퍼티에 접근하여 getter 함수를 호출하여 프로퍼티 값을 반환한다. set은 프로퍼티를 저장할 때 setter 함수를 호출하여 프로퍼티를 저장한다. 나머지 열거가능 여부와 재정의가능 여부는 공통적으로 가지고 있다.

Object.defineProperty 였나?? 프로퍼티 속성을 정의, 재정의할 수 있다. 인수로 객체, 프로퍼티, 프로퍼티 속성을 받는다.

정의할 때 속성을 생략한다면 가능여부 속성은 false로 값, set, get은  undefined가 된다. 

속성 제어

확장금지 - 객체.preventExpansion ? 모두 다 가능하지만 프로퍼티 추가가 금지된다.

동봉? - 객체.seal 삭제, 추가, 재정의가 금지 된다.

? - 객체.frozen ? 읽기 외에 모든 것을 금지한다. 

생성자 함수

new Object, new 연산자와 Object 생산자 함수를 통해 빈 객체를 만들 수 있다.

Object 말고도 Number, String, Boolean ?? 등등 빌트인 함수로도 가능하다. 

 생성자 함수를 쓰는 이유는 동일한 구조의 객체가 많이 필요할 때 객체를 수없이 많이 만들기에는 낭비가 크다.

생성자 함수를 통해 그 낭비를 줄일 수 있다. 

this 생선된 빈 객체는 this를 통해 바인딩 된다. 생성자 함수 내에서 this는 생성자 함수를 가리키며 프로퍼티나 메서드를 만들 수도 있다. 만약 생성자 함수가 아니라 일반 함수에서 사용했다면 일반함수를 무시하고 window를 가리켜 전역상태가 된다.  this를 사용한 바인딩시 주의점은 함수가 끝나면 this를 반환한다. 그런데 return을 정의 했다면(원시값 제외) return이 this 대신 반환된다. 

 함수 역시 객체이므로 객체의 속성을 다 가진다. 이런 함수와 객체의 큰 차이점은 호출이 가능하다는 점이다. 그러므로 함수는 다른 내부슬롯이 더 있고 내부메서드 역시 [[Call]], [[Construct]]등이 추가되어 있다. [[Call]]은 함수를 호출할 때 호출되며 함수는 호출이 가능하므로 callable은 당연하다. 이런 함수 중 생성자함수 생성 가능 여부를 나태내는 것이 [[Construct]]이다. 생성자 함수를 만들 때는 Call 대신 Constuct가 호출된다. Construct 가능한 것은 함수 정의식, 함수표현식, 클레스 등은 가능하고 non-construct 는 화살표 함수, 축약 메서드가 해당된다. 

new.target 생성자 함수인지 아닌지 알려준다. 아니라면 undefined를 반환한다. 

생성자 함수란 new 연산자오 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다.

new연산자와  Object 생성자 함수를 사용하면 빈 객체를 만들 수 있다.

Object 말고도 Number, String, Boolean, Function, Array, RegExp, Date 등의 빌트인 생성자 함수가 있다.

• 복습 질문 1) new를 붙이지 않고도 생성자 함수를 생성하는 빌트인 생성자 함수는 무엇일까?

생성자 함수를 쓰는 이유는 객체는 편리하지만 값이 다른 같은 구조의 프로퍼티를 가진 객체가 많이 필요할 경우 너무 많은 동일 구조 객체를 많들어야 할 수도 있다. 생성자 함수는 이런 상황을 막아준다.

this 바인딩은 인스턴스와 연결 된다. 바인딩이란 식별자와 값을 연결하는 과정을 말하며 this는 인스턴스를 가리키고, 빈 객체에 프로퍼티나 메서드를 추가할 수 있다.

• 복습 질문 2) 생성자 함수가 아닌 함수에서 this를 쓰면 어떻게 될까? 
• 복습 질문 3) 인스턴스 반환은 어떻게 될까? return 이 있을 때와 없을 때 어떤 차이가 있을까

함수 역시 객체이므로 일반 객체가 가진 내부슬롯과 내부메서드를 가진다. 여기서 함수와 일반객체의 차이는 호출이 가능하다는 것이다. 따라서 함수만 가지는 내부슬롯과 내부메서드 [[Call]], [[construct]] 를 가진다. 

[[Call]]은 함수 호출을 할 때 호출된다.

[[Construct]]는 생성자 함수로서 호출할 때 호출된다.

함수 객체라면 호출 가능하여야 하므로 모두 callable 하며 함수 종류에 따라 constructor 과 non-constuctor로 나뉜다.

• 복습 질문 4) constructor 함수와  non-constuctor은 무엇이 있을까?

new.target은 생성자함수로서 호출되었는지 아닌지 확인할 수 있다. 생성자 함수로 호출되었다면 new.target은 함수 자신을 가리킨다. 일반 함수로 호출 되었다면 new.target의 내부는 undefined 이다.

• 복습 질문 5) new.target을 이용해 생성자 함수인지 검사하고 아니라면 생성자 함수로 만드는 방법은 무엇일까?
• 복습 질문 6)new.target이 없다면 위의 상황을 어떻게 해결할까?

내부슬롯과 내부메서드는 JS 엔진의 구현 알고리즘을 설명하기 위한 내부로직으로 직접 접근이 불가능하다

일부 내부슬롯과 내부메서드 중에서 간접적으로 접근 가능한 것이 있는데

모든 객체는 [[Prototype]] 이라는 내부슬롯을 가지고 __proto__를 통해 간접 접근이 가능하다

또 내부슬롯 중 하나인 프로퍼티의 상태를 나타내는 어트리뷰트 역시 Object.getOwnPropertyDescriptor로 간접 접근이 가능하다.

프로퍼티의 상태 요소는 일반적으로 값, 갱신가능 여부, 열거가능 여부, 재정의가능 여부를 말한다.

프로퍼티의 종류는 데이터 프로퍼티, 접근자 프로퍼티가 있으며, 데이터 프로퍼티는 일반적인 우리가 아는 프로퍼티이고

접근자 프로퍼티는 다른 데이터 프로퍼티를 읽거나, 저장할 때 호출되는 접근자 함수로 구성된 프로퍼티이다.

접근자 프로퍼티의 상태 요소는 get, set, 열거가능 여부, 재정의가능 여부 등이 있다. 

get은 데이터 프로퍼티에 접근할 때 getter 함수를 호출하여 데이터 프로퍼티의 값을 반환한다.

set은 데이터 프로퍼티에 값을 저장할 때 호출되는 접근자 함수다. 접근자 프로퍼티 키로 데이터 프로퍼티 값을 저장하면 setter 함수가 호출되고 그 결과 프로퍼티 값으로 저장된다.

Object.defineProperty 메서드를 사용하면 프로퍼티의 어트리뷰트를 정의, 재정의 할 수 있다.

정의할 때 생략한 어트리뷰트는 value, get, set은 undefined로 writable, enumerable, configurable는 false가 기본값으로 적용된다. 

객체변경방지 

객체 확장금지 Object.preventExtensions 객체 추가가 금지된다. 삭제, 읽기, 쓰기, 재정의는 가능하다.

객체 밀봉 Object.seal 프로퍼티 추가, 삭제, 재정의가 금지된다. 읽기와 쓰기는 가능하다.

객체 동결 Object.freeze 읽기 외엔 모두 금지된다. 

생성자 함수란 new 연산자와 함께 호출되어 객체를 생성하는 함수를 말한다.

생성자 함수에 의해 생성된 객체를 인스턴스라고 한다.

같은 프로퍼티 공유하는 여러 객체를 만들기 쉽다.

this 바인딩을 통해 프로퍼티를 만들 수 있다.

내부 메서드 [[Call], [[Construct]] 

함수로 호출될 때 Call

생성자 연산자로 호출될 때 Consturct - 메서드, 화살표 함수는 안됨

new.target 

new 연산자 ㅇ벗이 호출되는 것을 방지하기 위해 사용한다. 

내부 슬롯, 내부 메서드

자바 엔진 알고리즘을 설명하기 위한 의사 슬롯과 의사 메서드이다.

둘다 내부 로직에 관련되어 있어서 직접 접근은 안되고 간접 접근은 가능하다.

[[ ]]으로 나타낸다.

내부슬롯은 객체를 만들면 객체 안에 [[Prototype]]으로 자동으로 생성된다.

간접접근으로 객체이름.__proto__ 로 접근할 수 있다.

어트리뷰트

프로퍼티의 상태를 나타내는 프로퍼티로 내부슬롯에 해당된다.

구성은 값, 값의 변경 여부, 열거가능여부, 재정의 가능 여부를 나타낸다.

역시나 직접접근은 안되고 Object.getOwnPropertyDescriptor(객체이름, '키') 로 표현한다.

참조할 객체와 키값을 받으면 디스크립터 객체를 반환한다.

프로퍼티의 종류

데이터 프로퍼티 - 일반적인 키와 값으로 구성된 우리가 아는 프로퍼티다 

 접근자 어트리뷰트 - 값이 아닌 다른 프로퍼티에 접근하는 접근자 함수로 구성된 프로퍼티 

어트리뷰트도 데이터 프로퍼티랑 다르게 프로퍼티에 읽거나 저장할 때 호출되는 get과  set,

열거가능 여부, 재정의가능 여부로 구성되어있다.

Object.defineProperty 매서드를 사용하면 프로퍼티의 어트리뷰트를 정의할 수 있다.

객체 변경 방지

객체확장금지 - 프로퍼티 추가가 금지되고 나머지는 어트리뷰트는 true다.

객체 밀봉 - 프로퍼티 추가, 삭제, 재정의가 금지되고 나머지는 true다.

객체 동결 - 읽기 외엔 모두 금지된다. 

!! 다시보자

!!함수란? 입력을 받으면 출력을 하는 과정?  

함수를 쓰는 이유 - 재사용 하기 매우 좋다. 함수를 재사용함으로써 코드의 신뢰도가 올라간다.

함수의 구성 - 함수 이름, 매개변수, 함수몸체, 인수 등이 있다.

함수이름 - 함수이름은 함수내에서만 동작한다. 식별자 명명법에 따른다. 생략가능하다(선언문 제외)

매개변수 - 함수 내에서만 작동 기존 변수의 특징을 가지고 있따. 초기화 시에 undefined, 값에의한 전달

참조에 의한 전달 등, 없어도 됨, 식별자 명명법 따라야함  

return - 함수를 끝내고 값을 반환한다. 생략가능 대신 undefined 출력

인수 - 순차적으로 매개변수에 할당된다.  매개변수가 2개인데 3개를 넣으면 마지막 것 무시, 하나가 들어간다면?

인수, undefined가 매개변수에 들어가 있을 것이다. JS 변수선언 키워는 타입을 가리지 않고 받기에 원하는 타입을 받기 위한 조치가 필요하다. 인수의 숫자 역시 다르게 들어 갈 수 있으므로 주의 필요

함수 정의 4가지 방법 

함수 선언문 - 함수이름이 생략 불가능하다. 함수이름으로 언어차원에서 암묵적으로 식별자를 만들기 때문이다. 

함수 표현식과 변수 대입 빼곤 차이가 없어보여 왜 생략불가능인가 의문이 들 수 있다. JS는 문맥으로 판단한다.

{}도 코드블록인지 아닌지 문맥으로 판단하고 이것 역시 마찬가지 

함수 표현식 - 일급 객체이다. 일급객체는 값이자 객체인 것. 선언문과 표현식은 호이스팅 차이가 있다. 선언문은

스코프 최상단에 객체가 들어가 초기화 된다. 표현식은 var 키워드에 할당하면 undefined로 초기화 되고 선언문에서 객체가 들어간다.

화살표 함수, 생성자 함수 이건 나중에 배운다고 함

함수의 종류 

즉시 실행 함수 - 보통 함수 이름이 없다. 있어도 상관은 없음. 그룹연산자로 감싸서 선언문 형식을 함수리터럴로 만든다.

선언문 형식이지만 선언이 되지 않고 식별자가 만들어지지 않기에 호출은 처음 한번 빼곤 불가능하다.

중첩함수 - 내부함수라고도 한다. 함수 안의 함수를 말하며, 외부함수를 돕는 헬퍼 함수이다.

재귀함수 - 함수 몸체에서 자신을 다시 호출하는 함수 함수를 반복해서 호출해서 특정한 값을 만들 때 쓴다.

고차함수, 콜백함수 - 인수로 함수를 받는 것이 고차함수, 인수로 들어가는 함수를 콜백함수로 칭한다. 

콜백함수가 고차함수 제외하고 호출이 되지 않는다면 즉시실행함수로 표현하는 것이 일반적이다. 

순수함수, 비순수함수 - 순수함수는 함수 외부의 변화에 영향을 받지 않으며 주지 않는 함수이다.

비순수함수는 함수 오부의 변화에 영향을 받거나 주는 함수이다.

var은 함수레벨스코프다. 함수만 지역함수로 인정하기에 for, if, while 등 다른 블록은 전역함수로 인식하는

문제가 생긴다. 

스코프 - 활동영역을 말한다.

스코프 체인 - 전역 <- 외부함수 <- 내부함수  내부함수에서 전역 방향으로 식별자를 검색한다. 내부함수에 찾는 식별자가 있다면 전역에 같은 식별자가 있더라도 내부함수의 식별자가 출력된다. 전역레벨에서 식별자를 찾는다면 외부함수나 내부함수 레벨같은 하위레벨로는 내려가서 찾지 않는다. 위로는 올라가도 아래로는 내려가지 않음

!! 분명 추가로 더 있는데 기억이 안난다. 다시 찾아 보자 

스코프란 변수의 사용 영역을 말한다.

스코프의 종류 전역변수, 지역변수

전역변수란 지역의 가장 바깥에 선언된 변수

지역변수란 지역에서만 사용할 수 있는 변수

스코프 체인 

전역 ->외부 함수 -> 내부함수인 상태일 때 전역과 내부함수에 같은 이름의 변수가 있다면 

내부함수 안에서 출력하면 가장 가까운 내부함수를 출력할 것이고, 만약에 내부함수에 변수가 없다면

내부함수 -> 외부함수 -> 전역변수 순으로 검색해 나갈 것이다.

함수레벨스코프 

var은 함수레벨스코프로 함수만 지역 스코프를 인정한다.

if, for문 같은 코드블록은 지역스코프로 인정을 안하기 때문에 전역변수 문제가 생긴다.

렉시컬스코프

함수를 호출한 곳을 기준으로 스코프체인을 따른다면 정적스코프

아니면 함수가 정의된 곳을 기준으로 스코프체인을 따른다면 렉시컬 스코프

렉시컬 스코프가 JS다