1. switch
- 형태
switch (표현식) {
case 값1:
명령문1
break
case 값2:
명령문1
break
default
명령문3
} - 중괄호
{}
로 둘러싸인 블록 형태를 띠고 있고, 중괄호 안에는case문
이 있습니다. - switch 의 표현식은 case 의 값과 일치 여부를 확인하고 이때 === 일치 연산자를 사용합니다.
===
일치 연산자는 값과 자료형을 모두 비교하고, 결과 값으로 true 또는 false를 반환합니다.- case문이 있는 경우, 위에서 부터 순차적으로 일치한 값이 나올 때까지 case 값을 확인하면서 내려갑니다.
- case값이 일치하면 해당 명령문을 실행합니다.
break
는 다음의 코드들을 더 이상 실행하지 않고, switch 조건문을 끝내는 역할을 합니다.- 일치하는 case값이 없는 경우
default
로 선언된 명령문을 실행합니다.
const lang = "JavaScript"
switch (lang) {
case "C"
console.log("C언어를 학습 중입니다.")
break
case "JavaScript"
console.log("JavaScript를 학습 중입니다.")
break
case "Python"
console.log("Python를 학습 중입니다.")
break
default
console.log("프로그래밍 언어를 학습하고 있지 않습니다.")
break
} // JavaScript를 학습 중 입니다.
2. for
- 특정 코드를 반복하는 흐름을 제어합니다.
- 반복문을 통해 언제부터 어디까지 실행할지, 몇 번 반복할지를 설정합니다.
- 형태
for (초기값; 조건식; 어떠한 간격으로) {
실행할 문장
} - 소괄호
()
로 둘러싼 부분에는 반복문을 어떻게 실행할지에 대한 내용을 작성합니다. - 소괄호 안에 작성하는 규칙으로는 첫 번째는 초기값, 두 번째는 언제까지 반복할지를 정하는 조건식, 세 번째는 어떤 간격으로 값이 변화하는지를 작성하며 세미콜론 ; 으로 구분합니다.
- 중괄호
{}
로 둘러싸인 블록에 실행할 문장을 작성합니다.
for(const i = 0; i < 3; i ++){
console.log(i + "번째 반복 문장입니다.")
}
/*
0번째 반복 문장입니다.
1번째 반복 문장입니다.
2번째 반복 문장입니다.
*/
- 위의 코드는 0부터 시작해서 2까지 총 3번 반복해서 실행하는 반복문입니다.
const cafe = [
{name: "스타벅스", coffee: "4,100", tea: "4,100"},
{name: "이디야", coffee: "3,200"},
{name: "폴바셋", coffee: "4,300", tea: "5,500"},
{name: "투썸플레이스", coffee: "4,100", tea: "4,800"}
]
for (let i = 0; i < cafe.length; i++) {
const c = cafe[i].
if (!c || !c.tea) { // 배열에서 가져온 요소의 정보가 없는 경우에는 다음으로
continue
}
console.log(i + "번째 실행입니다.")
if(c.name === "폴바셋") {
console.log(c.name + "의 아메리카노 가격은 " + c.coffee + "원이고, 얼 그레이의 가격은 " + c.tea + "원 입니다.")
}
}
/*
0번째 실행입니다.
2번째 실행입니다.
폴 바셋의 아메리카노 가격은 4,300원이고, 얼 그레이의 가격은 5,500원입니다.
*/
- break 와 continue 를 통해 반복문의 흐름을 제어할 수 있습니다.
continue
는 지시자가 놓인 지점 다음의 문장들을 무시하고 다음 반복으로 넘어가게 합니다.break
는 break가 있는 지점까지만 실행하고 반복문을 종료합니다.
3. for-in
- for 반복문과 비슷하게 for 키워드를 사용하고, for 반복문과 다르게 in 키워드를 사용합니다.
- in 키워드를 사이에 두고 오른쪽에는 반복할 대상 변수를 왼쪽에는 속성명을 작성합니다.
- 형태
for (속성명 in 반복할 대상) { - }
- 반복문을 통해 내부 요소를 하나씩 순회할 때마다, 각 요소가 키(Key) 정보가 for in에서 정의한 속성명으로 선언과 동시에 할당됩니다.
const store = {candy: 1000, snack: 2000, beverage: 1500}
for (const item in store) {
if(!store.hasOwnProperty(item)) {
continue
}
console.log(item + "는 가격이 " + store[item] + " 입니다.")
}
/*
candy는 가격이 1000 입니다.
snack는 가격이 2000 입니다.
beverage는 가격이 1500 입니다.
*/
- 객체 자료형 자체에 기본적으로 내장된 속성인
hasOwnProperty 속성
을 사용해서 store 객체에 item 키 정보가 있는지 확인합니다. - for-in 은 순회 가능한 객체의 요소들을 나열하지만, 객체 속성 중에서 hasOwnPropertty와 같은 내장 속성은 열거하지 않고 첫 번째 코드에서 사용자가 직접 정의한 속성 값들에 대해서만 나열합니다.
* Object.protptype.hasOwn Property()
- hasOwnProperty() 메소드는 객체가 특정 프로퍼티를 가지고 있는지를 나타내고 있는 boolean 값을 반환함
- 객체가 특정 요소를 자신만의 직접적인 요소로 소유하고 있는지를 판단할 때 사용함
4. while 반복문
- 지시어 while로 시작하고, 소괄호 () 안에 조건식들이 들어갑니다.
- 조건식의 결과 값은 true, false 만 가능합니다.
- 조건식이
true
를 만족하는 경우에만 중괄호 {} 안의 문장들이 실행됩니다. - 조건식이
false
가 되면 더 이상 반복 실행하지 않습니다. - break 와 continue 문을 사용할 수 있습니다.
- 형태
while (조건식) {
반복하게 될 문장
} - do-while 반복문
- 지시어
do
의 사전적 의미 그대로 처음은 조건 결과와 상관없이 무조건 실행합니다. - 그다음 조건식의 결과 값을 확인하고 다음의 흐름은 while문과 동일합니다.
- 형태
do {
반복하게 될 문장
} while (조건식)
- 지시어
const users = [
{name: "홍길동1", city: "과천"},
{name: "홍길동2", place: "일산", city: "고양"},
{name: "홍길동3", place: "광주", city: "전라도"},
{name: "홍길동4", place: "부산", city: "경상도"}
]
// 인자값을 user와 name을 받는 함수 isUser 선언
const isUser = (user, name) => { // user의 name과 인자로 받은 name이 다른 경우 false를 반환하여 함수 종료
console.log(`함수가 실행되었습니다. ${user.city} 도시에서 ${name}을 찾습니다.`)
if(user.name === name) {
console.log(`${user.name}은 ${user.city} ${user.place} 에 살고 있습니다.`)
return true
}
return false
}
let user
while(user = users.shift()){ // u 변수에 user.shift()로 반환되는 값을 할당하고 할당된 값을 확인, hometown의 요소는 객체로 이뤄져 있어 값이 유효한 경우 true, 유효하지 않으면 false
if(!user.name || !user.place || !user.city){ // user에 할당된 객체의 name, place, city속성이 모두 있는지 확인하고 하나라도 없으면 continue문을 통해 반복문의 다음 순서로 넘어감
continue
}
const result = isUser(user, "홍길동3") // isUser 함수에 user변수와 "홍길동3"값을 넣어 결과를 반환
if(result){
break
}
}
let i = 0
const names = ["홍길동1", "홍길동2", "홍길동3", "홍길동4"]
const cities = ["경기", "부산", "대구", "광주"]
do{
user[i] = {name: names[i], city: cities[i]}
i++
} while (i < 4)
console.log(user)
// 함수가 실행되었습니다. 고양 도시에서 홍길동3을 찾습니다.
// 함수가 실행되었습니다. 전라도 도시에서 홍길동3을 찾습니다.
// 홍길동3은 전라도 광주 에 살고 있습니다.
/*
{0: {...}, 1: {...}, 2: {...}, 3: {...}, name: '홍길동3', place: '광주', city: '전라도'}
0: {name: '홍길동1', city: '경기'}
1: {name: '홍길동2', city: '부산'}
2: {name: '홍길동3', city: '대구'}
3: {name: '홍길동4', city: '광주'}
city: "전라도"
name: "홍길동3"
place: "광주"
[[Prototype]]: Object
*/
* Array.Prototype.shift()
- shift()는 배열의 앞에서부터 값을 하나씩 빼오는 함수
- shift()메서드는 배열에서 첫번째 요소를 제거하고 제거된 요소를 반환, 이 메서드는 배열의 길이를 변하게 함
ex) const array1 = [1, 2, 3]
const firstElement = array1.shift()
console.log(array1) // array[2, 3]
console.log(firstElement) // 1
'IT > JavaScript' 카테고리의 다른 글
8. 자바스크립트(JavaScript) 연산자(1) (0) | 2021.10.23 |
---|---|
7. 자바스크립트(JavaScript) 자료형 (0) | 2021.10.23 |
4. 자바스크립트(JavaScript) 조건문(1) (0) | 2021.09.26 |
3. 자바스크립트(JavaScript) 기초 문법(3) (0) | 2021.09.26 |
* JavaScript 개발 환경 구성하기 (0) | 2021.09.24 |