HTML 기초 ( PPT 9 정리 + 수업내용 정리 ) 자바스크립트객체

객체의 종류 

- 내장 객체 (built-in object ) : 생성자가 미리 작성되어 있다. 

window 가 최상위 객체이다.  ( Array 객체, Date 객체, Number 객체, String 객체, Math 객체 ) 

-사용자 정의 객체 ( custom object ) : 사용자가 생성자를 정의한다. 



내장객체들은 생성자를 정의하지 않고도 사용이 가능하다 ex ) Date, String , Array 



객체 생성 


- 객체를 객체 리터럴로부터 직접 생성한다. 

- 생성자 함수를 이용하여 객체를 정의하고 new 연산자를 통하여 객체의 인스턴스를 생성한다. 


객체 상수로부터 객체 생성


var myCar {

    model : "520d" , 

    speed : 60 , 

    color : "red" ,    객체의 속성

    brake : function () {this.speed -= 10 ; }, 

    accel : function () {this.speed += 10 ; }   객체의 메소드 


};


myCar.color ="yellow"; 

myCar.brake(); 









자바스크립트의 객체는 동적이다. myCar 에 name 이라는 변수가 없어도 

밑에다가 myCar.name= 이렇게 추가해줄 수 있다.  -> myCar 의 틀에는 들어가지 않고 일시적으로 들어가는 것이다. 



객체 생성 예제 



<html>

<body>

<script>

    function Car(model, speed, color ) {

        this.model = model;

        this.speed = speed; 

        this.color = color; 

        this.brake = function () {

            this.speed -= 10 ; 

       }

        this.accel = function () {

            this.speed += 10 ; 

            }

        }


        myCar = new Car ("520모델d" , 60 , "red") ; 

        document.write(" : " + myCar.model + "속도 : " + myCar.speed + "<br>"); 

        myCar.accel();

        document.write("모델 : " + myCar.model + "속도 : " + myCar.speed + "<br>");

        위에 accel() 함수로 인해서 myCar.speed 가 변해서 찍힌다. 

  </script>

</body>

</html> 


객체에 속성과 메소드 추가 

처음에 만든 틀 ( 객체틀 자체가 변하지 않고 = 생성자 함수는 변경할 필요가 없다. ) 에서 속성을 추가할 필요가 없다.


myCar.turbo = true; 이렇게 추가할 수도 있고

함수(메소드 ) 도 추가가능하다. 

myCar.showModel = function () {

    alert("모델은 " + this.model + "입니다. " ) 

}




내장 객체 1) Array 객체 


배열을 나타내는 객체 

var myArray = new Array (); 

    myArray[0] = "apple";

    myArray[1] = "banana";

    myArray[2] = "orange"; 


java script 의 배열

1. 배열의 크기가 자바와는 다르게 자동으로 조절된다.

2. 하나의 배열에 여러가지 자료형을 혼하해서 저장할 수 있다. ( 하나의 배열에 정수와 문자열을 동시에 저장하는 것이 가능하다. ) 


Array 배열 선언하는 종류 3가지 




Array 객체의 메소드 





Date 객체 


Date 객체는 날짜와 시간 작업을 하는데 사용되는 가장 기본적인 객체이다. 

new Date() // 현재 날짜와 시간

new Date(milliseconds) // 1970년 1월 1일 이후의 밀리초

new Date (dateString) 

new Date(year, month, date [hours [, minutes[, seconds[,ms]]]] 


Date 객체의 메소드 






String  객체 





String 메소드 









 객체 상수에 의한 객체 생성


myCar = {}; 

myCar.name = "홍길동"; 

선언후에 동적으로 속성을 추가해서 사용이 가능하다. 


rect = {} ; 

rect.width = 10; 


rect = {width : 10, height : 20, .......}

선언 후에 동적으로 속성 추가 사용 가능 

댓글