> const arrays = ['bolee', 'system', 123, 456]
undefined
> arrays.splice(0, 3, 'add') // 0번째 요소를 기준으로, 3개의 요소 제거, 'add'를 0번째에 추가
(3) ['bolee', 'system', 123] // 제거되는 3개의 요소를 나타냄
> arrays
(2) ['add', 456] // 0번째에 'add'가 추가된 것을 확인할 수 있음
+. 자료의 파괴적/비파괴적처리
자료의 비파괴/파괴적 처리? - JS는 자료 처리를 위해 다양한 연산자, 함수, 메소드를 제공하고, 이는 파괴적/비파괴적 처리로 구분
-[구분 기준] 처리후 원본 상태의 변화 1)파괴적 처리 : 처리후 원본내용변경됨 2)비파괴적 처리 : 처리후 원본내용변경 안됨
1)파괴적 처리 과거에는 컴퓨터 메모리가 부족했기 때문에 배열처럼 거대해질 수 있는 자료는메모리 절약을 위해 대부분 파괴적 처리로 이루어짐 *결과가 기본 자료형인 경우 메모리를 조금만 차지하기 때문에 원본, 결과를 모두 메모리에 저장해도 크게 무리가 없었으나, 배열처럼 크기를 모르는 대상의 원본과 결과를 모두 메모리에 저장하는 것은 위험할 수 있었음
2)비파괴적 처리 메모리가 여유로운 현재는자료 보호를 위해 대부분 비파괴적 처리를 함
1) 비파괴적 처리
a, b를 연결해 c를 만들어도 a, b의 원본내용은 변경되지 않았음
> const a = 'bolee'
undefined
> const b = 'system'
undefined
> const c = a + b
undefined
> c
'boleesystem'
> a
'bolee'
> b
'system'
while 반복문?조건을 기반으로 반복할 때 사용 / 무한루프(if 반복문과의 차이점) *무한루프가 되므로조건을 거짓으로 만들 수 있다는 내용이문장에 포함되어 있어야 함
while (불 표현식) {
문장
}
무한루프(infinite loop)?반복문이 무한 반복되는 것 * while 반복문의 경우 조건이 변하지 않는다면 무한히 반복 실행함
break 키워드?switch 조건문이나 반복문을 벗어날 때 사용
while (true) {
} break
continue 키워드?반복문 안의 반복 작업을 멈추고 반복문의 처음으로 돌아가 다음 반복 작업을 진행
=> break, continue 키워드는 조건식을 적절하게 만들면 필요없는 구문임 => 해당 키워드를 적당히 사용하면 코드가 간결해 보이지만, 그런 적당한 경우는 드묾 => 해당 키워드가 필요 없는 부분에 무리하게 사용하는 경우가 있는데 최대한 자제할 수 있도록 주의해야 함
1. for in 반복문
for (const 반복 변수 in 배열 또는 객체) { 문장 }
배열 요소를 하나씩 꺼내 특정 문장을 실행할 때 사용
for in 반복문은아래와 같은 코드(stuffs[n] 등)를 추가해 사용해야 안정적(예상에서 벗어나지 않는 형태)으로 쓸 수 있는조금 위험한 반복문임 => 따라서 for of, for 반복문을 활용하는 것이 더욱 좋음
입력 코드 1
<script>
const stuffs = ['노트북', '키보드', '마우스']
for (const i in stuffs) {
console.log(i)
}
</script>
출력 결과 1
입력 코드 2
<script>
const stuffs = ['노트북', '키보드', '마우스']
for (const i in stuffs) {
console.log(`${i}번째 준비물 : ${stuffs[i]}`)
}
</script>
출력 결과 2
2. for of 반복문
for (const 반복변수 of 배열 또는 객체) { 문장 }
요소의 값을 반복할 때 안정적으로 사용할 수 있음
입력 코드
<script>
const stuffs = ['노트북', '키보드', '마우스']
for (const stuff of stuffs) {
console.log(`준비물 : ${stuff}`)
}
</script>
출력 결과
+. for in/of 반복문 차이 확인
입력 코드
<script>
const array = ['사과', '배', '귤', '바나나']
console.log('# for in 반복문')
for (const i in array) {
console.log(i)
}
console.log('# for of 반복문')
for (const i of array) {
console.log(i)
}
</script>
출력 결과
3. for 반복문
for (let i = 0; i < 반복횟수; i++) { 문장 }
특정 횟수만큼 반복하고 싶을 때 사용하는 범용적인 반복문
1) for 반복문 기본
입력 코드
<script>
for (let i = 0; i < 5; i++) {
console.log(`${i}번째 반복입니다.`)
}
</script>
출력 결과
2-1) 1부터 100까지 더하기
입력 코드
<script>
let output = 0
for (let i = 1; i <= 100; i++) {
output += i
}
console.log(`1~100까지 숫자를 모두 더하면 ${output}입니다.`)
</script>
출력 결과
2-2) 1부터 100까지 곱하기
입력 코드 : 2-1의 코드에서 output의 초기값 0을 1로 바꾸고, output += i를 output *= i로 바꾸면 됨
<script>
let output = 1
for (let i=1; i<=100; i++){
output *= i
}
console.log(`1~100까지 숫자를 모두 곱하면 ${output}입니다.`)
</script>
출력 코드
항등원(Identity)? - 임의의 수 a와 어떤 수를 연산했을 때 a가 나오게 하는 그 어떤 수 - 어떤 대상에 여러 번 처리하는 코드를 작성할 때!
3) 배열 출력하기
입력 코드
<script>
const stuffs = ['노트북', '키보드', '마우스']
for (let i = 0; i < stuffs.length; i++){
console.log(`${i}번째 준비물 : ${stuffs[i]}`)
}
</script>
출력 결과
4) 반대 순서로 배열 출력하기
for (let i = 0; i < stuffs.length; i++)의 출력 결과의 순서를 반대로 하려면 for (let i = stuffs.length - 1; i >= 0; i--)
입력 코드
<script>
const stuffs = ['노트북', '키보드', '마우스']
for (let i = stuffs.length - 1; i >= 0; i--){
console.log(`${i}번째 준비물 : ${stuffs[i]}`)
}
</script>
출력 결과
4. while 반복문
while (불 표현식) { 문장 }
if 조건문과 공통점?형태가 매우 비슷
if 조건문과 차이점?문장을 한 번만 실행하고 끝나는 것이 아닌불 표현식이 true면 계속해서 문장을 실행함
1) 무한 반복문
입력 코드
<script>
let i = 0
while (true) {
alert(`${i}번째 반복입니다.`)
i += 1
}
</script>
출력 결과 : 확인 버튼을 클릭할 때마다 숫자가 하나씩 증가하며 경고창이 계속 뜸
-다른 프로그래밍 언어에서는 '데이터를 전달받을 때까지 기다린다'와 같은 목적으로 무한 반복문을사용하기도 함 -JS에서 무한 반복을 사용하면 페이지 전체가먹통이 되는 문제가 발생함 -break구문 등을 활용해반드시 무한 반복을 벗어나도록 코드를 구현해야 함
2) while 반복문 기본
입력 코드
<script>
let i = 0
while (confirm('계속 진행하시겠습니까?')) {
alert(`${i}번째 반복입니다.`)
i += 1
}
</script>
출력 결과 : 확인 버튼을 누르면 'i번째 반복입니다.' 경고창이 뜨고, 취소를 누르면 반복이 종료됨
3) 배열 출력하기
입력 코드
<script>
let i = 0
const arrays = [1, 2, 3, 4, 5]
while (i < arrays.length) {
console.log(`${i}번째 숫자 : ${arrays[i]}`)
i++
}
</script>
출력 결과
+. break 키워드
while (true) {
} break
입력 코드 : 몇 번째 반복문인지 경고창을 출력하고 사용자에게 한 번 더 반복 작업을 수행할지 묻는 프로그램
<script>
for (let i = 0; true; i++) {
alert(i + '번째 반복문입니다.')
const isContinue = confirm('계속 진행하시겠습니까?')
if (!isContinue) {
break
}
}
alert('프로그램 종료')
</script>
출력결과
+. continue 키워드
반복문 안의 반복 작업을 맘추고 반복문의 처음으로 돌아가 다음 반복 작업을 진행
입력 코드 : 0~10 사이의 짝수의 합 구하기
<script>
let output = 0
for (let i = 1; i <= 10; i++){
if (i % 2 === 1){
continue
}
output += i
}
alert(output)
</script>
출력 결과 : 홀수일 때는 continue 키워드를 만나 바로 다음 반복 작업으로 넘어가므로 짝수의 합(30)만 출력
@ 예제 문제
1-1) 피라미드 만들기(반쪽)
입력 코드 1 : 중첩 반복문 사용
<script>
let output = ''
for (let i = 0; i < 9; i++) { // 9줄의 피라미드를 만들어야 하므로 9번 반복
for (let j = 0; j < i + 1; j++){
output += '*'
}
output += `\n`
}
console.log(output)
</script>
입력 코드 2
<script>
let output = ''
let num = ''
for (let i = 0; i < 9; i++) {
output += '*'
num += output + `\n`
}
console.log(num)
</script>
출력 결과
이해하는 방법
1. 반복되는 코드는 'output +='이고, 9번 반복됨 => for 반복문으로 i를 9번까지 반복 => for (i = 0; i < 9; i++)