1. for 문
for(초기화식; 조건식; 증감식) {
실행문;
}1.1 for 문의 선택적 사용
구성요소들은 모두 선택적인 사용이 가능하다
let i = 0; // 변수 선언
for (; i < 7; i++) {
console.log('count: ' + i)
}- 조건식 또한 선택적으로 사용가능하지만
실행문 안에 조건문을 넣어 무한루프에 빠지지 않도록 해야한다.
for (let i = 0;; i++) {
if (i > 7) { console.log(i + '살은 초등학생입니다.' )}
if (i >= 13) break;
}
무한루프
- 모든 구성요소를 생략하면 무한루프에 빠진다.
- 아래
for(;;)예시는 while문 대신에 무한루프를 써야할 때 사용한다. - 이때 break로 빠져나와야 한다는 점!
let i = 0;
for (;;){
i++;
console.log(i);
if(i> 5){
break
}
}1.2 for문 구성요소 선택적 사용시 주의사항
- 세미콜론
;은 생략이 불가하다.- 모든 구성 요소 생략시 세미콜론은 반드시 2개 모두 포함되어야 한다.
1.3 for 문 활용 문제 풀이
- 데이터가 있을때 원하는 데이터 뽑아보기
let data = [
{ 회원번호: 0, 아이디: "a", 성별: "남", 나이: 21 },
{ 회원번호: 1, 아이디: "b", 성별: "남", 나이: 17 },
{ 회원번호: 2, 아이디: "c", 성별: "여", 나이: 6 },
{ 회원번호: 3, 아이디: "d", 성별: "여", 나이: 55 },
];
1.3.1 나이가 20살 이상, 여성 찾기
- if 문 활용식
//나이가 20살 이상, 여성 구하기
let result = [];
for (let i = 0; i < data.length; i++) {
if (data[i]["성별"] == "여" && data[i]["나이"] >= 20) {
result.push(data[i]["회원번호"]);
}
}
console.log(result); //[3]- filter 활용 식
console.log(data.filter((i) => i["나이"] >= 20 && i["성별"] == "여"));1.3.2 나이 총 합 구하기
//나이 총 합 구하기
let 나이총합 = 0;
for (let i = 0; i < data.length; i++) {
나이총합 += data[i]["나이"];
console.log(나이총합); //99
}
console.log(나이총합 / data.length); //24.75console.log(data.map((i) => i["나이"])); //[ 21, 17, 6, 55 ]
mapreduce활용 식
전체 나이 데이터만 매핑한 후 reduce 로 다 더해주는 식
console.log(data.map((i) => i["나이"]).reduce((a, b) => a + b, 0)); //99
1.3.3 가장 큰 나이 구하기
let 가장큰나이 = 0;
for (let i = 0; i < data.length; i++) {
if (가장큰나이 < data[i]["나이"]) {
가장큰나이 = data[i]["나이"];
}
}
console.log(가장큰나이);//55⬇️이렇게 해도 됨!
Math.max(...data.map((i)=>i.나이));1.3.4 가장 작은 나이는?
가장작은 나이는 가장 큰 값으로 시작하게 해야함 (0이 가장 작으니깐요)
let 가장작은나이 = 1000000;
for (let i = 0; i < data.length; i++) {
if (가장작은나이 > data[i]["나이"]) {
가장작은나이 = data[i]["나이"];
}
}
console.log(가장작은나이); //6⬇️이렇게 해도 됨!
Math.min(...data.map((i)=>i.나이));1.3.5 l의 개수 구하기
let word = "hello world";
count = 0;
for (let i = 0; i < word.length; i++) {
if (word[i] == "l") {
count++;
}
}
console.log(count); //3- console.log(count) 를 } 위로 넣어줘서 조금 헤맨 문제
1.3.6 숫자를 자릿수별로 더하기
//문자열에 있는 숫자 다 더하기
let num = "12390812476";
sum = 0;
for (let i = 0; i < num.length; i++) {
sum += parseInt(num[i]);
// sum += Number(num[i]);
// sum += +num[i];
}
console.log(sum); //43- 나는
parseInt를 활용해서 식을 썼는데, 이 방법 외에 sum += Number(num[i]);sum += +num[i];로 해주는 방법도 있다!
1.3.7 평균구하기
arr = ["33", "29", "11", "55", "47"];
sum = 0;
let average = 0;
for (let i = 0; i < arr.length; i++) {
sum += parseInt(arr[i]);
average = sum / arr.length;
}
console.log(average); //35
- 위 코드는 내가 푼 방법인데 굳이 average 변수를 만들지 않고도 풀 수 있는 문제였다
arr = ["33", "29", "11", "55", "47"];
sum = 0;
let average = 0;
for (let i = 0; i < arr.length; i++) {
sum += parseInt(arr[i]);
}
console.log(sum / arr.length);- 다 더한 값을
arr.length로 나눠주기만 하면 끝 ~
1.3.8 0~100까지 짝수들의 합 구하기
sum = 0;
for (let i = 0; i < 101; i++) {
if (i % 2 == 0) {
sum += i;
}
}- 위 코드는 내가 푼 코드 = 감점인 코드 ,,, 이렇게 짜면 안됩니다
왜냐하면 복잡하고 많은 연산을 하게 함 . 효율적이지 않음
⬇️ 이렇게 작성하는 것이 효율적! 기억하기
for (let i = 2; i < 101; i += 2) {
sum += i;
}
console.log(sum); //2550
1.3.9 'hello world' 뒤집기
word = "hello world";
result = "";
for (let i = 0; i < word.length; i++) {
// result += word[i]; //hello world
result = word[i] + result; //dlrow olleh
}
console.log(result);- 그냥 'hello world' 를 출력할 때는
result += word[i]로 넣어주면 됐었다! - 뭔가 이유를 생각하지 않고 그런갑다 하고 넘어간 부분인데
거꾸로 넣어주기 위해result = word[i] + result;로 해주면 반대로 한 글자씩 순회하며 넣어줌을 보고 코드를 이해하게 되었다.
0번째 순회 'h'+''
1번째 순회 'e' + 'h'
2번째 순회 'l' + 'eh'
3번째 순회 'l' + 'leh'
4번째 순회 'o' + 'lleh'
1.3.10 1차원 점들이 주어졌을 때 , 그 중 가장 거리가 짧은 것의 쌍을 출력
예를들어 S = (1,2,3,8,13,17,20) , result = (3,4)
let arr = [1, 3, 4, 8, 13, 17, 20];
let result = 1000000;
let index = 0;
for (let i = 0; i < arr.length; i++) {
if (result > arr[i + 1] - arr[i]) {
result = arr[i + 1] - arr[i];
index = i;
}
}
console.log(result); //1 => 두 수의 차
console.log(index); //1
console.log(arr[index], arr[index + 1]); //3 4 i arr[i+1]-arr[i] result index
0번째 순회 0 2 2 0
1번째 순회 1 1 1 1
2번째 순회 2 4 1(실행안됨) 1
3번째 순회 3 5 1(실행안됨) 1
4번째 순회 4 4 1 1
5번째 순회 5 3 1 1Devide and conquer 분할정복
내가 정복할 수 있는건?
구구단에서 일단 내가 할 수 있는건 2단!
여기서 점점 늘려가자
어떤걸 가변으로 놔야할지를 생각하면서 논리적으로 생각하면서 정복하기
1.3.11 구구단 분할정복
2단 코드
for (let i = 1; i < 10; i++) {
console.log(`2 X ${i} = ${2 * i}`);
}while 문 이용
i = 1;
while (i < 10) {
console.log(`2 X ${i} = ${2 * i}`);
i++;
}
이중 for문으로 2~9단까지!
// 2-9단까지
for (let i = 2; i < 10; i++) {
for (let j = 1; j < 10; j++) {
console.log(`${j} X ${i} = ${j * i}`);
}
}
2. while 문
2.1 while 문으로 0 ~ 100 까지의 짝수 더하기
i = 2;
sum = 0;
while (i < 101) {
sum += i;
i += 2;
}
console.log(sum);2.2 구구단
i = 2;
let j = 1;
while (i < 10) {
while (j < 10) {
console.log(`${i} X ${j} = ${i * j} `);
j++;
}
j = 1; // 이걸 적어줘야 9단까지 나온다!
i++;
}
3. do while 문
do...while 문법은 while문과 비슷하지만 조건문 이전에 실행문이 있기 때문에 실행문의 코드가 반드시 한 번은 실행된다.
기본문법
do {
실행문;
} while(조건문);let sum = 0;
let i = 0;
do {
i++;
sum += i;
} while (i < 10);
console.log(sum);4. break
반복문이 조건에 따라 종료되기 이전에 종료를 원하면 break로 반복문에서 나올 수 있다. 반복문이 종료되면 그 다음 코드가 실행된다.
let i = 0;
while (i < 100) {
i++;
if (i === 14) {
console.log(i + '살 부터 중학생이 됩니다.');
break;
}
}
console.log('중학교 입학을 축하합니다');- 14살일때 탈출 ! 을 원하는 코드
- 14살 부터 중학생이 됩니다.
중학교 입학을 축하합니다. 를 출력한다
5. continue
continue문은 반복문의 다음 반복으로 이동한다.
실행 후 다음 루프로 넘어간다 - 메모리 잡아먹으니깐 조심해서 써야함
i = 0;
while (i < 10) {
i++;
console.log(i, "start");
if (i > 5) {
continue;
}
console.log(i, "end");
}
console.log("end");/** 보면 1-5일때 if (i > 5) 를 충족시키지 않기때문에 console.log(i, "end"); 까지 같이 출력한다.
1 start
1 end
2 start
2 end
3 start
3 end
4 start
4 end
5 start
5 end
여기서부터는 if (i > 5) 를 충족시키기 때문에 continue 되어서 console.log(i, "end") 를 실행하지않고 다음 반복인 console.log("end"); 를 실행시킨다.
6 start
7 start
8 start
9 start
10 start
end
*/6. 레이블
- 식별자, 일종의 코드블록 네임태그
- 반복문 앞에 레이블을 붙여
break나continue구문과 함께 사용하면 반복문을 컨트롤하기에 용이
4단이 되었을 때 탈출하고 test 로 이동해라
그럼 4단에서 +1 되니깐 5로 시작하게 됨 (4단을 건너 뛰게 되는 것)
for (let x = 2; x < 10; x++) {
test:
for (let y = 1; y < 10; y++) {
if (x === 4) break test;
console.log(`${x} X ${y} = ${x * y}`);
}
}레이블 사용시 주의사항
- 레이블은 반드시
break문 또는continue문 위에 있어야 한다.break문은 모든 레이블에서 사용할 수 있다.continue문은 반복문에서만 사용 가능하다.
7. object(객체) 반복문
7-1. for in 반복문
- 객체에 포함된 모든 프로퍼티에 대한 반복문을 수행
- 반복 가능한 객체가 아니라면
for of를 쓸 수 없다. 이럴때 객테 리터럴에for in사용 - for in 문은 기본적으로 키 값만 출력하는 반복문이다.
value값을 출력하고자 아래 코드처럼 템플릿 리터럴을 활용한다.
for (let i in value) {
console.log(i); //index만 출력한다 => key인셈
console.log(value[i]); //value값
}7-2. Object 시리즈
위의 for in에서 value 값 뽑는걸 불편하게 느껴, 해소하고자 Object 메소드들이 생김.
key 값, value 값, key : value 쌍 값을 배열 형태로 반환하는 메소드
7-2-1. object.keys
Object.keys는key값만 배열 형태로 반환한다.
let 포켓몬 = Object.keys(value3);
console.log(포켓몬);
/**
* [
'피카츄', '라이츄',
'파이리', '꼬부기',
'버터플', '야도란',
'피죤투', '또가스',
'메타몽'
]
*/7-2-2. object.values
Object.values는value값만 배열 형태로 반환한다.
Object.values(pocketmons);
//[1, 2, 3, 4, 5, 6, 7, 8, 9]7-2-3. object.entries
Object.entries는key,value형태의 배열들을 반환
for (let i of Object.entries(value3)) {
console.log(i); //[ '피카츄', 10 ] 이런형태로 출력
}구조분해할당
객체나 배열을 변수로 '분해’할 수 있게 해주는 특별한 문법
for (let [[a, b], j] of [
[[1, 2], 2],
[[1, 2], 4],
]) {
console.log(a, b, j);
}
/**
1 2 2
1 2 4
*/
전개구문
- 활용 예시
let arr1 = [1, -2, 3, 4];
let arr2 = [8, 3, -8, 1];
Math.max(...arr1, ...arr2);
//둘을 merge 해주고 싶을 때
console.log([100, 200, ...arr1, arr2]);
//[ 100, 200, 1, -2, 3, 4, [ 8, 3, -8, 1 ] ]
let str = "hello world";
console.log([...str]);
/**
* [
'h', 'e', 'l', 'l',
'o', ' ', 'w', 'o',
'r', 'l', 'd'
]
*/
7-3. Array(배열) 반복문
7-3-1 . for of 반복문
const languages = [ 'Java', 'Javascript', 'Python', 'Ruby', 'C', 'C++' , 'Node.js', 'Django'];
for (let lang of languages) {
console.log(lang)
}- 차례대로, Java 부터 순서대로 배열에 접근하여 하나씩 저장하여 순서대로 출력한다.
- for문을 써도 되는걸 굳이
for of로 하는 이유는 가독성 측면에서for of가 더 편하게 읽히기 때문
문자열을 거꾸로 나타내는 코드도 for of 로 더 손쉽게 할 수 있다.
let s = "";
for (let i of "hello world") {
s = i + s;
}
console.log(s); //dlrow olleh
Front-End Developer ✨