[TIL] 자바스크립트: 연산자, 조건문, 반복문, 함수, 클래스 및 객체
어제와 마찬가지로 자바스크립트(javaScript) 강의를 들었습니다.
그중에서도 연산자, 조건문, 반복문, 함수, 클래스 및 객체를 배웠는데요!
오늘 제가 배운 내용은 다음과 같습니다.
1. 문자열 붙이기
2. 비교연산자 (Comparison operators)
3. 논리연산자 (Logical operators)
4. 일치연산자 (Equality operators)
5. 조건문 (if)
6. 반복문 (while)
7. 반복문과 조건문 활용
8. 함수
9. 클래스와 객체
10. 메소드 (Method)
1. 문자열 붙이기
왜 백틱(``)을 사용하는가?
백틱을 사용하는 이유는 더 간결하게 문자열을 붙이기 가능하기 때문입니다.
증감연산자(): ++
let count = 1
const preIncrement = ++count
대입연산자(Assignment operators): =, +=, -= 등을 사용해서 연산과 대입을 한 번에 실행할 수 있다.
2. 비교연산자 (Comparison operators)
3. 논리연산자 (Logical operators): || (or), && (and), ! (not) 연산자를 말합니다.
or 연산자 기입하는 방법. 엔터 위에 \를 shift를 누르고 기입하면 됩니다. ||.
4. 일치연산자 (Eqaultiy operators): ===
2개(==)와 3개( ===)의 다른 점?
==는 일반 연산자. ===는 일치연산자입니다. 코딩을 할 때는 꼭 세 개로 쓰기.
const vs. let의 다른점?
5. 조건문
문제: ✍️ Q. 거리를 의미하는 변수를 선언하고 원하는 숫자 값 (단위는 km라고 가정)을 할당합니다. 2km 미만이면 "걸아가자"를, 2km 이상이고 5km 미만이면 "택시를 타자"를, 그 외에는 "기차를 타자"를 출력해봅니다.
시도:
const Walk =
if (Walk < 2) {
console.log('걸어가자')
} else if (Walk < 5) {
console.log('택시를 타자')
} else {
console.log ('기차를 타자')
}
답:
const Walk = 1
if (Walk < 2) {
console.log('걸어가자')
} else if (Walk >= 2 && walk < 5) {
console.log('택시를 타자')
} else {
console.log ('기차를 타자')
}
6. 반복문
while (조건) {조건을 만족할 때 실행할 코드}
++를 뒤에 붙이는가?
간단한 내용인데 이해가 제대로 안 돼서 조금 더 검색해봤습니다.
https://www.youtube.com/watch?v=lJF0HBB_QvM
영상 속 이해를 돕는 예시
x = 1;
result = 5 + ++x;
result = 5 + 2
x=1;
result = 5 + x++;
result = 5 + 1;
새로운 값이 아니라 기존 값을 지킵니다.
왜 코드가 루프로 반복되는 거지?
while (condition) {excute this}
예시:
const age = 5;
while (age < 10) {console.log("You're age is less than 10");}
이렇게 되면 변수인 age는 변하지 않기 때문에 코드가 루프에 빠지게 됩니다.
그렇기 때문에 코드를 마쳐줄 수 있도록 조치를 취해야 합니다.
for
for (begin; condition; step) {조건을 만족할 때 실행하는 코드}
7. 반복문과 조건문 활용
1부터 20까지 숫자 중 홀수는 '숫자는...은 홀수입니다. '짝수인 경우 '숫자 ...은 짝수입니다.'를 출력하는 프로그램 작성해보기.
for (let number = 1; number <= 20; number++) {
if (number % 2 === 0) {
console.log (`${number}는 짝수입니다.`)
} else {
console.log (`${number}는 홀수입니다`)
}
}
8. 함수
함수를 만드는 것은 '함수의 선언'이라고 합니다.
function 함수명(매개변수들...) {
이 함수에서 실행할 코드들
return 반환 값
}
매개변수(parameter)란? input = 매개변수
함수의 호출
const 변수명 = 선언한 함수명(매개변수들)
9. 클래스와 객체
클래스는 템플릿, 객체는 이를 구체화한 것이라고 이해하시면 됩니다.
생성자 (constructor): 객체가 생성될 때 자바스크립트 내부에서 자동으로 호출되는 함수
this 속성 (property):
객체 만들기
const 변수명 = new 클래스명(생성자에서 정의한 매개변수들)
(1) 클래스를 정의해줍니다.
(2) 객체를 지정해줍니다.
const notebook1 = new Notebook('Macbook', 2000000, 'Apple')
console.log(notebook1)
console.log(notebook1.name)
console.log(notebook1.price)
console.log(notebook1.company)
이렇게 지정을 해주면 따로 변수를 지정해주지 않아도 효율적으로 코드를 쓸 수 있게 됩니다.
10. 매소드 (method)
객체 리터럴 (Object literal):
const 변수명 = {
속성명: 데이터,
메소드명: function() {메소드 호출 시 실행할 코드들}
객체 리터럴을 통해 빠르게 객체를 만들 수 있는데, 왜 클래스를 사용해서 객체를 만들어야 할까?
-> 재사용성!