2020.11.03 #TIL
오늘 학원에서 iframe을 배웠다. 처음 배우는 거라서 신기하고 재밌었다. 그리고 국회도서관 홈페이지를 만들었다.
저녁에는 자바스크립트 반복문의 효용성과 제어, 중첩사용과 함수의 형식과 효용에 관해 공부했다.
iframe
| - 외부 링크나 파일, html을 불러오는 기능 - html에 작성 - facebook의 경우 developers.facebook.com/docs/plugins/page-plugin/ 에서 링크 복사 가능 *작성법* <iframe src="링크" frameborder="0" marginwidth="0" marginheight="0" width="600" height="400"> </iframe> |
1. javascript 반복문
1) 반복문의 효용성
- 반복문이 없다면?
'coding everybody'를 10번 출력하고 싶을때,
document.write('coding everybody');를 10번 copy & paste 해야한다
10번의 copy & paste 반복작업을 반복문으로 바꾸면 아래와 같이 간단히 쓸 수 있음.
|
for(i=0; i<10; i++){ document.write('coding everybody'); } |
반복작업을 반복문으로 쓰면 코딩이 간단해지고 추후 수정이 용이하다.
2) 반복문의 제어 (break, continue)
- 계속 반복되는 반복문을 멈추거나 일시정지 후 실행하고 싶다면 어떻게 해야할까?
① break
: 반복작업을 중단하고 싶을 때
|
ex) for(var i=0; i<10; i++){ if(i===5){ break; } document.write('coding everybody'+i+'<br>'); } |
결과) |
- i가 5가 되면 if구문의 break가 실행되서 전체 반복문이 중단된다.
(반복문 안에 조건문을 넣을 수 있고, 반대 경우도 가능하다)
② continue
: 지점에서 일시정지 하고 다시 반복문 수행
|
ex) for(var i=0; i<10; i++){ if(i===5){ continue; } document.write('coding everybody'+i+'<br>'); } |
결과) |
- i가 5가 되면 if구문의 continue가 실행되서 일시정지 했다가 i=6이되면 다시 반복문 실행됨
2) 반복문 중첩사용과 디버거
- 반복문 안에는 반복문이 또 들어갈 수 있다.
ex) coding everybody 00 ~ 99까지 나오게 만든다면?
|
for(var i=0; i<10; i++){ for(var j=0; j<10; j++){ document.write('coding everybody'+i+j+'<br>'); } |
결과) |
- i가 한 번 실행될때 j는 10번 실행하게 되고 전체가 10번을 반복해서 조건이 끝나면 멈추게 됨
2. javascript 함수
1) 함수란?
- function, 하나의 로직을 재실행할 수 있도록 하는 것으로 코드의 재사용성을 높인다
- 함수의 형식
|
function 함수명([인자...[,인자]]){ 코드 return 반환값 } |
ex)
| function numbering( ) { //numbering 이라고 함수를 정의 document.write(1); } numbering( ); //numbering 이라고 정의된 함수 실행(호출) // 괄호가 없다면 js가 numbering을 변수로 인식하게됨 |
ex2)
| function numbering(){ i=0; while(i<10){ document.write(i); i++ } } numbering(); numbering(); numbering(); |
결과) |
- numbering();을 쓸때마다 함수가 실행되서 코드 작성이 간편해짐
- 반복조건이 i<20 로 바뀐다면 함수식만 바꾸면 함수 실행된 부분이 일괄적으로 바뀌게 됨(수정이 용이함)
- 즉, 함수를 사용하면 코드의 재사용성, 유지보수의 용이성, 코드의 가독성이 증가하게되고 이것은 프로그래밍의 궁극적인 목표라고 할 수 있음.