오늘 공부한 내용 요약
( 모던 JavaScript 튜토리얼 복습 )
객체 기본
-
생성자 함수는 반드시 new 연산자와 함께 호출해야 하고 new와 함께 호출하면 내부에서 this가 암시적으로 만들어지고, 마지막엔 this가 반환됨
-
함수 본문에서 new.target을 사용하면 함수가 new와 함께 호출되었는지 여부를 확인가능
일반적인 방법으로 호출시 undefined, new와 함께 호출시 함수자체 반환 -
이때 함수내부에 new를 붙이면 new와 함께 호출하지 않아도 함께 호출한것처럼 나타나게 할 수 있음
이 경우 코드가 동일하게 작동하기에 유연하게 작성할 수 있게 된다. -
new가 붙어있으면 새로운 객체를 만든다는걸 쉽게 알 수 있음
new를 생략해서 객체를 만드는건 코드가 무슨일을 하는지 알기 어려우므로 필요한 경우에만 생략하기
예시
function User(name) {
if (!new.target) { // new 없이 호출해도
return new User(name); // new를 붙여줍니다.
}
this.name = name;
}
let bora = User("보라"); // 'new User'를 쓴 것처럼 바꿔줍니다.
alert(bora.name); // 보라-
생성자함수엔 보통 return문이 없음. 반환해야 할것들은 this에 저장되고 this는 자동으로 반환되기에 필요없기에 거의 쓰이지 않음
-
만약 return문이 있다면 객체를 return을 하면 this 대신에 객체가 반환되고 / 원시형을 return을 하면 return문은 무시됨
-
생성자 함수는 매개변수를 이용해 객체내부를 자유롭게 구성가능.
this에 프로퍼티가 아닌 메서드를 더할 수도 있음
function User(name) {
this.name = name;
this.sayHi = function() {
alert( "제 이름은 " + this.name + "입니다." );
};
}
let bora = new User("이보라");
bora.sayHi(); // 제 이름은 이보라입니다- 기본개념정의 다시
1 매개변수 - 함수의 정의에서 전달받은 인수를 함수 내부로 전달하기 위해 사용하는 변수를
2 인수 - 함수가 호출될 때 함수로 값을 전달해주는 값
3 프로퍼티 - 객체내에서 선언한 변수 (키,값을 가짐)
4 메서드 - 객체내에서 정의된 함수
Function num(x,y) -> x,y가 매개변수
~~~~
alert(1,2) -> 1,2가 인수-
객체는 예외없이 논리평가시 true를 반환한다. 따라서 객체는 문자형이나 숫자형으로의 형변환만 일어난다
-
숫자형(number)으로의 형변환은 주로 수학관련 함수적용시, 문자형(string)으로의 형변환은 대게 객체를 출력하려고 할때 일어남
-
Date를 제외한 내장객체는 hint가 defalut와 number인 경우를 동일하게 처리하면 객체는 숫자형과 문자형으로의 형변환만 남음
-
obj.toString()만 사용해도 '모든 변환’을 다 다룰 수 있기 때문에, 실무에선 obj.toString()가 자주 쓰인다고 함.
반환값도 ‘사람이 읽고 이해할 수 있는’ 형식이고, 로깅이나 디버깅 목적으로도 자주 사용가능.
그동안의 반성 및 앞으로 방향
당장의 목표 진도만을 생각하며 완전히 이해하지 못했음에도 넘어갔고, 심화 혹은 응용이 되는 뒤의 내용을 학습하며 이해에 문제가 생기게 되었고 결국 남는게 거의 없는 과정이 반복되어 왔다고 생각함.
스스로 해결해보고 고민하고 다른방법도 찾아보는데 투자한 시간이 너무 적었음.
이에 앞으로는 당장의 진도는 더 느리고 velog에 올릴 내용이 적더라도 하나의 내용을 여러 사이트, 유튜브, 강의, 기본서 등을 참고해 깊게 이해하고 과제를 풀며 이해해보고 다른방법으로도 풀어보고 이런 경우엔 어떻게 할까 등을 고민하며 진행할 예정
공부 출처
위의 내용은 공부중 본인이 이해한 내용으로 몇몇 틀린 내용이 있을 수 있습니다.
회독중 발견시 수정하겠습니다
