01. 데이터 이펙트 : 1부터 100까지 출력하기
for문을 이용해서 1-100까지 출력하는 예제입니다.
{
for(let i=1; i<=100; i++){ // let i =0 으로 초기화 한후 i 를 100 까지 1씩 증가
console.log(i); // 값을 출력
}
}
// 1,2,3,4,5,6~~~100
02. 데이터 이펙트 : 0부터 50까지 출력하기
for문을 이용해서 1-50까지 출력하는 예제입니다.
{
for(let i=1; i<=50; i++){ // let i =1 으로 초기화 한후 i 를 50 까지 1씩 증가
console.log(i); // 값을 출력
}
}
// 1,2,3,4,5,6~~~50
03. 데이터 이펙트 : 0부터 100까지 짝수만 출력하기
for문을 이용해서 0-100까지 짝수만 출력하는 예제입니다.
{
for(let i=0; i<=100; i+=2){ // i = i + 2 , let i =0 으로 초기화 한후 i 를 100 까지 2씩 증가
console.log(i); // 값을 출력
}
}
// 2,4,8,6,10 ~~ 50
04. 데이터 이펙트 : 0부터 100까지 5의배수 출력하기
for문을 이용해서 0-100까지 5의배수를 출력하는 예제입니다.
{
for(let i=0; i<=100; i+=5){ // let i = 0 으로 초기화 한후 i 를 100 까지 5씩 증가
console.log(i);
}
// if문을 사용해서 출력하기
for(let i=0; i<=100; i++){ // let i = 0 으로 초기화 한후 i 를 100 까지 증가
if( i % 5 == 0)" //만약 i가 5로 나눈후 나머지가 0이면
console.log(i); //값을 출력
}
}
// 5,10,15,20,25,30 ~~ 100
05. 데이터 이펙트 : 1부터 100까지 짝수(파란색) 홀수(빨간색) 출력하기
for문을 이용해서 1-100까지 짝수는 파란색 홀수는 빨간색으로 출력하는 예제입니다.
{
for(let i=1; i<100; i++){ // 변수 i에 0으로 초기화 후 i가100 전까지 i가 1씩 증가
if(i % 2 == 0){ // 만약 i를 2로 나눈 나머지 값이 0 이면
document.write("<span style='color:blue';>"+i+"</span>") // 파란색으로 출력하라
}
if(i % 2 == 1){ // 만약 i를 2로 나눈 나머지 값이 1이면
document.write("<span style='color:red';>"+i+"</span>") //빨간색으로 출력하라
}
}
}
// 1,2,3,4,5,6,~100 //홀수는 빨간색 짝수는 파란색
데이터 이펙트 : 1부터 100까지 합 구하기
for문을 이용해서 1-100까지 합을 예제입니다.
{
let sum = 0;
for(let i=1; i<=100; i++){
sum = i+ sum
}
document.write(sum)
}
//5050
07. 데이터 이펙트 : for문을 이용해서 100칸 테이블 만들기
중첩for문을 이용해서 100칸 테이블을 출력하는 예제입니다.
{
let table = "<table border='1'>"; // 변수에 테이블 코드 저장
for(let i=1; i<=10; i++){ // i를 0으로 초기화 한후 i가 10이 되는 동안 i를 1씩 증가
table += "<tr>"; // tr 추가
for(j=1; j<=10; j++){ // j를 0으로 초기화 한후 j가 10이 되는 동안 j를 1씩 증가
table += "<td>"+j+"</td>"; // td를 10번 반복
}
table += "</tr>"; // /tr 추가
}
table += "</table>"; // /table 추가
document.write(table); // HTMl 화면에 출력
}
// 가로 10 세로 10 칸의 테이블이 만들어짐
08. 데이터 이펙트 : 중첩 for문을 이용해서 구구단 만들기
중첩for문을 이용해서 구구단을 출력하는 예제입니다.
{
for(let i=2; i<=9; i++){ // i를 2로 초기화 한후 i가 9까지 i를 1씩 증가
document.write(i+"단","br>"); //HTML에 i값출력
for(let j=1; j<=9; j++){ // j를 1로 초기화 한후 j가 9까지 j를 1씩 증가
document.write(i + "*" + j + "=" + i*j); // HTML에 i*j값 출력
document.write("<br>"); // 줄바꿈
}
document.write("<br><br>"); // 줄바꿈 2번
}
}
// 2*1=2
// 2*2=4
// 2*3=6
// 2*4=8
// 2*5=10
// 2*6=12
// 2*7=14
// 2*8=16
// 2*9=18
09. 데이터 이펙트 : 테이블 25칸(짝수:빨간색, 홀수/파란색)
짝수 빨간색 홀수 파란색으로 표를 만듭니다.
{
let table = "<table border='1'>"; //테이블 생성
let count =0; //변수 count 초기화
for(let i=1; i<=5; i++){ //for 반복문 i가 1부터 5까지
table += "<tr>"; // 테이블 tr 추가
for(let j=1; j<=5; j++){ // 중첩 반복문 j가 1부터 5까지
count++; //카운터 증가
if(count % 2 == 0){ // 만약 count 값을 나눈 나머지 값이 0 이면
table += "<td style='color: red'>" + count+ "</td>"; //tr 글자를 빨간색
} else { //아니면
table += "<td style='color: blue'>" + count+ "</td>"; //글자를 파란색
}
}
table += "<tr>"; // tr 끝맺음
}
table += "</table>"; //table 끝맺음
document.write(table); //표출
}
//5*5표가 만들어지고 짝수는 빨간색 짝수가 아니면 파란색
10. 데이터 이펙트 : 테이블 25칸(3의배수:빨간색, 5의배수/파란색)
3의배수빨간색 5의배수파란색 나머지는검은색 표를 만듭니다.
{
let table = "<table border='1'>"; //변수 table에 table 생성
let count =0; //변수 카운트 0으로 초기화
for(let i=1; i<=5; i++){ // i가 1에서 5까지 반복
table += "<tr>"; //tr 태그 생성
for(let j=1; j<=5; j++){ //j가 1에서 5까지 반복
count++; //count 1씩 증가
if(count % 3 == 0){ //만약 count값을 3으로 나눈 나머지 값이 0 이면
table += "<td style='color: red'>" + count+ "</td>"; //td에 글자색을 빨간색으로 넣어줌
} else if( count % 5 ==0) { //만약 count값을 5으로 나눈 나머지 값이 0 이면
table += "<td style='color: blue'>" + count+ "</td>"; //td에 글자색을 파란색으로 넣어줌
} else { //아니면
table += "<td style='color: #000'>" + count+ "</td>"; //td에 글자색을 검은색으로 넣어줌
}
}
table += "</tr>"; // tr 태그 끝맺음
}
table += "</table>"; //table 태그 끝맺음
document.write(table); //html 표출
}
//5*5표가 만들어지고 3의배수는 빨간색 5의배수는 파란색 나머지는 검은색
11. 데이터 이펙트 : 배열 데이터에서 10보다 큰수 찾기
배열안에 10보다 큰수를 불러오는 방법입니다.
{
const arr = [1, 3, 5, 7, 9, 11, 13, 15, 17, 19];
// for문
for(let i=0; i<arr.length; i++){ // i 가 arr의갯수 만큼 반복을 돕니다.
if(arr[i] > 10){ // arr의 숫자가 10 이상이면
document.write(arr[i]+","); //document.write로 출력합니다.
}
}
}
//11,13,15,17,19