오늘 TIL은 공부하다가 궁금했던 점을 쓸 예정
class HttpError extends Error {
constructor(response) {
super(`${response.status} for ${response.url}`);
this.name = 'HttpError';
this.response = response;
}
}
async function loadJson(url) {
const response = await fetch(url)
if (response.status == 200) {
return response.json();
} else {
throw new HttpError(response);
}
}
async function narutoIsNotOtaku() {
let title;
let res;
while (true) {
title = prompt("애니메이션 제목을 입력하세요.", "naruto");
try {
res = await loadJson(
)
break;
} catch (err) {
if (err instanceof HttpError && err.response.status == 404) {
alert("일치하는 애니메이션이 없습니다. 일반인이시면 naruto, onepiece 정도나 입력해주세요!");
} else {
throw err;
}
}
}
// 성공하면 이렇게
alert(`${res.character}: ${res.quote}.`);
return res;
}
alert(`${res.character}: ${res.quote}.`);
return res;
[궁금증 1]
1. 이 부분이 왜 try 블럭 안이 아니라 밖에 있어야 할까?
- try 블럭 안에 있으면 alert와 return문에 대한 예외가 발생 시, catch 블럭에서 처리해줄 부분이 없음
2. 그럼 만약 예외 발생 시 catch 블럭에서 처리해줄 수 있는 부분이 있다고 한다면, try 블록에 들어갔을 때 실행할까?
-> alert와 return이 break 위에 있는지, 밑에 있는지에 따라 다름
- break 위에 있다면 실행은 함. 다만 실행됨과 동시에 함수가 아예 종료되어 버림
- break 아래에 있다면 실행하지 않음. 실행되기 전에 break에 의해서 함수에서 빠져나와버림
=> 그렇기 때문에 try 블럭 밖에, while 루프 빠져나온 다음에 시행되는 것이 가장 적절함
class Car {
constructor(modelName, modelYear, type, price) {
this._modelName = modelName;
this._modelYear = modelYear;
this._type = type;
this._price = price;
};
makeNoise () {
console.log(this._modelName + " 클락션 빵빵")
};
whatAge() {
console.log(`이 차는 ${this._modelYear}년에 만들어졌습니다.`)
}
callMethod() {
console.log(`이 차는 ${this._modelName}, ${this._modelYear}, ${this._type}, ${this._price} 입니다.`)
}
get modelName() {
return this._modelName;
}
set modelName(value) {
if(typeof value !== 'string') {
console.log("[오류] 차의 이름은 문자여야 합니다");
return;
} else if(value.length === 0) {
console.log("[오류] 차의 이름이 입력되지 않았습니다.")
return;
}
this._modelName = value
}
get modelYear() {
return this._modelYear;
}
set modelYear(value) {
if (typeof value !== 'number') {
console.log("[오류] 차의 연식은 숫자여야 합니다");
return;
} else if (value.length !== 4) {
console.log("[오류] 연식은 항상 네 자리 숫자여야 합니다.")
return;
}
this._modelYear = value
}
get type() {
return this._type;
}
set type (value) {
if(value !== "G" && value !== "D" && value !== "E") {
console.log("[오류] 입력된 타입이 잘못되었습니다. 확인해주세요!");
return;
} else if(value.length === 0) {
console.log("[오류] 타입이 입력되지 않았습니다.")
return;
}
this._type = value
}
get price() {
return this._price;
}
set price(value) {
if (typeof value !== 'number') {
console.log("[오류] 차의 가격은 숫자여야 합니다");
return;
} else if(value < 100) {
console.log("[오류] 차의 가격은 100만원 이상입니다.")
return;
}
this._price = value
}
}
const car1 = new Car('Benz', 2011, 'A', 7000);
const car2 = new Car('BMW', 2023, 'E', 8000);
const car3 = new Car('아우디', 1999, 'D', 5000);
// getters 예시1
console.log(car1.modelName);
// setters 예시2
car1.modelYear = 11;
console.log(car1.modelYear);
[ 궁금증 2 ]
const car1 = new Car('Benz', 211, 'A', 칠천);
1. 만약 인스턴스를 새로 생성할 때부터 setter로 조건을 설정해 둔 modelYear의 값을 4자리의 숫자가 아닌 '211'로, price를 숫자형이 아닌 '칠천' 으로 한 뒤, console.log(car1); 을 했는데 setter에 의해 검증이 안 되고 그대로 출력이 되었다.
왜일까?
=> 인스턴스를 새로 생성할 때 constructor(생성자)를 통해 객체의 속성을 초기화하기 때문!
이 시점에서는 setter 메서드가 호출되지 않는다.
애초에 setter라는 메서드는 인스턴스가 생성된 후, 속성 값을 변경하려고 할 때 작동하는 메서드
setter 메서드를 배우기 시작할 때부터 언제 쓰기위한 메서드라는 것을 알았더라면 시간을 좀 아낄 수 있었을텐데ㅠㅠ