1차원 배열
| [0] | [1] | [2] |
2차원 배열
| [0][0] | [0][1] | [0][2] |
| [1][0] | [1][1] | [1][2] |
3차원은 입체적인 방식이고 4차원까지 있다고 합니다. 그러나 자주 쓰이는 것은 2차원까지!!
<1차원 배열>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var c1 = [10, 15, 20, 30];
for(i=0; i<=3; i++){
document.write(c1[i]+" ");
}
</script>
</body>
</html>변수 c1에 순서대로 값을 입력하고, 그대로 출력을 해준다. 대신 배열을 정의할 때는 [] 대괄호 안에 넣어줘야한다. 반복문이라서 for문을 사용하는데 주의할 점은 [0]부터 시작한다는 점! 때문에 4가지 숫자가 있다면 i의 값이 0~3까지 되어야 한다. 4까지 하는 경우 숫자 뒤에 undefined(정의가 안 됨) 같이 출력이 된다.
| 10 15 20 30 |
for(i=0; i<=3; i++)
| 10 15 20 30 undefined |
for(i=0; i<=4; i++)
<테이블 안에 값을 넣어보기>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var c1 = [10, 15, 20, 30];
document.write("<table border=1>");
document.write("<tr>");
for(i=0; i<=3; i++){
document.write("<td>" + c1[i] + "</td>");
}
document.write("<tr>");
document.write("</table>");
</script>
</body>
</html>
html에서 테이블을 넣는 것과 같은 공식을 사용한다. 대신에 출력문 안에 넣어 준다.
<2차원 배열>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>2차원</title>
</head>
<body>
<script>
//객체 생성
var student = new Array(Array('강민성','컴공학과','98','97'),
Array('김정아','정보학과','88','95'),
Array('신은수','행정학과','98','97'),
Array('이은준','물리학과','98','97'),
Array('강아린','법학과','98','97')
);
document.write("<table border=1>");
document.write("<th>이름</th> <th>학과</th> <th>중간</th> <th>기말</th>");
for(i=0;i<=4;i++){
document.write("<tr>");
for(j=0;j<=3;j++){
document.write("<td>" + student[i][j] +"</td>");
}
document.write("</tr>");
}
document.write("</table>");
</script>
</body>
</html>1차원 배열의 초기화 및 선언을 할 때는 A = [10]; 굉장히 간단했지만 2차원 배열에서는 New로 새로운 객체를 만들어줘야한다. var student 객체명 = new Array(); 새로운 배열 객체를 만든다는 뜻. Array(Array('강민성','컴공','98','97')); Array안에 또 선언을 해줘야한다. 그리고 출력을 할 땐 중첩 for문을 이용해서 불러와야한다. 1차원 배열은 일반 for문, 2차원 배열은 2중 for문! student[i][j] 라고 생각하면 쉽다. 추가로 테이블까지 씌워봤다.
'개발일지 > JavaScript + jquery' 카테고리의 다른 글
| [js] checkbox에 입력된 값을 읽고 출력(취미 체크) (0) | 2021.09.08 |
|---|---|
| [js] radio 버튼 읽고 출력하기 (성별체크) (0) | 2021.09.08 |
| [js] While문 + Do While문 (0) | 2021.09.07 |
| [js] 중첩 for문 - 별찍기 (0) | 2021.09.07 |
| [js] 1부터 100까지의 합을 구하기(반복문-for) (0) | 2021.09.07 |
