티스토리 뷰

[JQUERY]자바스크립트

jQuery 005. 배열 list

가산동 2018. 7. 24. 22:33

배열에 대해 알아보자.


아래는 오늘 볼 예제


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html lang="ko">
<head>
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    
    <script>
        $(function(){       // jquery 시작
            
            //배열 List
            
            //배열 생성방법 (문자)
            var fruitList = ['사과','포도','오렌지','체리'];
            
            //배열 생성방법 (숫자)
            var priceList = [1000,2000,3000,4000];
            
            //배열(list)의 순서
            document.write('fruitList 의 첫번째 값 = ',fruitList[0],'<br/>');
            document.write('fruitList 의 두번째 값 = ',fruitList[1],'<br/>');
            document.write('fruitList 의 세번째 값 = ',fruitList[2],'<br/>');
            document.write('fruitList 의 네번째 값 = ',fruitList[3],'<br/>');
            
            //배열(list)의 활용
            document.write(fruitList[0],'는 ',priceList[0],' 원 이다.','<br/>');
            document.write(fruitList[1],'는 ',priceList[1],' 원 이다.','<br/>');
            document.write(fruitList[2],'는 ',priceList[2],' 원 이다.','<br/>');
            document.write(fruitList[3],'는 ',priceList[3],' 원 이다.','<br/>');
            
        });
    </script>
</head>
    <body>
    </body>
</html>
cs



 //배열 생성방법 (문자)

var fruitList = ['사과','포도','오렌지','체리'];


배열은 변수이름 = [값1,값2,값3] 방식으로 저장한다.


//배열 생성방법 (숫자)

var priceList = [1000,2000,3000,4000];


숫자로도 저장가능하다.



//배열(list)의 순서

document.write('fruitList 의 첫번째 값 = ',fruitList[0]);

document.write('fruitList 의 두번째 값 = ',fruitList[1]);

document.write('fruitList 의 세번째 값 = ',fruitList[2]);

document.write('fruitList 의 네번째 값 = ',fruitList[3]);


document.write()는 이전 포스트에서 설해뒀다.

>>[[JQUERY]자바스크립트] - jQuery 003. 출력기능 document.write()


예제를 보면 첫번째 값으로 fuitList[0] 이 오는데, 배열의 경우 첫번째 값은 순서(index) 0 부터 시작한다.


 //배열(list)의 활용

document.write(fruitList[0],'는 ',priceList[0],' 원 이다.');

document.write(fruitList[1],'는 ',priceList[1],' 원 이다.');

document.write(fruitList[2],'는 ',priceList[2],' 원 이다.');

document.write(fruitList[3],'는 ',priceList[3],' 원 이다.');


배열의 활용 방법이다. 배열은 반복문에 특화되어 있는데, 반복문 for , each 는 추후에 알아보자. 


아래는 실행 화면이다. 



사진에서 보이는 문서편집기 활용법은

>>[[JQUERY]자바스크립트] - 어도비 브라켓(ADOBE Brackets) 설치하기

>>[[JQUERY]자바스크립트] - 어도비 브라켓(ADOBE Brackets) 설정하기

>>[[JQUERY]자바스크립트] - 어도비 브라켓(ADOBE Brackets) 제이쿼리(jquery) 연결하기


저작자표시 비영리 변경금지

'[JQUERY]자바스크립트' 카테고리의 다른 글

jQuery 007. 복합연산자 += , -= , *= , /= , %=  (0) 2018.07.26
jQuery 006. 연산자 +-*/%  (0) 2018.07.26
jQuery 004. 콘솔에서 데이터 확인 console.log()  (0) 2018.07.21
jQuery 003. 출력기능 document.write()  (0) 2018.07.21
jQuery 002. 알림창 alert()  (0) 2018.07.21
댓글