Array object

Array Object는 여러 개의 변수가 필요할 때 변수 이름을 여러 개 만들지 않고 new Keyword 를 사용하여1 개의 변수 이름에 0번 부터 index를 붙여 사용하는 편리한 Object라고 할 수 있습니다. 특히 차후에 변수가 더 필요 하다든지 필요가 없어서 삭제 한다든지 할 때 더 더욱 편리하져...
new

new Keyword는 Array, Date 등의 Object를 만들 때 사용하는 Keyword로서 사용법은 아래와 같습니다.
입력

var 변수명 = new Array(i) // i는 사용할 element의 개수

또는

var 변수명 = new Array("element[0]", "element[1]", ......) // 사용할 element 이름을 직접 나열

Element 개수로 Array한 예제

<html>
    <head>
        <title>Element 개수로 Array한 예제</title>
    <script type="text/javascript">
    <!--
    var fam_name = new Array(6) // 변수 fam_name 선언하고 6개의 element를 사용
    fam_name[0] = "Jane Egil"
    fam_name[1] = "Tod"
    fam_name[2] = "Herold"
    fam_name[3] = "Stacy"
    fam_name[4] = "Kate Jim"
    fam_name[5] = "Bernard"
    
    for (i=0; i<fam_name.length; i++)
    // element 개수(length) 만큼 1씩 증가하며 for loop 반복한다. 조건식을 i<6 으로 줄 수도 있지만
   length Method를 사용하면 변수가 추가 / 제거 될 때 수정할 필요 없음.
    {
    document.write(fam_name[i] + "<br />") // [0] ~ [5] 까지 6개의 element 출력
    }
    // -->
    </script>
    </head>
    <body>
    
    </body>
</html>

Element 나열하여 Array한 예제

<html>
    <head>
        <title>Element 개수로 Array한 예제</title>
    <script type="text/javascript">
    <!--
    // 변수 fam_name 선언하고 6개의 element를 comma로 구분하여 나열.
    var fam_name = new Array("Jane Egil", "Tod", "Herold", "Stacy", "Kate Jim", "Bernard")
    
    for (i=0; i<fam_name.length; i++)
    // element 개수(length) 만큼 1씩 증가하며 for loop 반복한다. 조건식을 i<6 으로 줄 수도 있지만
   length Method를 사용하면 변수가 추가 / 제거 될 때 수정할 필요 없음.
    {
    document.write(fam_name[i] + "<br />") // [0] ~ [5] 까지 6개의 element 출력
    }
    // -->
    </script>
    </head>
    <body>
    
    </body>
</html>

Array Object의 Method

NN : Netscape Navigator, IE : Internet Explorer (Property와 Method를 처리하는 최소 브라우저 버전)

Array Object Methods
length	Array에 포함된 element(변수)의 개수 return. ***new Keyword로 Array object를 만든 후에 사용합니다.	3.0	4.0
concat()	Array element 중 2개 의 element를 합친 값을 return	4.0	4.0
join()	Array에 사용된 element 모두를 합친 값을 return	3.0	4.0
reverse()	Array에 사용된 element 의 순서를 역(reverse)으로 나열한 값을 return	3.0	4.0
slice(element[i])	Array에 사용된 element 중 특정 순번( [i] ) 의 element 값 return	4.0	4.0
sort()	Array에 사용된 element 들을 오름 차순으로 정렬	3.0	4.0

Array object의 Method

<html>
    <head>
        <title>Array object의 Method</title>
    <script type="text/javascript">
    <!--
    //new Keyword로 array object 생성하고 element 6개 사용 [0] ~ [5]
    var fam_name = new Array("Jane Egil","Tod","Herold","Stacey","Kate Jim","Bernard")

    var temp = fam_name.length //array에 사용된 element수 return
    document.write("Element의 개수는 : " + temp + "<br />")
    
    var temp = fam_name[2].slice() 
    document.write("fam_name[2]만 빼내면 : " + temp + "<br />") 

    var temp = fam_name[0].concat( ", " + fam_name[3])
    document.write("fam_name[2]와 fam_name[3]을 합치면 : " + temp + "<br />")
    
    var temp = fam_name.join()
    document.write("Element 전부를 합치면 : " + temp + "<br />")
    
    var temp = fam_name.sort()
    document.write("fam_name을 정렬하면 : " + temp + "<br />")

    var temp = fam_name.reverse()
    document.write("fam_name을 역순으로 나열하면 : " + temp + "<br />")
    // -->
    </script>
    </head>
    <body>
    
    </body>
</html>

Array 를 이용한 시스템에 설치된 font 모양 보기 예제

아래의 예제는 element를 나열하는 방법으로 font-family 들을 나열하고 table 속에 영문 및 한글의 sample을 출력하도록 한 예제입니다. W3C에 있는 sample이며 추가 하고 싶은 글꼴이 있으면 단순히 family name을 추가하므로서 간단히 글꼴을 볼 수 있습니다. 만약 아래의 글꼴 중에서 여러분 컴퓨터에 설치된 글꼴이 아닌게 있으면 회색 글꼴(Default)로 보이게 됩니다. 이와 같이 Array Object는 일일히 변수를 지정하지 않고도 마치 변수를 지정한 것과 같은 기능을 제공해 주는 Object로서 반드시 알아야 될 Object라고 할 수 있습니다.
Source code

<html>
<head>
<title>Array 를 이용한 시스템에 설치된 font 모양 보기 예제</title>
<style type="text/css">

</style>
</head>
<body>
<script Language="JavaScript">

</script>
</body>
</html>

Tel. 042-353-2371

평일 오전 9시 ~ 오후 7시

기업은행

010-8649-6758

예금주:제주사랑(송진아)

Array object