배열에 대해 정리했습니다.
☆1. 배열객체 Array() 생성 방법입니다.
☆2. 배열리터럴: 새로운 배열을 만드는 데 사용하는 표기법입니다.
★★ (객체 리터럴이 중괄호( {} )를 이용한 표기법이었다면, 배열 리터럴은 대괄호( [] )를 사용)
(1)배열객체를 이용
[배열의 선언]
1) var a = new Array();
- 초기화
a[0] = 100;
a[1] = '가나다';
a[2] = 0;
a[3] = -50;
a[4] = 'abc';
- 배열 출력 (toString()이용한다.)
document.write(a.toString());
[선언과 동시에 초기화]
2) var b = new Array(12, 465, '자바', -0.5, '라면', 10.95); b[0]에 12이 저장되어있다.
var b = new Array(10); 10길이의 배열이다.
- 출력
for(var i=0; i<b.length; i++){
document.write(b[i]);
}
(2)배열리터럴 이용
[배열의 선언]
var score = [ ];
<선언과 동시에 초기화>
var score = ['aa','bb'];
(3)생성자(new) 없이 ([])사용가능
3) var c = [100, 200, 300, 'aaa', 'BBB' ]; c[0]에 100이 저장되어있다.
var c = [10]; c[0]에 10이 저장이다.
- 출력
document.write(c.toString());
(4) 주요 메서드
= 아래의 코드를 통해서 배열의 저장에 대하여 간략하게 설명해 드리겠습니다.
field의 인덱스는 0~3이죠? for문안에서 4번반복을 하게됩니다.
prompt의 입력값으로, 상태글 field[0]가 나타나고, data[0]번지에 입력값이 저장됩니다.
prompt의 입력값으로, 상태글 field[1]가 나타나고, data[1]번지에 입력값이 저장됩니다.
prompt의 입력값으로, 상태글 field[2]가 나타나고, data[2]번지에 입력값이 저장됩니다.
prompt의 입력값으로, 상태글 field[3]가 나타나고, data[3]번지에 입력값이 저장됩니다.
출력문으로 인하여 저장된 field[i]와 data[i]가 출력됩니다.
또한, 배열.join('-')를 하게되면, 각 배열의 요소가 '-'구분자로 나뉘어서 출력되게 됩니다.
아래는 향상된 For문을 사용하고 있죠? 배열을 통해서 사용되는 For문은 두 가지가 있으니까 알아두세요!
- for(var i=0; i<4; i++)
- for(var i in field)
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<body>
<script>
var field= ['사번입력','이름입력','급여입력','부서명입력'];
var data=[];
var b= "<br>";
for(var i in field){
data[i]=prompt(field[i]);
document.write(field[i]+":"+data[i] +b);
//data[j]대신에 j만 출력하면 인덱스값이 나온다
}
document.write(field.join('-'));
</script>
</body>
|
※주의사항
1) 10행 : console.log()란, 개발자도구창에서 결과값이 출력되는 명령어입니다..
2) 각종 태그를 java script에서 출력하기위한 문장을 다시 한번 기억하기바랍니다..!
(document.write("<br>"));
(document.write("<p 총점=>"+ sum+"</p>");
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<head>
<script>
var score= [100,98,12,55,66,77,88,99,67,56]; //10개의 배열
var b= "<br>";
var sum= 0;
document.write("<h1> score 배열 출력 </h1> ");
//for(var i=0; i<10; i++){
for(var i in score){
//console.log(score[i]);
document.write(score[i]+" ");
sum += score[i];
}
document.write("<br>");
document.write("<p> 총점=" +sum+ "</p>");
document.write("평균=" +(sum/score.length)+ "<br>" );
</script>
</head>
|
더보기
<실행결과>
더보기
<예제>
2차원 배열이상을 다차원 배열이라 합니다.
2차원 배열은 수학의 행렬과 같은 자료 구조로 이루어져 있습니다.
프로그래밍에서의 배열은 1차원 배열을 이용해서 2차원 배열을 구현합니다.
아래의 두가지 예를 참고하시기 바랍니다. 2차원 배열의 원소를 출력하는 코드입니다.
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<script>
var arr1 = [1,true,'javaScript']; // 1차원 배열선언한다.
var arr2 = [1, [true, false], [['자바스크립트','스터디'], {prop: '다차원 배열'}]]; // 2차원 배열(다차원 배열)
console.log(arr2[0]); // 1 출력한다.
console.log(arr2[1][0]); // 1번째 배열 인덱스에 있는 0번째 인덱스에 접근 : true 출력한다.
console.log(arr2[1][1]); // 1번째 배열 인덱스에 있는 1번째 인덱스에 접근 : false 출력한다.
console.log(arr2[2][0][0]); // 2번째 배열 인덱스에 있는 0번째 배열의 0번째 인덱스에 접근 : 자바스크립트 출력
console.log(arr2[2][1]); // 2번째 배열 인덱스에 있는 1번째 배열인덱스에 접근 : Object {prop: "다차원 배열"} 출력
console.log(arr2[2][1].prop); // 다차원 배열 출력한다.
</script>
|
반복문을 통해 원소들을 출력하는 코드입니다.
|
1
2
3
4
5
6
7
|
<script>
var arr = [[1,2], [true, false], ['자바스크립트','스터디']];
for (var j = 0; j < arr.length; j++) {
for (var k = 0; k < arr[j].length; k++) {
console.log('arr2[' + j + ']' + '[' + k + '] = ' + arr[j][k] ); } }
</script>
|
'WEB 기초 > Script' 카테고리의 다른 글
| 8. 구구단 구하기 (테이블 이용) (0) | 2018.04.12 |
|---|---|
| 7. 게시판 만들기 (테이블과 spilt이용) (0) | 2018.04.12 |
| 5. 로그인_창 만들기 (0) | 2018.04.12 |
| 4. 조건문을 이용한 메뉴판 (0) | 2018.04.12 |
| 3. 계산기 만들기 (0) | 2018.04.12 |