배열객체연습
이를통해서 알수 잇는 것은
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<body>
<script>
var b="<br>";
var a1=[];
document.write(a1.length +b);
var a2=['oracle','java','html'];
document.write(a2.length +b);
var a3=[100]; //100이라는 숫자 하나
document.write(a3.length +b);
var a4=new Array();
document.write(a4.length +b);
var a5=new Array('oracle','java','html');
document.write(a5.length +b);
var a6=new Array(10); //10개의 배열
document.write(a6.length +b);
</script>
</body>
|
<코드결과>
이번에는 a5에 oracle, java, html을 미리 저장한 상태에서
0번지에 sql에 값을 변경
3번지에 javascript를 삽입
4번지에 100 (int타입)를 삽입
5번지에 function(){ alert("a5[5]함수"); }; 를 추가적으로 더 저장해준다.
그리고 최종적으로 a5배열의 길이를 조회해보도록 하면, 7이 나올 것 같지만 6이 나오게된다.
|
1
2
3
4
5
6
7
8
9
10
|
<script>
var b="<br>";
var a5=new Array('oracle','java','html');
a5[0]='sql'; //수정
a5[3]='javascript'; //삽입+ 4개
a5[4]=100; //다른 타입
a5[5]=function(){alert("a5[5]함수");};
document.write(a5.length +b); //동적길이
</script>
|
위 코드와 연결시켜서 만들어진 값들을 출력도 해봐야겟죠?
첫번째 출력문 :
document.write(a5.join(':') +b);를 통해서 값들마다 구분자 :를 넣는다.
두번째 출력문 :
for(var i in a5){ document.write(a5[i]+":"); }를 통해서 반복문을 통해 반복할때마다 구분자 :를 넣는다.
세번째 출력문 :
for(var i in a5){ if(typeof(a5[i])=='function'){ a5[i](); } }를 통해서 반복문을 통해 a5[i]의 자료형이 function일때, 그 값이 실행되도록 한다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
//1번 출력//////////////////////////////////
document.write(a5.join(':') +b); //추가데이터
//2번 출력//////////////////////////////////
for(var i in a5){
document.write(a5[i]+":");
}
//a5 배열 함수 존재하면 실행
for(var i in a5){
if(typeof(a5[i])=='function'){ //타입을조사해서 function이 나올때만 실행해라
a5[i]();
}
}
|
<코드결과>
그렇다면, 더 심화적으로 다음의 내용도 연결시켜서 출력해보도록 하겠습니다.
a5.unshift('bigdata')를 통해서 배열의 시작에 bigdata를 저장한다. (밀어내기식)
a5.push("spring")를 통해서 배열의 끝에 저장한다.
따라서,
첫번째 출력문:
document.write(a5.shift() +b)를 통해 배열의 시작값을 출력한다.
(이때, a5.shift란 배열의 시작값을 조회함과 동시에 삭제하는 것을 말한다)
두번째 출력문:
document.write(a5.pop() +b)를 통해 배열의 끝 값을 출력한다.
(이때, a5.pop란 배열의 끝 값을 조회함과 동시에 삭제함을 의미한다)
추가적으로,
(1) 모든데이터의 조회는 join/ 원하는 데이터의 조회는 indexof
(2) stack에서의 pop과 push는 쌍이고, shift와 unshift는 queue처럼 쓸수있다.
(3) join은 조회할떄쓴다. 반복문없이 저장, 수정, 삭제, 조회
※ 1. 반복문을 써도 되고, 2. 반복문없이 join만이용해서 배열을 조회할 수 있다. 인덱스로만쓰느게 아니라 메서드로만 조회한다.
|
1
2
3
4
5
6
7
|
//메소드
a5.unshift('bigdata'); //배열의 시작을 저장한다. 뒤로 밀려난다.(수정이 아니다. 원래있는 데이터가 빌려간다)
a5.push("spring");// push: 배열의 끝을 저장한다
document.write(a5.shift() +b)
document.write(a5.pop() +b)
//a5.shift();// shift: 배열의 시작값을 삭제
//a5.pop(); // 매개변수가 없기때문에 삭제한다. 배열의 끝을
|
<코드결과>
마지막으로, 위와는 별개의 코드로 또 연습을 해보겠습니다.
가장 먼저 var a7= [100,89,120,45,40,1,560];를 생성했을경우, a7.sort를 통해 정렬시킨다.
오름차순을 하기 위해서는 a7=a7.sort( function(a,b){ return a-b; });와 같이 앞매개변수- 뒤매개변수를 하면된다.
두번째로는 a7= a7.slice(3);를 통해 index값이 3미만까지는 짜른다는 것을 의미한다.
세번째로는 a7= a7.filter(function(a){return a>50;})를 통해 함수의 매개변수가 50보다 클경우에만 저장되도록한다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<script>
var a7= [100,89,120,45,40,1,560]; //배열을 만들고
a7=a7.sort( function(a,b){ return a-b; }); //정렬을 시키고
//a7.sort();
//charAt[0] 첫자리만 비교해서 정렬되어진다. 마치 문자열의 나열순서처럼 보여진다. 1 2 3이 아니고 1 10 100으로 순서나열되니까. 문자열나열순서
// 배열의 기본 정렬은 문자열 상태임으로 간주한다.
document.write(a7.join("--") +b); //--로 구분자를 넣어서 출력한다(조회한다)
a7=a7.slice(3); //3이전은 무시하고 조회, 배열을 짜르는 것을 말한다
//a7=a7.slice(3,5); //3부터 5까지만 조회
document.write(a7.join("--") +b);
//////////////////////////////////////////////////////////////////////////////////////////////////
var a9= [100,89,120,45,40,"Java","java","자바"];
a9=a9.filter(function(a) {return a> 50;} ) //true인것만 모으는것이다, 문자열은 유니코드에 의해 안나온다.
document.write(a9.join("--")+b);
</script>
|
<코드결과>
'WEB 기초 > Script' 카테고리의 다른 글
| 16. 다양한 객체변환 (0) | 2018.04.12 |
|---|---|
| 15. 예외처리란, (0) | 2018.04.12 |
| 13. 타이머란? (+ 게시판의 입력을 타이머로 응용) (0) | 2018.04.12 |
| 12. 객체란? (0) | 2018.04.12 |
| 11. Date를 이용한 도서 반납 프로그램 (0) | 2018.04.12 |