04-1 배열
배열만들기
- 대괄호[...] 사용
배열 요소에 접근하기
기본형태
배열[인덱스]
배열 요소 개수 확인하기
기본형태
배열.length
배열 뒷부분에 요소 추가하기
기본형태
배열.push(요소)배열[인덱스] = 요소 // 이런식으로 특정 인덱스에 강제로 추가할 수도 있다. 비어있는 인덱스는 'empty'로 표현된다.
배열 요소 제거하기
- 인덱스로 제거하기
기본형태
배열.splice(인덱스, 제거할 요소의 개수)
//splice()는 요소 일부를 제거한뒤 붙이는 것, 중간에 다른 요소를 넣고 붙이는 것도 가능하다.
//'인덱스'로부터 '개수'개의 요소를 제거한다는 의미
- 값으로 요소 제거하기
기본형태
const 인덱스 = 배열.indexOf(요소)
배열.splice(인덱스, 1)
//indexOf()는 배열 내부에 요소가 있을 경우 인덱스를 리턴한다.요소가 없을때는 -1을 리턴한다.예시
배열의 특정 위치에 요소 추가하기
기본형태
배열.splice(인덱스, 0, 요소)
//'인덱스'번째에 아무것도 제거하지않고 '요소'가 추가된다.
자료의 비파괴와 파괴
-비파괴적 처리: 처리 후에 원본 내용이 변경되지 않음.
-파괴적 처리: 처리 후에 원본 내용이 변경됨.
// 메모리가 여유로운 현대의 프로그래밍 언어와 라이브러리는 자료 보호를 위해서 대부분 비파괴적 처리를 한다.
p.173
확인문제 3번
1) 파괴적처리 비파괴적 처리
2) 파괴적 처리
3) 비파괴적 처리
4) 비파괴적 처리
04-2 반복문
for in 반복문
기본형태
for (const 반복 변수 in 배열 또는 개체) {
문장
}// for in 반복문은 배열의 i번째 반복이 필요할때 쓸수 있을것 같다. 그러나 살짝 복잡한 추가 코드를 사용하지 않으면 안정성이 떨어지기 때문에 for of, for 반복문을 활용하는 것이 좋다.
for of 반복문
기본형태
for (const 반복 변수 of 배열 또는 객체) {
문장
}
//for in 반복문과 다르게 반복 변수에 요소의 값이 들어감.
for 반복문
기본 형태
for (let i = 0; i < 반복횟수; i++) {
문장
}
//다른 반복문과 다르게 반복 변수를 let 키워드로 선언하는 것에 주의한다.
//i는 index의 약어이다.
예제
1부터 N까지 곱하기
<script>
//곱하기 이기때문에 output 값을 1로 초기화한다. 0으로 하면 0이 나온다.
//어쩌면 그게 문제의 원래의도 였을지도...? 다시 읽어보니 아니다 문제는 1~100까지의 곱이다.
let output = 1
for (let i = 1; i <= 100; i++) {
output *= i
}
//백틱``을 사용하여야 한다.
alert(`1~100까지 숫자를 모두 곱하면 ${output} 입니다.`)
</script>
for 반복문과 함께 배열 사용하기
- '배열의 length 속성 - 1 부터 0까지 하나씩 빼면서 반복한다' 와 같은 형태로 작성하여 반복을 역으로 돌릴 수도 있다.
while 반복문
기본형태
while (불 표현식) {
문장
}
//불 표현식이 true이면 문장을 계속 실행- while 반복문의 경우 조건을 거짓으로 만들 수 있는 내용이 문장에 포함되어야 한다. 그렇지 않으면 무한 루프(infinite loop)에 빠질 수 있다. 이 때 break, confirm() 구문 등을 사용할 수 있다.
- 횟수를 기준으로 반복할 때는 코드를 간결하게 구현할 수 있는 for 반복문을 사용하는 것이 훨씬 편하다. while 반복문은 조건에 큰 비중이 이있을 때 사용하는 것이 좋다.
break 키워드
반복문을 벗어날 때 사용하는 키워드
활용예시
<script>
// 반복문
for (let i = 0; true; i++) {
alert(i + '번째 반복문입니다.')
// 진행 여부를 물어봅니다.
const isContinue = confirm('계속하시겠습니까?')
// 확인=true 로 출력된다. 그러나 !부정연산자가 붙어있어서 'false'로 변환한다.
// 따라서 확인을 클릭하면 break가 실행되지 않음.
if (!isContinue) {
break
}
}
// 프로그램의 종료를 확인합니다.
alert('프로그램 종료')
</script>
continue 키워드
반복문안의 반복 작업을 멈추고 반복문의 처음으로 돌아가 다음 반복 작업을 진행.
활용예시1
<script>
// 반복문
for (let i = 0; i < 5; i++) {
// 현재 반복 작업을 중지하고 다음 반복 작업을 수행합니다.
// 즉, continue를 만나면 alert를 실행하지 않습니다.
continue
alert(i)
}
</script>- 반복문의 조건식을 적절하게 만들면 break나 continue는 필요 없는 구문이다. 필요없는 부분에 무리하게 사용하지 말고 최대한 자제할 수 있도록 주의하자.
중첩 반복문을 사용하는 피라미드
중첩 반복문 사용하기 (1)
- 첫번째 for문을 쓰고 그다음에는 어떻게 해야 할지 감조차 오지 않았다. 더 고민해봤자 시간낭비인것 같아 답지를 봤다.
<script>
//? 어떤 변수를 선언한건지 의미를 모르겠다.
let output = ''
for (let i = 1; i < 10; i++) {
for (let j = 0; j < i; j++) {
output += '*'
// 0에서 * 하나를 더했기 때문에 *이 하나 붙는 걸까?
}
output += '\n'
}
// i=1, j=0 *\n
// i=2, j=1 **\n
// i=3, j=2 ***\n
// i=4, j=3 ****\n
// i=5, j=4 *****\n
// i=6, j=5 ******\n
// i=7, j=6 *******\n
// i=8, j=7 ********\n
// i=9, j=8 *********\n
console.log(output)
</script>
중첩 반복문 사용하기 (2)
- 이번 문제도 역시나 감이 오지 않았다. 약 30분간 고민을 하다가 답을 보았다. 생각보다 단순했다.
<script>
// output을 초기화하는 개념
let output = ''
for (let i = 1; i < 15; i++) {
for (let j = 15; j > i; j--) {
output += ' '
}
for (let k = 0; k < 2 * i - 1; k++) {
output += '*'
}
output += '\n'
}
// i=1, j=15 k=0 0 < 1 이므로 1개 반복(0) : 공백 15개 *\n
// i=2, j=14 k=1 1 < 3 이므로 3개 반복(0~2) : 공백 14개 ***\n
// i=3, j=13 k=2 2 < 5 이므로 5개 반복(0~4) : 공백 13개 *****\n
// i=4, j=12 k=3 3 < 7 이므로 7개 반복(0~6) : 공백 12개 *******\n
console.log(output)
</script>
p.192
확인문제 2번
실행 결과 예측
3,6,9
<script>
// const로 array 상수를 선언해도 상관없다.
const array = []
// const가 아닌 let으로 변수를 선언해야 한다.
for (let i = 0; i < 3; i++) {
array.push((i + 1) * 3)
}
console.log(array)
</script>
확인문제 3번
정답!! for 문을 읽고 쓰는 내가 기특하다 ㅋㅋㅋ
<script>
let output = 1
for (let i = 1; i < 101; i++) {
output *= i
}
console.log(`1~100의 숫자를 모두 곱하면, ${output}입니다.`)
</script>확인문제 4번
풀어내지 못했지만 그래도 얼추 감을 잡고 했다. 장족의 발전이다.
<script>
// 변수를 선언합니다.
let output = ''
const size = 5
/* 나의 오답
for (let i = 1; i < 6; i++) {
for (let j = size; j > i; j--) {
output += ' '
}
for (let k = 0; k < 2 * i - 1; k++) {
output += '*'
}
output += '\n'
}
for (let l = 1; l < 5; l++) {
for (let m = 0; m < l; m++) {
output += ' '
}
for (let n = size - 1; n >= 0; n--) {
output += '*'
}
output += '\n'
} */
// 반복합니다.
for (let i =1; i <= size; i++) {
for (let j = size; j > i; j--) {
output += ' '
}
for (let k = 0; k < 2 * i - 1; k++) {
output += '*'
}
output += '\n'
}
for (let i = size -1; i > 0; i--) {
for (let j = size; j > i; j--) {
output += ' '
}
for (let k = 0; k < 2 * i - 1; k++) {
output += '*'
}
output += '\n'
}
// 출력합니다.
console.log(output)
오늘의 총평
오늘 그래도 Chapter 4까지 끝낼수 있어서 좋았다. if문 for문을 읽고 이해할 수 있는 것은 크나큰 수확이다. 어쩌면 나 재능이 조금은 있을지도 (코찡긋) 그렇지만 아직은 갈길이 멀다. 그리고 나는 일도 병행해야 한다. 남들 배 이상해내야 하는 것은 기정사실이다. 그런데 재미가 있다 아직일까? 앞으로도 일까?
기술매니저 Q&A
Q: 결과는 같게 출력되어도 코드는 다를수가 있는데, 어떤 차이가 있는가? 어떻게 하는 것이 개발자로서 잘 하는 것인가?
성향,코드 스타일
1. 가독성- 남이봐도 어떤 코드를 쓴건지 알수 있는가?
2. 성능
3. 컨벤션
프리티어 사용- 코드 스타일을 맞춘다
간단한 조건문이나 for문에서는 성능차이가 없다.
복잡해지면 성능의 차이가 있을 수 있다.
그러나 구현이 먼저다. 성능은 다음. mvp (최소기능단위) 부터 맞춘다.
성능도 생각하는건 고급개발자 단계
최소한의 기간으로 최대의 성능을 뽑는 개발자가 최고
생각나는대로 짜고 버그 찾아내고 다듬어 내고, 이런 식으로 통상적으로 진행한다.
Q: 사이드 프로젝트 같은 것을 진행하면 어떤 유익이 있을까?
경험으로 봤을때는 굉장히 유용하다.
사이드 프로젝트를 진행하면서 실력을 쌓던지, 이력서를 지속적으로 회사에 넣던지 그것은 개인의 선택
그러나, 둘다를 한번에 하기는 힘들것이다.
졸업하면 실력은 비슷해진다.
협업, 포트폴리오 만들어서 론칭까지 했다. 가 최고의 경험
'Hanghae99' 카테고리의 다른 글
| 221109 TIL Chapter 05 함수 첫번째 시간 (0) | 2022.11.10 |
|---|---|
| 221109 TIL 사전시험 문제풀이 (0) | 2022.11.09 |
| 221108 TIL Chapter 03 조건문 (0) | 2022.11.08 |
| 221107 TIL Chapter 02 자료와 변수 (0) | 2022.11.07 |
| 221107 TIL Chapter 01 자바스크립트 개요와 개발환경 설정 (0) | 2022.11.07 |
