끄적끄적

자바스크립트 세번째 요약정리

컴퓨터/JavaScript
2016. 11. 6. 14:10
반응형

자바스크립트 세번째 요약정리



3강 자바스크립트 내장객체

- Array 객체

  -> 여러 Date를 하나의 이름으로 저장하고 다루기 위해 사용하는 객체

- String 객체

  -> 글자의 모양을 지정하거나 문자열을 처리하기 위해 사용하는 객체

- Date 객체

  -> 날짜와 시간을 표시하거나 설정

- Event 객체

  -> 로컬컴퓨터에서 발생하는 이벤트에 관한 속성 정보를 알려주는 객체

- Math 객체

  -> 수학 계산을 위해 사용되는 객체

- Function 객체

  -> 함수를 만들때 사용하는 객체

- Screen 객체

  -> Local컴퓨터의 화면의 해상도나 색상에 관한 정보를 알기 위한 객체

- Number 객체

  -> 문자로된 숫자 단어를 실제 숫자로 바꾸어 주는 객체

- Boolean 객체

  -> bool형식의 값을 가지는 객체를 만들어주는 객체

 

 

 

 

1. 배열을 만들어 주는 Array 객체

- 여러 Date를 하나의 이름으로 저장하고 다루기 위해 사용하는 객체

- 형식

    배열객체명 = new Array()

    배열객체명.method

- 예

    myFile = new Array('최재민', '대한민국', 7)

    myFile.length

    document.write(myFile[2]);

    => myFile[0]= 서진숙

       myFile[1]= 대한민국

       myFile[3]= 7

- property

  -> 배열객체명.length

     배열에 있는 요소의 개수를 반환

 

  ----------------------------------------------------

      method      |               설명

  ----------------------------------------------------

   concat()       |  두배열을 연결시켜 하나의 배열로 반환

  ----------------------------------------------------

   join()           | 배열에 있는 모든 값을 합쳐 하나의 문자열 반환

  ----------------------------------------------------

   reverse()     | 배열의 내용을 역순으로 반환

  ----------------------------------------------------

   slice()         | 배열의 특정 부분을 반환

  ----------------------------------------------------

   sort()          | 정렬된 배열 반환

  ----------------------------------------------------


<html>

<head>

</head>

<body>

<script language="javascript">

 

a=new Array("중앙","사이버","교육",2001)

 

aa=new Array(4); // 배열 각각을 초기화 시키고 값을 넣어줌

aa[0]="중앙"

aa[0]="사이버"

aa[0]="교육"

aa[0]=2001

 

b=a.length

c=a.join("+")

d=a.slice(1,3)

a2=new Array("21C","실전자바스크립트")

e=a.concat(a2)

f=a.reverse()

a3=new Array(30,10,50,40,20)

g=a3.sort()

</script>

</body>

</html>


2.문자열을 처리하는 String 객체

- 글자의 모양을 지정하거나 문자열을 처리하기 위해 사용하는 객체

- 형식

    변수명 = new String("문자열");

    변수명.method

    변수명.property

- 예

    myMsg= new String("안녕하세요")

    myMsg.length

    document.write(myMsg.substring(0,2));

 

  ----------------------------------------------------

      method          |               설명

  ----------------------------------------------------

   anchor()           | 문장이 있는 위치로 현재 페이지 이동

  ----------------------------------------------------

   charAt()            | 지정한 인덱스스에 있는 문자 반환

  ----------------------------------------------------

   indexOf()          | 찾는 문자열의 index의 위치를 반환

  ----------------------------------------------------

   substring(숫자1,숫자2) | 숫자1에서 숫자2 사이의 문자열 반환

  ----------------------------------------------------

   toLowerCase()  | 문자열을 소문자 형태로 반환

  ----------------------------------------------------

   replac()            | 특정문자열을 새롭게 지정한 문자열로 대치

  ----------------------------------------------------


<html>

<head>

<title>소스5-2</title>

<script language="javascript">

document.write("[Top]".anchor("top")+"<p>")

document.write("중앙".link("http://www.joins.com")+"<br>")

 

a="자바스크립트배우기"

document.write("\"자바스크립트배우기\"의 길이 : "+ a.length+"<br>")

document.write("charAt(8)의 결과 : "+a.charAt(8)+"<p>")

 

document.write("concat('화이팅')의 결과 : \

"+a.concat("화이팅")+"<br>")

b=new String(" 중앙사이버교육과 함께 ")

document.write("concat(b,'웹사이트 만들기')의 결과 : \

"+a.concat(b,"웹사이트 만들기")+"<br>")

document.write("indexOf('배')의 결과  : " +a.indexOf("배")+"<br>")

document.write("indexOf('java')의 결과 : " a.indexOf("java")+"<p>")

 

c=new String("자스크립트1 자바스크립트2")

document.write("lastIndexOf('자')의 결과 : \

"+c.lastIndexOf("자")+"<br>")

 

document.write("slice(2,6)의 결과 : " +c.slice(2,6)+"<br>")

document.write("subString(2,6)의 결과 : " +c.substring(2,6)+"<br>")

document.write("substr(2,6)의 결과 : " +c.substr(2,6)+"<br>")

 

//별로 사용하지 않음

document.write(("자바스크립트".big()).fontcolor("blue")+"를 ".fixed())

document.write(("중앙사이버교육".italices()).bold()+"과 ".blink())

document.write(("함께".fontsize(5)).strike()+" 열심히".sup()+"배우자".sub()+"go".link("http://www.joins.com"))

 

document.write("<p></p><p></p><p></p><p></p><p></p><p></p><BR><BR><BR>")

document.write("[Top으로]".link("#top")+"<br>")

</script>

</head>

<body>

<font color=blue> 즐거운 하루 </font>

</body>

</html>


3. 날짜와 시간을 다루는 Date 객체

- 날짜와 시간을 표시하거나 설정하는데 사용하는 객체

- 형식

    Date객체명 = new Date()

    Date객체명.method

- 예

    today = new Date();

    today.getFullYear();

    today.getMonth();

 

  ----------------------------------------------------

      method          |               설명

  ----------------------------------------------------

   getFullYear()     | 년도를 return  Cf. getYear()

  ----------------------------------------------------

   getMonth()       | 달을 return(0~11)

  ----------------------------------------------------

   getDate()          | 일을 return(1~31)

  ----------------------------------------------------

   getDay()           | 요일을 return(0~6)

  ----------------------------------------------------

   getHours()        | 시간을 return(0~23)

  ----------------------------------------------------

   getMinutes()     | 분을 return(0~59)

  ----------------------------------------------------

   getSenconds()  | 초를 return(0~59)

  ----------------------------------------------------

   setDate()          | 일을 설정

  ----------------------------------------------------

   setFullYear()     | 년도를 설정

  ----------------------------------------------------

 

<html>

<head>

<script lanuage="javascript">

<!--

var ex= new Date();

document.write("ex의 값 : "+ ex + "<br>")

document.write("오늘의 일자 : " +ex.getDate()+"<br>")

document.write("오늘의 요일 : " +ex.getDay()+"<br>")

document.write("현재 달 : " +ex.getMonth()+"<br>");

document.write("현재년도 : " +ex.getFullYear()+"<br>")

document.write("사용자 컴퓨터와 GMT상의 시간차 : "+ex.getTimezoneOffset()+"<br>")

document.write("GMT 날짜 : " +exGMTString()+"<br>")

document.write("현재 날짜 시간 : "+ex.toLocaleString()+"<br>")

document.write("출력형식 : "+ex.toString()+"<br>")

//-->

</script>

</head>

<body>

</body>

</html>


4. 계산을 위한 Math 객체

- 수학 계산을 위해 사용되는 객체

- 형식

    Math.method

    Math.property

- 예

    Math.PI

    Math.rondom()

 


5. 함수를 만들어 주는 Function 객체

- 함수를 만들때 사용하는 객체

- 형식

    변수명 = new Function(전달변수1, 전달변수2,...)

- 예

    test = new Function("a","b","return (a+b)");

    document.write(test(3,5))


<script language="javascript">

<!--

ex = new Function("a", "b", "c", "return (a+b+c)/3")

document.write(ex(30,50,90)+"<br>")

 

function ex3(a,b,c)

{

   document.write("ex3 함수 호출 : ")

   document.write((a+b+c)/3)

}

 

ex3(30.50.90)

//-->

</script>


6. 화면 해상도 및 색상 관련 객체

- Local 컴퓨터의 화면의 해상도나 색상에 관한 정보를 알기 위한 객체

- 형식

    screen.method

- 예

    height = screen.availHeight

    document.write("화면높이"+height)

 

  ----------------------------------------------------

      method        |               설명

  ----------------------------------------------------

   availHeight()   | 실제 화면에 보여지는 화면의 높이 반환

  ----------------------------------------------------

   availWidth()    | 실제 화면에 보여지는 화면의 너비를 반환

  ----------------------------------------------------

   colorDepth()   | 사용가능한 색상수 반환

  ----------------------------------------------------

   height()         | 픽셀당 화면의 높이 반환

  ----------------------------------------------------

   width()          | 픽셀당 화면의 너비 반환

  ----------------------------------------------------

   pixelDepth()   | 픽셀당 비트수 반환

  ----------------------------------------------------

 

7. 문자열을 숫자로 바꾸어주는 Number 객체

- 문자로된 숫자 단어를 실제 숫자로 바꾸어주는 객체

- 형식

    Number("숫자문자열")

- 예

    Number("15")

 


8. true.false를 return하는 Boolean 객체

- bool형식의 값을 가지는 객체를 만들어주는 객체

- 형식

    변수명 = new Boolean(매개변수)

- 예

    booltest = new Boolean(15)  // true

 


9. 발생하는 이벤트와 관련된 evert 객체

- 자바스크립트에서 발생하는 이벤트에 관한 속성 정보 알려주는 객체

- 형식

    I.E : window.event.property

           window.event.method

    N.C : 함수의 매개변수.property

            함수의 매개변수.method

- 예

    window.alert(event.clientX, event.clientY)

 

  ----------------------------------------------------

      method        |               설명

  ----------------------------------------------------

   button            | 마우스를 누른 상태

  ----------------------------------------------------

   clientX           | 윈도우 영역의 마우스의 X좌표

  ----------------------------------------------------

   clientY           | 윈도우 영역의 마우스의 Y좌표

  ----------------------------------------------------

   keyCode        | 키보드가 눌렸을 경우 키의 Ascii 코드값 반환

  ----------------------------------------------------

   returnValue    | 이벤트에서 발생한 값을 설정

  ----------------------------------------------------

   srcElement     | 이벤트를 발생한 객체를 설정

  ----------------------------------------------------

   screenX        | 전체화면에서 X좌표 설정

  ----------------------------------------------------

   screenY        | 전체화면에서 Y좌표 설정

  ----------------------------------------------------

   toElement      | 마우스 포인터가 위치해 있는 객체 설정

  ----------------------------------------------------

 

<html>

<head>

<script language="javascript">

<!--

function ex(ev)

{

   alert("x좌표= "ev.clientX+", "+"y좌표= "+ev.clientY)

}

 

function test(str)

{

   if(str)

      alert("Welcome To My Homepage ^0^")

   else

      alert("GoodBye")

}

//-->

</script>

</head>

<body onclick="ex(event)" onload="test(true)" onunload="test(false)">

</body>

</html>


반응형

'컴퓨터 > JavaScript' 카테고리의 다른 글

자바스크립트 다섯번째 요약정리  (0) 2016.11.06
자바스크립트 네번째 요약정리  (0) 2016.11.06
자바스크립트 두번째 요약정리  (0) 2016.11.05
자바스크립트 첫번째 요약정리  (0) 2016.11.05
[Javascript] 아이프레임 링크 관련 소스  (0) 2016.11.02
'컴퓨터/JavaScript' 의 관련글
댓글(0)
Please Enable JavaScript!
Mohon Aktifkan Javascript![ Enable JavaScript ]

티스토리툴바