[TIL] JavaScript 문법 기초_월요일

유진·2022년 11월 7일

TIL

TIL Today I Learned

목록 보기

6/116

2022.11.07.(월)

TIL Today I Learned

Good: 강의를 듣고 스스로 문제 풀이한 것

Bad: 한 번도 틀리지 않고 풀이하고 싶었는데 그렇게 하지 못했다. 두 번이나 틀린 것 기억하기! else 뒤에 매개변수 붙이지 않기.

▶ 내가 웹 개발 종합반 들을 때부터 사용하던 VScode를 이용하여 강의해주신다. 그래서 이해가 잘 되고 재밌다. 하지만 처음부터 잘 하는 사람은 없다. 이번 TIL은 오답노트이다. 틀린 코드를 다신 틀리지 않도록 하기 위함이다. 잘못된 이유, 올바른 정답, 개선할 점을 써서 배우고 알아갈 것이다.

* 1-5강 데이터타입 퀴즈

✍️Q. 내가 원하는 변수들을 자유롭게 선언해보고 데이터를 할당한 뒤 출력해보아요.

▶ 틀린 코드

const allergyFigure(1,000)
const allergyType(8)
console.log(allergyFigure)
console.log(allergyType)

▶ 옳은 코드

const allergyFigure = 1000
const allergyType = 8
console.log(allergyFigure)
console.log(allergyType)

숫자에 콤마 , 을 넣으면 안 된다.
숫자는 괄호에서 빼야 함.
= 안 넣었음
후에 '1000'이라고 적었는데 작은따옴표'' 빼야 함. 문자열이 되기 때문이다. 나는 변수 1000이 필요함.
수정 후 저장하기! 아무리 해도 그대로이길래 생각을 해봤다. 저장을 안 해서 그 전 오류로 나온다. 햐...

위 5가지는 잊지 않겠다!!!

* 1-9강 조건문(2) 퀴즈

✍️ Q. 거리를 의미하는 변수를 선언하고 원하는 숫자값 (단위는 km라고 가정)을 할당합니다. 2km 미만이면 "걸아가자"를, 2km 이상이고 5km 미만이면 "택시를 타자"를, 그 외에는 "기차를 타자"를 출력해봅니다.

강의 듣고 생각나는 대로 적어보았다.

▶ 틀린 코드

const  distance = 2
if (distance < 2) {
	console.log('걸어가자')
} else if (2 < distance < 5) {
	console.log('택시 타자')
} else (distance < 6) {
	console.log('기차 타자')
}

▶ 옳은 코드

const  distance = 2
if (distance < 2) {
	console.log('걸어가자')
} else if (distance >= 2 && distance < 5) {
	console.log('택시 타자')
} else {
	console.log('기차 타자')
}

(2 < distance < 5) 이렇게 해도 될까?

강사님은 (distance >= 2 && distance < 5)로 했다. 내가 했던 대로 하면 2는 어디에도 포함되지 않아서 오류가 생길 것이다. 다음에는 && 그리고를 잘 이용해야겠다.

else (distance < 6) 으로 한 이유는 (distance < 5)로 하면 위와 겹치기 때문에 6으로 했다.

답은 아주 간단했다. 아무것도 적지 않아도 된다.

* 1-12강 반복문과 조건문 활용 퀴즈

✍️Q. 1부터 20까지의 숫자중 홀수인 경우는 '숫자 ...은 홀수입니다.'를 짝수인 경우는 '숫자 ...은 짝수입니다' 를 출력하는 프로그램을 작성해봅니다.

▶ 틀린 코드

for (let number = 1; number <=20; number++)
	if (number % 2 === 0) {
		console.log(`${number}는 2로 나누어 떨어지는 짝수입니다.`)
	} else (number % 2 === 1) {
		console.log(`${number}는 2로 나누어 떨어지지 않는 홀수입니다.`)
	}

▶ 옳은 코드

for (let number = 1; number <=20; number++){
	if (number % 2 === 0){
		console.log(`${number}는 짝수입니다.`)
	} else{
		console.log(`${number}는 홀수입니다.`)
	}
}

첫 줄 마지막에 중괄호{}를 넣어야 함. 그렇게 해야지 if와 else가 for 문에 해당함.
1-9강 퀴즈와 마찬가지로 else는 나머지이기 때문에 굳이 상태 값을 넣지 않아도 됨. 기억하고 다음에는 아무것도 적지 않도록 주의하자.

* 1-14강 함수(2) 퀴즈

✍️Q. 세 개의 물건가격을 매개변수로 전달받아 평균값을 리턴하는 함수를 정의하고, 그 함수를 호출해서 평균값을 출력해보세요.

▶ 틀린 코드

function calculateAvg{price1, price2, price3} {
	const sum = price1 + price2 + price3
	console.log(`세 개의 물건 가격 총합은 ${sum}입니다.`)
	const avg = sum / 3
	return avg
}

const priceA = 10000
const priceB = 20000
const priceC = 30000
const avg1 = calculateAvg(priceA, priceB, priceC)
console.log(`A와 B와 C의 평균은 ${avg1}입니다.`)

▶ 옳은 코드

내가 한 코드
function calculateAvg(price1, price2, price3) {
	const sum = price1 + price2 + price3
	console.log(`세 개의 물건 가격 총합은 ${sum}입니다.`)
	const avg = sum / 3
	return avg
}

const priceA = 10000
const priceB = 20000
const priceC = 30000
const avg = calculateAvg(priceA, priceB, priceC)
console.log(`A와 B와 C의 평균은 ${avg}입니다.`)

틀린코드에서 위에는 avg로 되어 있고 가격 밑에 있는 avg는 1이 붙어있다. 정답은 avg로 고쳤다. 같아야 한다.
첫 줄 price1, price2, price3 매개변수를 {} 중괄호에 넣었다. 정답은 () 소괄호에 넣어야한다.
강사님은 console.log(세 개의 물건 가격 총합은 ${sum}입니다.) const avg = sum / 3 대신에

const avg = (price1 + price2 + price3) / 3 이라고 합쳤다. 퀴즈가 평균값을 구하는 것이기 때문에 강사님처럼 바꿔줘야겠다. 내가 한 것은 총합과 평균이다.

강사님 코드
function calculateAvg(price1, price2, price3) {
	const avg = (price1 + price2 + price3) / 3
	return avg
}

const priceA = 10000
const priceB = 20000
const priceC = 30000
const avg = calculateAvg(priceA, priceB, priceC)
console.log(`A와 B와 C의 평균은 ${avg}입니다.`)

* 1-16강 클래스와 객체(2) 퀴즈

✍️Q. 여러분만의 의류 쇼핑몰을 만들려고 합니다. 옷의 종류는 많지만 기본적으로 색깔, 사이즈, 가격의 속성을 갖고 있네요. 그리고 이 옷들의 세 속성을 바로 확인할 수 있게 출력해주는 메소드가 필요할 거 같습니다. 클래스와 객체를 활용해 작성해보아요.

▶ 틀린 코드

class clothes {
	shoppingmall(color, size, price) {
		this.color = color
		this.size = size
		this.price = price
	}
	printinfo(){
		console.log(`색깔: ${this.color}, 사이즈: ${this.size}, 가격: ${this.price}원`)
	}
}
const cloth = new clothes('blue', 'M', 6000 )
cloth.printinfo()

▶ 옳은 코드

class clothes {
	constructor(color, size, price) {
		this.color = color
		this.size = size
		this.price = price
	}
	printInfo(){
		console.log(`색깔: ${this.color}, 사이즈: ${this.size}, 가격: ${this.price}원`)
	}
}
const cloth = new clothes('blue', 'M', 6000 )
cloth.printInfo()