[JavaScript] object

객체, object

JavaScript에는 클래스가 없다. 하지만 내장 객체를 제공한다.

 

1. 내장 객체

Array, Date, Math, Object 등

new Array()

new Date()

Math.메소드()

 

2. BOM 객체

window, document, form, text, button 등

 

3. DOM 객체

element, attribute, text, comment 등 (create 문을 통해 만들 수 있는 객체)

 

4. 사용자 정의 객체

JavaScript에는 클래스가 없어 원하는 형태의 객체를 생성하기 어렵다.

사용자 정의 객체를 사용하면 원하는 형태의 객체를 만들 수 있다.

 

객체 생성 방법

Object 내장 객체를 사용한다.

const obj1 = new Object();

객체 리터럴 표기법을 사용한다. (리터럴 : {})

const obj2 = {};

 

 

 

 

 

 

        //JavaScript 프로퍼티 표기법
        //멤버접근 연산자 사용
        hong.tel = '010-1234-5678';

        // map형태 사용
        hong['tel'] = '010-1234-5678';

 

평상시에는 멤머접근 연산자를 사용하고 key가 필요할 때는 map형태를 사용한다.

 

        //변수 대입 가능
        let key = 'tel';
        hong[key] = '010-1234-1234';

        //변수로서 가질 수 없는 문자열을 사용할 때
        hong['primary-phone'] = '010-1234-5678';

 

JavaScript 객체 만들기

1. 빈 객체를 만든다.

new Object

 

2. 원하는 프로퍼티를 추가한다.

객체에 프로퍼티를 자유롭게 추가할 수 있다.

 

리터럴 표기법

    <script>
        const part = {};

        park.name = '박문수';
        park.age = 40;
        park.adress = '서울시 강남구 역삼동';
    </script>

 

 

    <script>
        const part = {name: '박문수', age: 40, adress: '서울시 강남구 역삼동'};
    </script>

 

 

객체 안에 또다른 객체를 넣을 수도 있다.

    <script>
        const address = {
            si: '서울시',
            gu: '강남구',
            dong: '역삼동'
        };

        const you = {
            name: '유재석',
            age: 30,
            address : address       //객체 안에 또다른 객체
        };
    </script>

 

    <script>
        
        const you = {
            name: '유재석',
            age: 30,
            address : {
            si: '서울시',
            gu: '강남구',
            dong: '역삼동'
        }
        };
    </script>

 

    <script>
        const you = {
            name: '유재석',
            age: 30,
            address : {
            si: '서울시',
            gu: '강남구',
            dong: '역삼동'
        }
        };

        console.log(you.name);
        console.log(you.address);
        console.log(you.address.dong);
    </script>

 

메소드 생성

    <script>
        //메소드 만들기

        const yang = {
            name: '양세찬',
            age: 25,
            hello: m1
        };

        function m1() {
            alert('메소드');
        }

        yang.hello();


    </script>